내일배움캠프[4기_Reac트랙]/TIL

내일배움캠프 React트랙 3일차 회고 (2022.11.02)

ecoEarth 2022. 11. 3. 03:17

오늘은 프론트엔드의 작업물을 서버와 상호작용하기위한 기능을 구현하기하려했지만....

서버관련내용 복습이 제대로 이루어지지않아서 관련 내용을 하루종일 복습만 한 하루였다.

 

"무언가를 배운 후 새 파일에 꼭 다시한번 직접 구현해보자." 

 

 

오늘은 이러한 복습을 했다.

(더 많은 내용을 복습했지만 주요한 복습내용만 적었다.)

프로젝트 세팅

1. 새 프로젝트 -> 폴더선택 -> venv확인 -> 3.8버전확인 -> (이창에서 실행)창 클릭

2. 인터프리터 -> 패키지 설치 [Flask, pymongo, dnspython, certifi]


POST 연습(주문 저장)

구현해야할 기능 -> 이름, 주소, 평수값을 제출하고, 그 값을 서버에 저장하기 -> 저장이므로 POST방식 사용

  • 클라(ajax) → 서버(flask) : name, address, size 
  • 서버(flask) → 클라(ajax) : 주문완료확인 메세지 출력

 

function save_order() {
            let name = $('#name').val()
            let address = $('#address').val()
            let size = $('#size').val()

            $.ajax({
                type: 'POST',
                url: '/mars',
                data: {name_give:name, address_give:address, size_give:size},
                success: function (response) {
                    alert(response['msg'])
                    window.location.reload()
                }
            });
        }
<button onclick="save_order()" type="button" class="btn btn-warning mybtn">주문하기</button>

클라이언트(ajax) 

[버튼 클릭 → save_order함수 실행 → 변수가 각각 '변수_give'에 담김 -> 성공하면 메시지 출력됨]

@app.route("/mars", methods=["POST"])
def web_mars_post():
    name_receive = request.form['name_give']
    address_receive = request.form['address_give']
    size_receive = request.form['size_give']

    doc = {'name':name_receive,
           'address':address_receive,
           'size':size_receive
    }
    db.mars.insert_one(doc)

    return jsonify({'msg': 'POST 연결 완료!'})

서버(flask)

[mongoDB에 저장 → 메시지 출력]

 

 

오늘 느낀점은 이러하다.

1. 피곤한 상태라면 의견을 제시하기전에 한번이라도 더 "정말로 필요한 의견제시인가" 다시 생각해보기. 피곤하다보면 여러번 거칠 생각을 좀 더 짧게 생각하고 말하기때문에 '정말로 불필요한 의견'이 제시될 수 있다. 

2. 강의내용은 따라쳤고, 실행이 됐다고 해서 내 지식이 된 것이 아니다. 복습이 중요하다. 이때의 복습은 보통의 공부와 같이 다시한번 리마인드해주는 과정뿐 아니라, 다시한번 새 파일에 방금배운 내용을 다시 코드로 구현해보는 복습이 효율적인 것 같다. 이러한 복습과정속에서 강의내용을 보기만 할때에는 느끼지 못했던 코드의 작동원리를 깨우칠 수 있고 실수한 부분에서 생기는 오류를 직접 고치면서 추가적으로 배우는 내용도 생기기때문이다.

오늘 공부를 통해 배운 지식은 이러하다.

1. 파이썬 오류 KeyError 는 딕셔너리 키가 기존 키 집합에서 발견되지 않을 때 발생하게 된다.

2. 파이썬 에러: ModuleNotFoundError: No module named '모듈이름'은 모듈이 설치되지않아 생긴 오류이니 패키지를 설치해야한다.