졸업작품을 하면서 로그인을 자체 로그인으로 구현했었는데 최근에 JWT Token을 사용하기로 했다.처음 사용해보는거라 개념부터 정리해보려 한다.⭐️ JWT Token?JSON Web Token의 약자로 Json 객체에 인증에 필요한 정보를 담은 후 비밀키로 서명한 토큰이다.=> 인증에 필요한 정보들을 암호화시켜서 Token에 담아 사용하는 것이다. 구성은 header, payload, signauture로 되어 있고, 점을 통해 구분된다.- header토큰 타입이나, 서명에 어떤 알고리즘이 사용되어 있는지 등을 저장한다.{ "alg": "HS256", "typ": "JWT"}alg는 어떤 알고리즘을 사용했는지, typ는 타입의 값을 나타낸다. - payload토큰에서 사용할 정보의 조각들인 clai..

프로젝트를 진행하면서 하나의 api를 여러 번 호출해서 결과를 한 번에 받고 싶었다.getKeywordPhotos는 키워드 별로 저장된 사진을 가져오는 api이다.키워드가 한 개가 아니라 여러 개이기 때문에 요청을 여러 번 보내야한다.키워드마다 한 번씩 요청 하는 것보다 한 번에 요청하는게 더 효율적인 방법이라 생각해서 구글링을 해보았고axios multiple request라는 것이 따로 있다는 걸 알아냈다! //키워드 별 사진 가져오기 const getPhoto = async (keywords, page, pageSize) => { try { const requests = keywords.map((keyword) => { return DiaryController.getKeywordP..

도커란어플리케이션을 패키징 할 수 있는 툴이다.컨테이너라고 불리는 하나의 작은 소프트웨어 유닛 안에 어플리케이션과 어플리케이션에 필요한 환경설정 등을 하나로 묶어서 다른 PC에서도 안정적으로 돌아갈 수 있도록 도와주는 툴이다.어플리케이션이 필요한 모든 소스들을 도커 컨테이너 안에 담는 것이다.(컨테이너 - 어플리케이션을 고립된 환경에서 구동하는 단위)도커를 사용하는 이유사람마다 개발 환경이 다른데, 도커를 사용하면 개발 환경과 운영 환경 사이의 차이로 인한 문제를 줄일 수 있다.내 PC에서는 잘 돌아가던게 다른 사람 PC에서는 돌아가지 않는 경우가 발생할 수 있는데,도커 사용으로 이런 문제를 해결할 수 있다.또한 이것저것 설치하고 설정해줘야하는 번거로움을 해결해준다!VM(가상머신) vs Containe..

Todo 프로젝트에서 Todo 항목마다 네모 박스를 누르면 드롭다운 메뉴가 나타나는 기능을 구현하고 있었다. 메인화면에 Todo 리스트가 있고, 리스트마다 네모 박스를 누르면 드롭다운 메뉴가 뜨도록 해뒀다. 드롭다운 메뉴가 화면에 하나만 뜨도록 하고 싶었는데 여러 개가 뜨는 문제가 생겼다. 이걸 어떻게 해야하나 고민하고 있던 와중에 onBlur 이벤트를 발견했다! onBlur와 onFoucs가 세트(?)로 알아야하는 개념인 것 같아서 둘 다 정리해보자~! onFocus 해당 함수를 달아놓은 엘리먼트에 포커스가 됐을 때 호출된다. onBlur 해당 함수를 달아놓은 엘리먼트에 포커스가 사라졌을 때 호출된다. 적용 onBlur 이벤트에 드롭다운을 닫는 함수를 등록해서 드롭다운에 포커스가 사라지면 드롭다운이 닫..

시간복잡도란?시간복잡도란 알고리즘의 성능을 설명하기 위해 사용하는 것이다.연산을 몇 번 수행하는가?를 식으로 나타낸 것이다.여기서 드는 의문은 시간복잡도인데 왜 시간이 아니라 왜 연산 횟수로 판단하지?? -> 컴퓨터의 하드웨어나 어떤 언어를 사용하는지에 따라 달라지기 때문에 연산 횟수만 고려하는 것 빅오 표기법(Big-O)?빅오 표기법은 시간복잡도를 나타내는데 사용하는 점근적 표기법이다.점근적 표기법에는 최상의 경우를 나타내는 오메가 표기법, 평균의 경우를 나타내는 세타 표기법, 최악의 경우를 나타내는 빅오 표기법이 있다.이 중 빅오 표기법을 사용하는 이유는 최악의 경우에 걸리는 시간을 계산하여 이 알고리즘을 사용했을 때의 성능을 보장할 수 있기 때문이다.(최악의 경우인데도 이 정도밖에 안걸린다!라고 자..

문제링크 https://school.programmers.co.kr/learn/courses/30/lessons/258705 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 접근방법 처음 문제를 읽고 어떻게 풀어야 할 지 감이 잡히지 않았다. 손으로 하나씩 그려보면서 규칙을 찾아보려 했는데.. 복잡하기도 하고 눈에 띄는 규칙도 안보였다. 구글링을 해서 답을 얻으려고 했지만 다른 블로그들을 보고도 이해하기가 쉽지 않았다. 그러다 카카오에서 작성한 해설을 보게 되었는데 가장 이해가 잘됐다!! 링크는 아래 첨부해두겠습니다~! 문제풀이 타일을 채울 수 있는 방법은..