Today I Learned 1일차..

웹 미니프로젝트 시작..

내가 맡은 파트는 우선 로그인/회원가입 화면이다.
기존 강의코드에서 닉네임 항목만 추가하는 거라 크게 어렵지 않다고 생각했는데..
그 하나 추가하는데에 생각보다 많은 작업이 있었다.

app.py 닉네임 추가

@app.route('/sign_up/check_dup_nick', methods=['POST'])
def check_dup_nick():
    nickname_receive = request.form['nickname_give']
    exists = bool(db.users.find_one({"nickname": nickname_receive}))
    return jsonify({'result': 'success', 'exists': exists})
    
    
@app.route('/sign_up/save', methods=['POST'])
def sign_up():
    username_receive = request.form['username_give']
    nickname_receive = request.form['nickname_give']
    password_receive = request.form['password_give']
    password_hash = hashlib.sha256(password_receive.encode('utf-8')).hexdigest()
    doc = {
        "username": username_receive,                               # 아이디
        "password": password_hash,                                  # 비밀번호
        "nickname": nickname_receive,                               # 닉네임
        "profile_name": username_receive,                           # 프로필 이름 기본값은 아이디
        "profile_pic": "",                                          # 프로필 사진 파일 이름
        "profile_pic_real": "profile_pics/profile_placeholder.png", # 프로필 사진 기본 이미지
        "profile_info": ""                                          # 프로필 한 마디
    }
    db.users.insert_one(doc)
    return jsonify({'result': 'success'})    

login.html 닉네임 추가

        function check_dup_nick() {
            let nickname = $("#input-nickname").val()
            console.log(nickname)
            if (nickname == "") {
                $("#help-nick").text("닉네임을 입력해주세요.").removeClass("is-safe").addClass("is-danger")
                $("#input-nickname").focus()
                return;
            }
            if (!is_nickname(nickname)) {
                $("#help-nick").text("닉네임의 형식을 확인해주세요. 2자 이상 16자 이하, 영어 또는 숫자 또는 한글로 구성").removeClass("is-safe").addClass("is-danger")
                $("#input-nickname").focus()
                return;
            }
            $("#help-nick").addClass("is-loading")
            $.ajax({
                type: "POST",
                url: "/sign_up/check_dup_nick",
                data: {
                    nickname_give: nickname
                },
                success: function (response) {

                    if (response["exists"]) {
                        $("#help-nick").text("이미 존재하는 닉네임입니다.").removeClass("is-safe").addClass("is-danger")
                        $("#input-nickname").focus()
                    } else {
                        $("#help-nick").text("사용할 수 있는 닉네임입니다.").removeClass("is-danger").addClass("is-success")
                    }
                    $("#help-nick").removeClass("is-loading")

                }

사실 기존 아이디부분 복사해서 수정하여 붙이는 작업이라 많이 어렵지는 않았는데,
회원가입 시 정규표현식에서 내 생각대로 적용이 되지 않는것 같아 애를 조금 먹었다.
단순히 nickname에 넣어야 할 것을 username에 넣고 계속 돌려보면서 username만 수정해서 그랬다.