TIL/WIL 부트캠프 1주차 회고 221120

2022. 11. 20. 20:30

이번주 월요일에 정식으로 부트캠프를 시작했고 벌써 첫번째 주의 마지막날이 되었습니다. 월요일에는 아무것도 모르는 백지상태에 가까웠다면, 이제는 JWT를 이용해서 회원가입, 로그인, 로그아웃을 구현할줄 알게 되었고, Github을 이용해서 팀 프로젝트를 완성했습니다. Rest API 형식을 따라서 API 설계도 해보고 MongoDB를 이용해서 DB 설계도 경험했습니다. flask의 Blueprint를 사용해서 효율적으로 분업을 했고 후에 merge할 때 충돌이 한번도 발생하지 않았습니다.

JWT를 활용한 로그인, 로그아웃, 회원가입 구현

JWT을 사용하는 이유
- 쿠키를 받아 토큰을 발급해서 로그인 정보 확인
- 쿠키는 브라우저에만 존재
- 같은 도메인이면 쿠키가 유지됨
- 로그아웃 하려면 쿠키 삭제하면 됨
- 보안상 더 낫다고 함
Hash 함수 사용 이유
- 비밀번호의 암호화
- Sha 256, Sha 512 를 많이 사용함
unix time: 1970년 1월 1일로부터 몇 초 지났는지

TIL 221114

TIL 부트캠프 정식 시작 JWT 로그인 구현하기 221114

드디어 오늘이 항해99 부트캠프 정식 시작일입니다. 지난주는 pre-onboarding 기간으로 주특기 언어인 Java를 공부하는 시간을 가졌습니다. 오늘부터 새로 배정된 조에서 미니 프로젝트를 진행합니다

pizzathedeveloper.tistory.com

아이디 중복확인

function id_overlap_check() {
    let userid = $('#user_id').val()
    if (userid == '') {
        alert('아이디를 입력해주세요.'); //공백인 경우
    } else {
        $.ajax({
            type: "GET",
            url: "/join/check?user_id=" + userid, //get 할 때 url은 "/url"+찾는값
            data: {},
            success: function (response) {
                alert(response['message']);
                if (response['success'] == false) {
                    let input = document.getElementById("user_id");
                    input.value = null; //input 값 없앰
                } else{$('.user_id').attr("check_result", "success");
                    $('.id_overlap_button').hide(); //중복확인버튼 없앰
                         }
                }
        });
    }
}

중복확인 필수로 하지 않으면 회원 가입이 되지 않게 만들기

.attr () 메소드를 이용해서 확인 되면 =="success" 로 변경이 되게 구현했습니다.

function join() {
    if ($('.user_id').attr("check_result") == "fail") {
        alert("아이디 중복체크를 해주시기 바랍니다.") //중복체크가 안되어 있을 때
    }
    else if ($('.name_input').val() == '') {
        alert("닉네임을 입력해주시기 바랍니다."); //닉네임 input 이 없을때
        $('.user_name').focus();
    } else if ($('.pw_input').val() == '') {
        alert('비밀번호를 입력해주세요.')
        $('.user_pw').focus(); //pw input이 공백인 경우
    } else {
        $.ajax({
            type: "POST",
            url: "/join/join",
            data: {
                id_give: $('#user_id').val(),
                pw_give: $('#user_pw').val(),
                name_give: $('#user_name').val()
            },
            success: function (response) {
                if (response['result'] == 'success') {
                    alert('회원가입이 완료되었습니다.')
                    window.location.href = '/login'
                } else {
                    alert('다시 시도하세요.')
                }
            }
        })
    }}

TIL 221116

TIL Merge 하고 다시 작업하기 아이디 중복확인 기능 로그인 JWT token 221116

오늘은 아침에 일어나는 게 너무 힘들었는데 막상 또 일어나서 컴퓨터 앞에 앉으니까 열정이 샘솟았습니다. 제가 어제 걱정하고 씨름했던 오류가 말끔히 해결이 되었거든요. 껐다 켰다는 진리

pizzathedeveloper.tistory.com

로그아웃 기능 구현하기

JWT 를 브라우저에서 지워주면 됩니다.

토큰은 클라이언트에서 저장하기 때문입니다.

jquery를 사용했습니다.

$.removeCookie('쿠키이름');

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script> //필요한 페이지에 이거 복붙해주세요.
    <title>logout</title>
    <script>
        function logout(){
        $.removeCookie('mytoken');
        alert('로그아웃!')
        window.location.href='/login'
      } //로그아웃 버튼 만들어서 붙이시면 됩니다
    </script>
</head>
<body>

<button onclick="logout()">로그아웃 하기</button>
</body>
</html>

미니프로젝트 '제2의 항해 매니저' github

https://github.com/sooni2/HanghaeManager

GitHub - sooni2/HanghaeManager

Contribute to sooni2/HanghaeManager development by creating an account on GitHub.

github.com

제 리포지토리에 올린 첫 프로젝트입니다.

뛰어난 조원분들과 함께해서 제가 기여한 부분이 메인은 아니지만 나름 맡은 역할을 다 했습니다.

제가 기획한 프로젝트가 채택되어서 기획쪽도 재미가 있다고 생각했습니다.

늘 저는 아이디어는 많습니다.

첫 코드리뷰를 진행하다

오늘은 함께 첫 프로젝트를 진행한 조원들과 함께 코드리뷰를 진행했습니다.

- 백에서 할수 있는 것은 최대한 백에서 처리하기

- API 설계를 아는 것이 중요하다

- 이번 프로젝트에는 Rest API 를 사용했음

- DB 설계에 맞춰 API 설계하기

저는 이번주에 시작한 완전 초짜지만 먼저 시작한 선배님들의 조언과 여러 피드백을 들으면서 월요일보다 성장한 것 같습니다. 함께한 조원분들이 성격도 좋고 개발도 잘해서 다행이었던 프로젝트였습니다.

다음 주에는...

이제는 자바스크립트를 뒤로 하고 자바에 집중하는 한주가 될 예정입니다. 오늘은 남궁성 자바의 정석 ch 5까지 들었습니다. 프로그래머스 알고리즘 문제를 지난 이틀간 풀었는데 아무래도 자바 기초가 부족하다 보니 간단한 문제도 방법을 몰라서 푸는 경우가 많았습니다. 문제 푸는 로직은 어느정도 이해는 갑니다. 더 많은 메소드를 알게 되면 알고리즘 문제 풀이가 좀 더 수월할 것 같습니다.

시그마로 푸는 문제가 하나 있었는데 언제 이걸 봤었지 했는데 고등학생인가 대학생때 통계학에서 배운 기억이 났습니다. 알고리즘 주차에 걷기반을 선택해서 28 문제를 푸는 것이 학습 목표인데 좀더 욕심을 내서 달리기 반의 문제 10개까지 추가를 해서 풀어보도록 하겠습니다.

저작자표시 비영리 변경금지

'TIL' 카테고리의 다른 글

TIL 알고리즘 모의고사 1~3 review 221122 (0)	2022.11.22
TIL 자바 java 프로그래머스 알고리즘 문제 풀기 221121 (0)	2022.11.21
TIL 자바 java 프로그래머스 알고리즘 문제 풀기 221119 (0)	2022.11.19
TIL 자바 공부 프로그래머스 과제 제출 221118 (0)	2022.11.18
TIL 1주차 미니프로젝트 발표 로그아웃 구현 221117 (0)	2022.11.18

개발자가 된 핏짜