on
[스파르타코딩클럽] 웹 개발 종합반 - 4주차
[스파르타코딩클럽] 웹 개발 종합반 - 4주차
728x90
(1) 강의내용
Flask Flaks 패키지 설치 html 파일 불러오기 Get / Set
미니프로젝트1
미니프로젝트2
4주차 숙제
(2) Flask
Flask 란? 파이썬으로 작성된 웹 프레임워크 중 하나로, Werkzeug툴킷과 Jinja2 템플릿 엔진에 기반을 둔다.
Flask 패키지 설치 New Project를 통하여 Virtualenv(가상환경)을 같이 만들어 준 후 3주차 Python과 동일하게 Flask 패키지를 다운받는다. 이미 프로젝트가 있을경우 Terminal에서 명령어 python3 -m venv .venv를 입력해준 후 패키지를 다운받는다.
html 기본코드
from flask import Flask, render_template app = Flask(__name__) ## URL 별로 함수명이 같거나, ## route('/') 등의 주소가 같으면 안됩니다. @app.route('/') def home(): return render_template('index.html') if __name__ == '__main__': app.run('0.0.0.0', port=5000, debug=True)
html 파일 불러오기
@app.route('/login') def home(): return render_template('login.html')
Get / Set
@app.route('/login', methods=['GET']) //안쓸경우 GET def login_get(): return render_template('login.html') @app.route('/login', methods=['POST']) def test_post(): id_receive = request.form['id_give'] print(id_receive) return jsonify({'result':'success', 'msg': '이 요청은 POST!'})
(3) 미니프로젝트1 ,미니프로젝트2
모두의 책 리뷰
나홀로메모장
1~3주차동안 배운 내용을 통해 프로젝트를 만들고 Flask 서버로 실행시켜보기
(4) 4주차 숙제
app.py
from flask import Flask, render_template, jsonify, request app = Flask(__name__) from pymongo import MongoClient client = MongoClient('localhost', 27017) db = client.dbhomework ## HTML 화면 보여주기 @app.route('/') def homework(): return render_template('index.html') # 주문하기(POST) API @app.route('/order', methods=['POST']) def save_order(): userName_receive = request.form['userName_give'] count_receive = request.form['count_give'] userAddress_receive = request.form['userAddress_give'] userPhoneNumber_receive = request.form['userPhoneNumber_give'] doc = {'userName': userName_receive, 'count': count_receive, 'userAddress': userAddress_receive, 'userPhoneNumber': userPhoneNumber_receive, } db.orders.insert_one(doc) return jsonify({'msg': 'good'}) # 주문 목록보기(Read) API @app.route('/order', methods=['GET']) def view_orders(): orders = list(db.orders.find({}, {'_id': False})) return jsonify({'all_orders':orders}) if __name__ == '__main__': app.run('0.0.0.0', port=5000, debug=True)
index.html
스파르타코딩클럽 | 부트스트랩 연습하기 * { font-family: 'Play', sans-serif; } .TextGroup { text-align: left; margin-bottom: 30px; } .TextGroup_span { font-size: 20px; } .Exchange_Rate { text-align: left; color: blue; padding-bottom: 30px; } .InputGroup { margin-bottom: 20px; } .col-auto { margin-bottom: 15px; } .wrap { width: 600px; margin: auto; text-align: center; } .table { margin-top: 30px; } $(document).ready(function () { $.ajax({ type: "GET", url: "https://api.manana.kr/exchange/rate.json", data: {}, success: function (response) { let Exchange_Rate = response[1]['rate']; $('#Id_Exchange_Rate').text('달러-원 환율 : ' + Exchange_Rate); } }) getOrder(); }); function postOrder() { let userName = $('#inlineFormInputGroup').val(); let count = $('#inlineFormInputGroup2').val(); let userAddress = $('#inlineFormInputGroup3').val(); let userPhoneNumber = $('#inlineFormInputGroup4').val(); $.ajax({ type: "POST", url: "/order", data: { userName_give: userName, count_give: count, userAddress_give: userAddress, userPhoneNumber_give: userPhoneNumber }, success: function (response) { // 성공하면 alert(response["msg"]); window.location.reload(); } }) } function getOrder() { $.ajax({ type: "Get", url: "/order", data: {}, success: function (response) { // 성공하면 let orders = response['all_orders'] for (let i = 0; i < orders.length; i++) { let userName = orders[i]['userName']; let count = orders[i]['count']; let userAddress = orders[i]['userAddress']; let userPhoneNumber = orders[i]['userPhoneNumber']; let temp_html = `
(5) 느낀점
Flask프레워크를 처음알았지만 여러번의 반복학습으로 익숙해질수있었고, 이전 여러 프로젝트를 시작하는 경험은 많았지만 여러 이유로 포기한 적이 많았습니다. 이에 반해 스파르타 웹개발 종합반 1~4주차동안 하나 이상의 프로젝트를 완료한 것이 무척 만족스러웠습니다.
728x90
from http://dev-code-notepad.tistory.com/70 by ccl(A) rewrite - 2021-03-01 19:26:27