[FLASK] 홈페이지 구현

FLASK

[FLASK] 홈페이지 구현

판다조아 2022. 11. 11. 09:58

이번엔 아래와 같이 HTML 코드를 작성하여
웹페이지를 표현해 보겠습니다!

from flask import Flask


app = Flask(__name__)


@app.route('/')
def index():
	return '''<!doctype html>
    <html>
    	<body>
        	<h1><a href="/">WEB</a></h1>
            <ol>
            	<li><a href="/read/1/">html</a></li>
                <li><a href="/read/1/">css</a></li>
                <li><a href="/read/1/">javascript</a></li>
            </ol>
            <h2>Welcome</h2>
            Hello, Web
        </body>
    </html>
    '''
    
    
@app.route('/create/')
def create():
    return 'Create'
    
@app.route('/read/<id>/')
def read(id):
    return 'Read '+id

실행하면 다음과 같은 웹페이지가 나옵니다.

표시된 부분의 데이터를 분리해서

파이썬의 데이터 구조로 만들고 동적으로 표현해 보겠습니다.

topics = [
    {'id':1, 'title': 'html', 'body': 'html is ...'},
    {'id':2, 'title': 'css', 'body': 'css is ...'},
    {'id':3, 'title': 'javascript', 'body': 'javascript is ...'}
]

순서가 있는 데이터이므로(1, 2, 3)

리스트를 사용하고

제목, id, 클릭했을 때 나오는 내용은 딕셔너리로

topics라는 변수에 담았습니다.

@app.route('/')
def index():
    liTags = ''
    for topic in topics:
        liTags = liTags + f'<li><a href="/read/{topic["id"]}/">{topic["title"]}</a></li>'
    return f'''<!doctype html>
    <html>
        <body>
            <h1><a href="/">WEB</a><h1>
            </ol>
                {liTags}
            </ol>
            <h2>Welcome</h2>
            Hello, Web
        </body>
    </html>
    '''

위와 같이 코드를 수정합니다.