목록전체 글 (150)
On a couch
상황 프로젝트를 하는 내내 머리를 감싸쥐게 했던 것이 바로 axios와 jwt 토큰이 메인인 로그인 기능이었다. 이 기능들을 기본 함수와 커스텀 훅을 이용해 구현했는데, 이걸 axios interceptor로 리팩토링하려고 한다. 프로젝트를 진행할 당시에도 interceptor의 존재를 알았지만 안 썼던 이유는 간단하다. 프리 프로젝트를 할 때 직접 할 수 있는 일을 라이브러리를 도입해서 쓰려다가 오히려 더 복잡해진 경험이 있어서, 할 수 있어 보이는 일에 굳이 라이브러리를 쓰고 싶지 않아서였다. 보통 interceptor를 사용하는 이유를 찾으면 주로 이런 것이 나온다. 1) api 호출할 때마다 비효율적으로 axios 인스턴스를 생성 2) axios 마다 동일한 content-type , token와..
문제 더보기 문제 설명 나만의 카카오 성격 유형 검사지를 만들려고 합니다. 성격 유형 검사는 다음과 같은 4개 지표로 성격 유형을 구분합니다. 성격은 각 지표에서 두 유형 중 하나로 결정됩니다. 지표 번호성격 유형 1번 지표 라이언형(R), 튜브형(T) 2번 지표 콘형(C), 프로도형(F) 3번 지표 제이지형(J), 무지형(M) 4번 지표 어피치형(A), 네오형(N) 4개의 지표가 있으므로 성격 유형은 총 16(=2 x 2 x 2 x 2)가지가 나올 수 있습니다. 예를 들어, "RFMN"이나 "TCMA"와 같은 성격 유형이 있습니다. 검사지에는 총 n개의 질문이 있고, 각 질문에는 아래와 같은 7개의 선택지가 있습니다. 매우 비동의 비동의 약간 비동의 모르겠음 약간 동의 동의 매우 동의 각 질문은 1가지..
문제 더보기 문제 설명 최빈값은 주어진 값 중에서 가장 자주 나오는 값을 의미합니다. 정수 배열 array가 매개변수로 주어질 때, 최빈값을 return 하도록 solution 함수를 완성해보세요. 최빈값이 여러 개면 -1을 return 합니다. 제한사항 0 a-b); let freq = []; let temp = 0; let max_f = 0 let max_v = 0; // 다른 수가 나올 때까지 카운팅 for(let idx in sort){ temp += 1 if(sort[parseInt(idx)] !== sort[parseInt(idx) + 1]){ freq.push(temp) if(temp > max_f){ max_f = temp max_v = sort[parseInt(idx)] } temp = ..
문제 더보기 문제 설명 첫 번째 분수의 분자와 분모를 뜻하는 denum1, num1, 두 번째 분수의 분자와 분모를 뜻하는 denum2, num2가 매개변수로 주어집니다. 두 분수를 더한 값을 기약 분수로 나타냈을 때 분자와 분모를 순서대로 담은 배열을 return 하도록 solution 함수를 완성해보세요. 제한사항 0 (a % b === 0) ? b : GCD(b , a % b) const gcd = denum3 >= num3 ? GCD(denum3, num3) : GCD(num3, denum3) var answer = [denum3/gcd, num3/gcd]; return answer; }
어제 정답률 가장 낮은 걸 2시간동안 풀어서, 정답률 높은 건 훨씬 금방 풀 수 있겠다고 생각했는데 천만의 말씀이었다. 어제 그 속도가 메서드를 바로바로 검색해가면서 푼 속도였다는 걸 잊고 기고만장했다. 흑흑. 문제 더보기 네오는 평소 프로도가 비상금을 숨겨놓는 장소를 알려줄 비밀지도를 손에 넣었다. 그런데 이 비밀지도는 숫자로 암호화되어 있어 위치를 확인하기 위해서는 암호를 해독해야 한다. 다행히 지도 암호를 해독할 방법을 적어놓은 메모도 함께 발견했다. 지도는 한 변의 길이가 n인 정사각형 배열 형태로, 각 칸은 "공백"(" ") 또는 "벽"("#") 두 종류로 이루어져 있다. 전체 지도는 두 장의 지도를 겹쳐서 얻을 수 있다. 각각 "지도 1"과 "지도 2"라고 하자. 지도 1 또는 지도 2 중 어..
본격적으로 취준과 코테 준비가 시작되었다. 스터디에서 프로그래머스 문제 중 정답률 낮은 것들을 함께 시간 정해 풀기로 했는데 오랜만에 알고리즘 문제를 푸니 필요한 메서드들을 다 까먹어서, 기억을 더듬고 검색해 가면서 풀었다. 이런 메서드 잘 공부해두는 것도 중요하겠다. 문제 더보기 문제 설명 문제 설명 신입사원 무지는 게시판 불량 이용자를 신고하고 처리 결과를 메일로 발송하는 시스템을 개발하려 합니다. 무지가 개발하려는 시스템은 다음과 같습니다. 각 유저는 한 번에 한 명의 유저를 신고할 수 있습니다. 신고 횟수에 제한은 없습니다. 서로 다른 유저를 계속해서 신고할 수 있습니다. 한 유저를 여러 번 신고할 수도 있지만, 동일한 유저에 대한 신고 횟수는 1회로 처리됩니다. k번 이상 신고된 유저는 게시판 ..
메인 프로젝트에 접어들면서 '드디어 타입스크립트를 적용할 때인가..!'하고 두근두근했지만 '잘못하면 빨간줄 잡다가 끝날 수 있다'는 멘토님의 조언에 꿈을 잡깐 접었었다. 어제 수료했으니 자유의 몸(?)이 된 지금 다시 시작하련다. 시작에 앞서 이 아티클을 읽었는데 전반적인 목표를 가늠하는 데 도움이 되었다. 단계별 목표를 제시해 주어서 공부하는 중간중간 읽고 이정표를 세우기 좋을 것 같다. https://yozm.wishket.com/magazine/detail/1376/ TypeScript는 어떻게 공부해야 하나요? | 요즘IT 지금 현재 개발하는 상황을 보면 TypeScript는 피할 수 없는 하나의 대세가 된 것 같습니다. TypeScript가 나온 이후로 점점 TypeScript로 만들어지고 있는..
보호되어 있는 글입니다.
토큰 로그인.. 정말 우여곡절이 많았다. '완성'이라는 건 오류가 나지 않고 동작하도록 만들었다는 뜻이다. 사실상 오늘까지가 개발을 할 수 있는 마지막 날이고 이후부터는 발표 준비를 해야 했었는데, 오늘 오후까지도 해결이 되지 않아 너무 초조했다. 도대체 무엇이 오류인지 잡히지가 않아서, 맘먹고 노트에 손글씨로 flow를 적고 이에 맞춰 콘솔을 찍으면서 처음부터 전부 다 다시 되짚어 갔다. 그런 뒤 개발자도구 네트워크 탭에 찍힌 요청헤더-응답헤더-바디를 대조해 가면서 확인했더니, 예상치 못한 로그아웃의 원인은 바로 refresh token의 유효기간이 예상했던 3분이 아닌 1분으로 설정되어 전송된 것이었다. 이를 해결하고 났더니 그 주변의 자잘한 오류들(결정적인 원인을 찾지 못하게 만들었던)도 찾아 깔끔..
여차저차해서 토큰 검사하는 커스텀훅을 만들었다. 만들고 나서 생각해보니 이것도 hook이라서 컴포넌트 최상위에서만 불러올 수 있고 조건문 아래에서 실행할 수 없다는 것에 멘붕이 왔다. 이전에 만든 useGetCards에서 힌트를 얻어, 인증 과정이 진행중인지 외부에 알려주는 authLoading 상태를 만들었다. 이 훅을 불러오는 컴포넌트에서는 useEffect에서 authLoading과 그 외 필요한 dependency에 따라 화면을 보여주는 구조로 바꾸었다. https://couch.tistory.com/228 [메인 프로젝트] 토큰 검증 커스텀훅 / invalid hook call 에러 문제 상황 난생 처음 token 로그인 기능을 만들며 여기저기 부딪혔다. token 유효성 검사 기능은 여기저기에..