백엔드 영역
사용자의 요청이 들어올 때 마다 동적으로 웹페이지를 찍어내는 공장이다.
새터미널에 pip3 install flask 입력 : flask 설치
from flask import Flask
app = Flask(__name__)
@app.route("/")
def hello_world():
return "<p>Hello, World!</p>"
app.run()
터미널에서 Running on http://127.0.0.1:5000 (Press CTRL+C to quit)
-->Hello, World! 라고 뜨는 웹서버 완성!!
*visual studio code에서 선택항목비교를 하면 코드 비교 가능
Glitch
서버를 무료로 빌려주는 사이트
5분간 사용 안하면 꺼진다
Remix your own -> server.py 코드 확인
start.sh에서 python3로 변경해야함!
logs-->문제원인 찾을 때
routing
사용자가 주소를 치고 들어올 시 입력값(주소)을 처리하는 담당자 연결을 정리
@app.route("/") #사용자가 경로 입력 없이 들어왔을 때
def index(): #함수 이름은 상관x
return '<strong>random</strong> :'+str(random.random()) #출력값@app.route("/create/")
def create():
return 'Create'
#사용자가 주소창에 /create/ 입력시, 서버에서 지정한 함수 실행
-> 함수의 return값이 웹브라우저로 응답 -> Create에 출력 기존에 만들었던 웹페이지에서 li태그 중복
이러한 중복값을 데이터화 하자.
html의 데이터화 --> 딕션어리,리스트 조합하여 활용!
동적으로 li태그를 생성하기 위해서 우선 topics라고 하는 데이터 생성
topics = [
{"id":1, "title":"html", "body":"html is ...."},
{"id":2, "title":"css", "body":"css is ...."}
]topics의 원소를 하나하나 끄집어내려면?
liTags라는 변수를 하나 더 만든 후 초기화
topics를 for문으로 순환하면서 liTags 생성
이전 liTags와 더해준 다음 새로운 li태그값으로 추가하여 출력
liTags = ''
for topic in topics:
liTags = liTags + f'<li>{topic["title"]}</li>작은따옴표 두번 사용x
liTags+ 를 해주지 않으면? 마지막행만 출력됨(오버라이팅 되기 때문)
링크추가 시 li태그 사이에 아래 코드 입력
<a href="/read/{topic["id"]}/">{topic["title"]}</a>일일이 입력했던 li태그자리에 {liTags}라고 입력
결과적으로 아래와 같다.
@app.route("/")
def index():
liTags = ''
for topic in topics:
liTags = liTags + f'<li><a href="/read/{topic["id"]}/">{topic["title"]}</a></li>'
return f'''
<html>
<body>
<h1><a href="/">WEB</a></h1>
<ol>
{liTags}
</ol>
<h2>Welcome</h2>
Hello, World!
</body>
</html>
'''어려웠던 부분 / 해결방법 / 느낀점
오늘 수업 내용은 너무 헷갈렸다... 그래도 복습할 수 있는 영상이 있어서 정말정말 다행이다ㅜㅠ 오전 수업 영상부터 다시 보며 공부해보니 확실히 이해도가 올랐다. 저녁까지 마저 계속 공부해야겠다. 혼자 코드 작성은 못하더라도 이해는 꼭!! 하고 오늘 학습을 마무리 하려한다.
