내일배움단 11일메이킹챌린지 3일차

복습

오늘부터 서버를 만져볼거라 파이썬 서버 부분을 복습했다.
GET은 데이터를 가져오는 것, POST는 클라이언트에 데이터를 표시하는 것이다.

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

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

서버를 만드는 순서는 다음과 같다.

1. 클라이언트 서버 확인하기
2. 서버 만들기
3. 클라이언트 만들기
4. 확인하기

현재 과정은 1번과 2번이다!

프로젝트

일단 세계지도가 화면 크기에 딱 안맞아서 구글링을 했다.
프론트엔드 부분이지만, 팀 프로젝트에서 진행이 힘든 부분은 서로 돕고 살아야지..
마침 딱 맞는 Example이 있어서 사용해봤더니 다행히 적용이 된다! ㅠㅠ
더군다나 브라우저의 크기에 fitting 할 수 있어서 반응형 웹 개발에 아주 유용해보인다.

height: 100vh; //높이를 화면의 비율에 맞게 fitting
background-repeat: no-repeat; //repeat deny
background-position: center; //center로 정렬
background-size: cover; //size 페이지에 맞게 fitting
background: url("url") no-repeat center/cover; //call url

app.py 서버에서 city를 받는다.
받은 city를 DB에 대치하여 데이터를 가져올 것이다.

city_receive = request.args.get('city_give')
city = list(db.sky_for_u.find({'country':city_receive}, {'_id': False}))

index.html에서 받을 city의 데이터 함수 뼈대를 작성한다.

            function getData() {
                $.ajax({
                    type: "GET",
                    url: "/click",
                    data: {},
                    success: function (response) {

                    }
                })
            }