JWT(JSON Web Token)이란? 배경 지식 인증 (Authentication) 인증은 사용자의 신원을 확인하는 프로세스를 의미한다. 사용자가 시스템 또는 서비스에 로그인할 때, 사용자의 아이디와 비밀번호, 생체 인식, 토큰 또는 다른 인증 수단을 통해 사용자가 누구인지 확인하는 것을 뜻한다. 즉, 인증은 “누구”를 확인하는 프로세스라고 생각하면 된다. 인가 (Authorization) 인가는 인증된 사용자가 특정 리소스 또는 기능에 액세스 할 수 있는 권한을 결정하는 프로세스를 의미한다. 사용자가 로그인에 성공하여 시스템에 액세스했을 때, 인가는 해당 사용자에 대한 권한을 관리하고 이 권한을 기반으로 사용자가 특정 리소스에 접근할 수 있는지를 결정한다. 즉, 인가는 “무엇”에 액세스 할 수 있는지를 결정하는 프로세스로, 사용자의 권한을.. 2023. 11. 4. [알고리즘] 프로그래머스 - 바탕화면 정리 (JS) ✅ 문제 코딩테스트를 준비하는 머쓱이는 프로그래머스에서 문제를 풀고 나중에 다시 코드를 보면서 공부하려고 작성한 코드를 컴퓨터 바탕화면에 아무 위치에나 저장해 둡니다. 저장한 코드가 많아지면서 머쓱이는 본인의 컴퓨터 바탕화면이 너무 지저분하다고 생각했습니다. 프로그래머스에서 작성했던 코드는 그 문제에 가서 다시 볼 수 있기 때문에 저장해 둔 파일들을 전부 삭제하기로 했습니다. 컴퓨터 바탕화면은 각 칸이 정사각형인 격자판입니다. 이때 컴퓨터 바탕화면의 상태를 나타낸 문자열 배열 wallpaper가 주어집니다. 파일들은 바탕화면의 격자칸에 위치하고 바탕화면의 격자점들은 바탕화면의 가장 왼쪽 위를 (0, 0)으로 시작해 (세로 좌표, 가로 좌표)로 표현합니다. 빈칸은 ".", 파일이 있는 칸은 "#"의 값을 .. 2023. 9. 19. [알고리즘] 프로그래머스 - 미로탈출 (JS) ✅ 문제 1 x 1 크기의 칸들로 이루어진 직사각형 격자 형태의 미로에서 탈출하려고 합니다. 각 칸은 통로 또는 벽으로 구성되어 있으며, 벽으로 된 칸은 지나갈 수 없고 통로로 된 칸으로만 이동할 수 있습니다. 통로들 중 한 칸에는 미로를 빠져나가는 문이 있는데, 이 문은 레버를 당겨서만 열 수 있습니다. 레버 또한 통로들 중 한 칸에 있습니다. 따라서, 출발 지점에서 먼저 레버가 있는 칸으로 이동하여 레버를 당긴 후 미로를 빠져나가는 문이 있는 칸으로 이동하면 됩니다. 이때 아직 레버를 당기지 않았더라도 출구가 있는 칸을 지나갈 수 있습니다. 미로에서 한 칸을 이동하는데 1초가 걸린다고 할 때, 최대한 빠르게 미로를 빠져나가는데 걸리는 시간을 구하려 합니다. 미로를 나타낸 문자열 배열 maps가 매개변.. 2023. 9. 18. [알고리즘] 프로그래머스 - 시소짝궁(JS) ✅ 문제 어느 공원 놀이터에는 시소가 하나 설치되어 있습니다. 이 시소는 중심으로부터 2(m), 3(m), 4(m) 거리의 지점에 좌석이 하나씩 있습니다. 이 시소를 두 명이 마주 보고 탄다고 할 때, 시소가 평형인 상태에서 각각에 의해 시소에 걸리는 토크의 크기가 서로 상쇄되어 완전한 균형을 이룰 수 있다면 그 두 사람을 시소 짝꿍이라고 합니다. 즉, 탑승한 사람의 무게와 시소 축과 좌석 간의 거리의 곱이 양쪽 다 같다면 시소 짝꿍이라고 할 수 있습니다. 사람들의 몸무게 목록 weights이 주어질 때, 시소 짝꿍이 몇 쌍 존재하는지 구하여 return 하도록 solution 함수를 완성해주세요. ✅ 풀이 제한사항을 확인했을 때, weights의 길이가 최대 100,000이기 때문에 이중 반복문을 사용.. 2023. 9. 18. 상태 끌어올리기 (feat. 제어 컴포넌트 & 비제어 컴포넌트) ✅ 컴포넌트 간의 상태공유 두 컴포넌트의 상태가 항상 동시에 변경되기를 원할 때는 각각의 컴포넌트에서 상태를 제거하고, 가장 가까운 공통 부모 컴포넌트로 이동한 다음에 이를 props를 통해서 자식 컴포넌트에 전달하는 방식을 사용하자. 이를 상태 끌어올리기(Lifting state up)라고 한다. 상태 끌어올리기 예제 아래 예제에서는 부모 컴포넌트인 Accordion이 두 개의 Panel 컴포넌트를 렌더링한다. 각각의 Panel 컴포넌트는 isActive 라는 boolean 상태를 가지고 있으며 이 상태에 따라 해당 Panel의 내용이 보이거나 감추어진다. (한 패널의 버튼을 클릭했을 때, 다른 패널에 영향을 주지 않는 독립적인 방식에 주목하자.) // App.js import { useState } .. 2023. 9. 17. [알고리즘] 프로그래머스 - 영어 끝말잇기 (JS) ✅ 문제 1부터 n까지 번호가 붙어있는 n명의 사람이 영어 끝말잇기를 하고 있습니다. 영어 끝말잇기는 다음과 같은 규칙으로 진행됩니다. 1번부터 번호 순서대로 한 사람씩 차례대로 단어를 말합니다. 마지막 사람이 단어를 말한 다음에는 다시 1번부터 시작합니다. 앞사람이 말한 단어의 마지막 문자로 시작하는 단어를 말해야 합니다. 이전에 등장했던 단어는 사용할 수 없습니다. 한 글자인 단어는 인정되지 않습니다. 다음은 3명이 끝말잇기를 하는 상황을 나타냅니다. tank → kick → know → wheel → land → dream → mother → robot → tank 위 끝말잇기는 다음과 같이 진행됩니다. 1번 사람이 자신의 첫 번째 차례에 tank를 말합니다. 2번 사람이 자신의 첫 번째 차례에 k.. 2023. 9. 10. 이전 1 2 3 4 ··· 8 다음
