본문 바로가기

All

 (78)
[Error] Error: NEXT_REDIRECT Error: NEXT_REDIRECT 로그인에 성공하면 메인페이지로 이동하는 코드를 구현했는데 위와 같은 에러가 발생했다. redirect에서 난 오류인 것 같았다. const handleLogin = async () => { ... else if (result.status === 'SUCCESS') { alert('로그인에 성공했습니다.'); redirect('/dashboard'); } } 검색 결과, next/navigation의 redirect를 클라이언트 컴포넌트에서 사용해서 난 에러였다. redirect는 서버 컴포넌트에서만 사용이 가능하다,, 클라이언트 컴포넌트에서 페이지를 이동하고 싶다면, router를 사용해야 한다. import { useRouter } from 'next/navigat..
[코딩테스트] 재귀로 팩토리얼 구현하기 1. 문제 자연수 N을 입력하면, N! 값이 출력되도록 만드시오. 1) 팩토리얼 팩토리얼은 n이 자연수일 때, 1부터 n까지의 자연수의 곱을 의미한다. n!으로 표시한다. 예를 들어, 5! = 5*4*3*2*1 = 120이다. 이는 5! = n*(n-1)*(n-2)... 이런 식으로 나타낼 수 있다. 위 식을 활용하면 재귀함수를 통해 간단하게 팩토리얼을 구현할 수 있다. 2. 풀이 function solution(n) { let answer; function DFS(n) { if (n === 1) return 1 else return n * (DFS(n - 1)); } answer = DFS(n); return answer } console.log(solution(5)); 팩토리얼 만드는 방법은 간단하다..
[코딩테스트] 재귀로 순열 구하기 1. 문제 : 순열 구하기 10 이하의 N개의 자연수가 주어지면 이 중 M개를 뽑아 일렬로 나열하는 방법을 모두 출력합니다. 순열은 주어진 집합에서 일부 원소를 순서대로 나열하는 것을 말한다. 중복 순열과 달리, 집합에서 각 원소들이 겹치면 안 된다. 2. 풀이 function solution(m, arr) { let answer = []; const n = arr.length; const ch = Array.from({ length: n }, () => 0); let tmp = []; function DFS(l) { if (l === m) { answer.push(tmp.slice()); } else { for (let i = 0; i < n; i++) { if (ch[i] === 0) { ch[i] ..
[Next.js] Next-auth 사용방법 & 구글 연결하기 1. Next-auth란? Next-auth는 Next.js에서 주로 사용하는 오픈 소스 인증 라이브러리이다. 소셜 로그인을 간단하게 구현할 수 있도록 도와주는 역할을 한다고 생각하면 된다. google, kakao, facebook, instagram, naver 등 다양한 소셜 로그인을 지원한다. 2. 사용방법(구글 로그인 연결) next-auth를 통해 구글 로그인 연결하는 방법을 알아보자. 1) 구글 key 발급 우선, 구글 로그인을 연결하기 위해선 OAuth ID와 비밀번호가 필요하다. 우선, 구글 API로 들어간 후, Oauth 동의 화면으로 들어간다. 위 사진을 클릭하면 해당 페이지로 이동된다. 그 후, 앱 이름, 지원 메일을 적고 저장 버튼을 클릭한다. 총 4페이지가 나오는데 * 표시되어 ..
[코딩테스트] 중복순열 구하기 (feat. javascript) 1. 문제 1부터 N까지 번호가 적힌 구슬이 있습니다. 이 중 중복을 허락하여 M번을 뽑아 일렬로 나열하는 방법을 모두 출력합니다. 첫 번째 줄에 자연수 N(3
Headless CMS란? (feat. Sanity) 1. CMS란? CMS는 Content Management System의 약자로, 콘텐츠를 관리하는 시스템을 의미한다. 콘텐츠 관리와 프론트엔드 디스플레이를 결합한 통합 시스템이라 생각하면 된다. 사용자가 콘텐츠를 생성, 편집 및 관리할 수 있는 관리자 인터페이스를 제공하고 이를 데이터 베이스에 저장하는 역할을 한다. 관리자용 인터페이스가 제공되기 때문에 개발자가 아니어도 쉽게 콘텐츠를 관리할 수 있다. 단, 컨텐츠와 프론트엔드 화면이 연결되어 잇기 때문에 콘텐츠를 수정했을 때, 화면에 영향이 갈 수도 있다. 2. HeadlessCMS란? HeadlessCMS는 일반적인 CMS와 달리 콘텐츠 관리와 프론트엔드 디스플레이를 분리한 것을 말한다. 콘텐츠 관리는 특정한 백엔드 시스템에서 이루어지고, 해당 콘텐..
[인프런 코딩테스트] 이진트리(깊이 우선 탐색)로 부분집합 구하기, DFS 1. 문제 자연수 N이 주어지면 1부터 N까지의 원소를 갖는 집합의 부분집합을 모두 출력하는 프로그램을 작성하세요. 단, 공집합은 출력하지 않습니다. 1) 부분집합과 공집합 우선 문제를 풀기 전에, 부분집합에 대해서 알아보자. 부분집합은 한 집합의 일부를 나타내는 것으로, 집합 A의 모든 원소가 집합 B에 포함될 때 A를 B의 부분 집합이라고 한다. 공집합은 원소를 하나도 가지고 있지 않은 집합으로, 부분집합에 포함된다. 만일 { 1, 2, 3 }이라는 집합이 있다고 해보자. 이때 부분집합을 구하기 위해서는 각 원소들이 집합에 포함되는지 확인해야 한다. 1이 포함되는 경우와 그렇지 않은 경우, 2가 포함되는 경우와 그렇지 않은 경우, 3이 포함되는 경우와 그렇지 않은 경우. 이를 트리로 표현하면 위와 같..
[Algorithm] 깊이우선탐색 알고리즘 (DFS, Depth First Search Algorithm) 1. 깊이우선탐색(DFS, Depth First Search) 깊이 우선 탐색은 트리나 그래프를 탐색하는 방법 중 하나로, 깊이를 우선으로 하여 시작노드에서 자식노드까지 순서대로 탐색하는 알고리즘을 말한다. 부분집합, 미로 풀기, 그래프에서 연결된 구성 요소 찾기, 퍼즐 풀기 등에서 사용된다. 재귀함수와 스택으로 비교적 쉽게 구현할 수 있으며, 후에 배울 BFS에 비해 메모리를 덜 사용한다. 그러나 재귀함수와 스택 자료구조를 사용하기 때문에 스택을 적절하게 관리하지 않으면, stack overflow로 이어질 수 있다. 또한 항상 최적의 솔루션을 찾는 것은 아니다. * 트리구조 동그란 부분을 노드(node)라고 한다. * 스택 오버플로우(stack overflow) 지정한 스택 메모리 사이즈보다 더 많은..

티스토리툴바