Week I Learned

[항해99] 사전준비 웹개발종합반 4주차

K World 2021. 12. 25. 03:30
728x90

개발일지 쓰는 거 까먹고 5주차 강의 듣다가 갑자기 생각나서 쓰러 들어왔다.

 

 

나는 4주차에 무엇을 했느냐?

 

 

1. Flask 패키지 설치

직접 내 컴퓨터에 서버를 만들어본다. 이를 위해 Flask 패키지를 먼저 설치한다. Flask 패키지는 서버를 구동시켜주는 코드들을 모아놓은 것이다. 그래서 서버를 구동할 때 편하게 가져다 쓸 수 있게 해준다. http://localhost:5000/ 로 서버에 접속한다.

 

from flask import Flask
app = Flask(__name__)

@app.route('/')
def home():
   return 'This is Home!'

@app.route('/mypage')
def mypage():  
   return 'This is My Page!'

if __name__ == '__main__':  
   app.run('0.0.0.0',port=5000,debug=True)

 

위는 Flask 시작코드.

 

 

2. Flask 폴더 구성

Flask 서버를 만들 때 꼭 지켜야하는 폴더 구성이 있다. 프로젝트 폴더 안에는 templates 폴더, static 폴더 그리고 app.py를 꼭 넣어야한다. 그리고 templates 폴더 안에는 index.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)

 

위 코드 첫 번째 줄에 있는 render_template은 flask의 내장함수 이다. 이를 통해 templates 파일에 있는 index.html을 불러오는 것이다.

 

 

3. API 만들기, Post 와 Get

API를 쉽게 비유하자면 은행 창구라고 할 수 있다. 클라이언트와 서버 사이에서 처리를 해주는 것이다. 클라이언트가 요청을 하면 API는 중간에서 받아 서버에 알려준다. 이때 요청을 하는 방식에서는 Post 와 Get 이 있다. Post는 입력, 수정, 삭제를 요청할 때 사용하고, Get은 조회를 요청할 때 사용한다. 왜냐하면 Post는 바로 보이지 않는 value 형태로 전달하지만, Get은 'google.com?q=내가쓴거다보임' 과 같은 형태로 바로 보이기 때문이다. 내 정보의 보안을 위해 바로 보이면 안 되기 때문에 이렇게 나눠서 사용한다. 

 

@app.route('/test', methods=['GET'])
def test_get():
   title_receive = request.args.get('title_give')
   print(title_receive)
   return jsonify({'result':'success', 'msg': '이 요청은 GET!'})

 

 

위는 Get 요청 API 코드

 

@app.route('/test', methods=['POST'])
def test_post():
   title_receive = request.form['title_give']
   print(title_receive)
   return jsonify({'result':'success', 'msg': '이 요청은 POST!'})

 

위는 Post 요청 API 코드

 

 

4. 실습과 숙제.

모두의 책 리뷰, 나홀로 메모장을 실습했다. 그리고 숙제는 2주차에 했던 쇼핑몰 페이지에 기능을 하나 추가하는 것이었다. 이름, 수량, 주소, 폰번호를 입력후 주문버튼을 눌러서 POST로 정보를 보낸다. 그럼 보낸 정보를 서버에 저장한다. 그 다음 Get으로 서버에 저장되어 있던 것을 모두 찾아온다. 그리고 찾아온 정보들을 페이지 하단에 붙여서 보여준다. 

 

새로 추가된 하단의 주문목록

 

1주차의 간단했던 모습에서 점점 기능이 추가되어가고 있다.

 

 

(추가)

 

유효성 검사부분 추가완료

 

천사 천재 팀원분 덕분에 유효성 검사부분을 추가했다. 기쁘다!

 

728x90