생활코딩

Coding Everybody

코스 전체목록

닫기

홈페이지 구현

수업소개

홈페이지를 구현해봅시다.

 

 

 

강의

 

 

 

요약

1. 아래의 코드를 server.py에 적용합니다.  

from flask import Flask
import random

app = Flask(__name__)


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


@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>
    '''


@app.route('/create/')
def create():
    return 'Create'


@app.route('/read/<id>/')
def read(id):
    print(id)
    return 'Read '+id


app.run(debug=True)

변경사항 : https://github.com/egoing/flask-tutorial-src/commit/3d881715421d1ab5caf6ba0652a66677d7f5d170

 

2. 아래 코드는 복수의 데이터를 파이썬의 데이터로 전환하는 모습니다. 

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

동급의 데이터(각각의 글들)은 리스트로 표현하고, 
데이터의 속성(id, title, body)은 딕셔너리로 표현했습니다. 

 

3. HTML 코드를 동적으로 생성하고 있는 모습입니다. 

    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>

 

댓글

댓글 본문
  1. 루미꼬짱
    감사합니다.
  2. Lithium3
    지식을 늘려가는 과정에서 나오는 기쁨. 계속 유지하고 싶습니다.
버전 관리
egoing
현재 버전
선택 버전
graphittie 자세히 보기