항해 99 2일차 (개인 공부)
항해 99의 2일차가 시작됐다.
시간은 많은 듯 보이지만 정신차려보면 새벽이다..
1. jinja template의 기초를 배워보자!
-1 : 서버에서 word 객체에 "안녕"을 할당해 render_template의 html파일과 함께 리턴해준다
@app.route('/detail')
def detail():
word = "안녕!"
return render_template("detail.html" , word = word)-2 : 클라이언트에서 진자 문법을 활용해 {{리턴받은 객채명}}으로 호출하여 사용이 가능하다.
<h3>{{name}}안녕!</h3>
2. 서버에서 데이터를 정돈 , 클라이언트에서 사용해보자!
-1 : 서버에서 requests.get("url")을 통하여 데이터를 GET -> r 객체에 할당.
-2 : r 객체에 담긴 데이터를 json 타입으로 변환 후 response객체에 할당.
-3 : response의 데이터중 필요한 값만을 인덱스하여 rows에 할당한 후 클라이언트에 리턴한다.
@app.route('/detail')
def detail():
#request.get("url")로 url에 접근해서 데이터를 받아 r객체에 할당한다.
r = requests.get('http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99')
#r객체에 담긴 데이터를 r.json() -> json타입으로 변환해준 후 response객체에 할당한다.
response = r.json()
#response 객체의 데이터중 필요한 데이터를 인덱스 , rows객체에 할당한다.
rows = response['RealtimeCityAir']['row']
return render_template("detail.html" , rows = rows)-1 : 서버에서 받아온 데이터를 jinja template을 활용하여 즉시 POST가 가능하다.
<li>{{ rows[0]["MSRSTE_NM"] }}: {{rows[0]["IDEX_MVL"]|int}}</li> |int = 데이터 타입 정의가능-2 : 서버에서 받아온 데이터를 jinja template을 활용하여 클라이언트에서 객체할당 -> POST가 가능하다.
{% set gu_name = rows[0]["MSRSTE_NM"] %}
{% set gu_mise = rows[0]["IDEX_MVL"] %}
<li>{{ gu_name }}: {{gu_mise|int }}</li>3-1. 클라이언트에서 jinja for문 , if문을 사용해보자!!
-1 : 클라이언트에서 jinja for문을 활용하여 데이터를 인덱스한 후 즉시 POST
-2 : 진자에서는 {%endfor%}과 같이 for문의 종료를 선언해주어야 한다.
-2-1 : 이유는? #html 에서는 python과 같이 들여쓰기를 통한 구분이 불가능하기 때문!
<ul id="gu_list">
{# jinja의 for문 선언 #}
{% for row in rows %}
{% set gu_name = row["MSRSTE_NM"] %}
{% set gu_mise = row["IDEX_MVL"] %}
<li>{{ gu_name }}: {{gu_mise|int }}</li>
{% endfor %}
{# jinja의 for문 종료선언 #}
</ul>3-2 : 클라이언트에서 if문을 사용하여 조건을 할당하기
1. if문을 통하여 post될 데이터의 조건 할당이 가능하다.
2. for문과 같이 {% endif %}로 if문의 종료를 선언해주어야 한다!
{% for row in rows %}
{% set gu_name = row["MSRSTE_NM"] %}
{% set gu_mise = row["IDEX_MVL"] %}
{% if gu_mise > 60 %}
<li>{{ gu_name }}: {{gu_mise|int }}</li>
{% endif %}
{% endfor %}4 : 브라우져의 주소창을 통하여 데이터를 받아보자!
4-1 : http://진자프레임워크를공부해보자/detail?word_give=hi ->
?word_give=hi : word_give라는 객체에 = hi를 할당하여 서버로 return할거야
4-1-2 : 서버에서 데이터를 확인해보자
word_receive = request.args.get("word_give")
print(word_receive)4-1-3 : 아래 사진처럼 서버에 hi가 정상적으로 출력된다!
5 : 브라우져의 주소창을 통하여 데이터를 받아 객체화 , 리턴해보자!
@app.route('/detail/<keyword>') #url / <위치>에 들어가는 데이터를 keyword 객체에 담는다.
def detail(keyword): #해당 객체를 함수의 파라미터로 할당
#request.get("url")로 url에 접근해서 데이터를 받아 r객체에 할당한다.
r = requests.get('http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99')
#r객체에 담긴 데이터를 r.json() -> json타입으로 변환해준 후 response객체에 할당한다.
response = r.json()
#response 객체의 데이터중 필요한 데이터를 인덱스 , rows객체에 할당한다.
rows = response['RealtimeCityAir']['row']
word_receive = request.args.get("word_give")
return render_template("detail.html" , rows = rows , word = keyword)
돌아보기
99일의 둘째날 생각보다 시간이 너무 빠르게 흘러간다.
프로젝트의 프론트엔드를 마무리했으나 개인 공부를 많이 못한 것 같아
발전하는 느낌보단 제자리걸음중인 기분
조급한 마음이 발목을 잡지않게 조금 여유를 가지고
하루 하루 지나감에 틀림없이 발전함을 믿으며 열심히 달려갈 수 있기를
이제 프로젝트 게시글 쓰러가야지...
3월 9일 오전 2:41
항해 타이머 17:01:14