말로만 듣던 타입스크립트를 드디어 한다. 타입스크립트 쓰고싶어요. 타입스크립트는 시작부터 난관이였다. 코드들 쳐보면서 콘솔에 찍어보면서 해보고싶었는데, 그마저도 쉽게 허용해주지 않았다. 그냥 라이브러리 설치하는거 마냥 설치를 해버리면?? 보기좋게 실행이 안될 것이다. 그럼 어떻게 해야하냐?? 폴더를 새로 만든다. node.js패키지를 초기화시킨다. npm init 터미널에 해당 명령어를 입력하여 초기화시킴 @types/node 설치하기 npm i @types/node 터미널에 해당 명령어를 입력하여 Node.js 내장 기능들의 타입 정보를 담고있는 @types/node를 설치해준다. 설치하지 않으면 타입스크립트의 컴파일 과정에서 타입 검사가 실패하여 오류가 발생할 수 있다. 타입스크립트 컴파일러 설치하기..
오늘은 과제로 React Hooks를 적용해보고, Custom Hook과 React.lazy()와 Suspense를 이용하여 React앱을 리팩토링을 해보았다. 구현해야할 것 json-server 라이브러리 사용 위의 과제에서 데이터로 사용할 것들은 서버를 구축할 필요없이 json 파일을 이용하여 REST API 서버를 구축해주는 라이브러리인 json-server 라이브러리를 사용했다. json-server는 다른 앱을 만들어볼때도 사용해보았던 기억이 있고, 그때 났었던 에러들을 깃헙 readme에 기록을 해놓은 것이 있어서 에러를 그것을 토대로 잡을 수 있었다. GitHub - plla2/React-crud: 📃 react + JSON-server 고용자들의 정보 확인,추가,삭제를 할 수 있다, db...
원본 링크: https://nextjs.org/docs/app/api-reference/next-config-js/turbo next.config.js Options: turbo | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 05-23으로 공식문서의 추가적인 업데이트가 있을 수 있습니다. DeepL translator와 ChatGPT에 의존해서 번역하고 있습니다. 번역체를 자연스러운 어투로 옮기는 과정에서 오역이 발생할 수 있는 점 미리 알립니다. 이에 대한 피드백은 댓글로 알려주시면 감사하겠습니다. 한글로 번역하는 것이 더 어색한 경우 원문을 먼저 표기하겠습니다. turbo (Experi..
원본 링크: https://nextjs.org/docs/app/api-reference/functions/revalidateTag Functions: revalidatePath | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 05-23으로 공식문서의 추가적인 업데이트가 있을 수 있습니다. DeepL translator와 ChatGPT에 의존해서 번역하고 있습니다. 번역체를 자연스러운 어투로 옮기는 과정에서 오역이 발생할 수 있는 점 미리 알립니다. 이에 대한 피드백은 댓글로 알려주시면 감사하겠습니다. 한글로 번역하는 것이 더 어색한 경우 원문을 먼저 표기하겠습니다. revalidateTag ..
원본 링크: https://nextjs.org/docs/app/api-reference/functions/revalidatePath Functions: revalidatePath | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 05-23으로 공식문서의 추가적인 업데이트가 있을 수 있습니다. DeepL translator와 ChatGPT에 의존해서 번역하고 있습니다. 번역체를 자연스러운 어투로 옮기는 과정에서 오역이 발생할 수 있는 점 미리 알립니다. 이에 대한 피드백은 댓글로 알려주시면 감사하겠습니다. 한글로 번역하는 것이 더 어색한 경우 원문을 먼저 표기하겠습니다. revalidatePat..
5월 12일부터 5월18일까지 진행했던 솔로프로젝트에서 새로 배운점과 내가 못했던 점들을 적어서 다음에 이런일이 있을 때 참고하기 위해서 적어본다. 구현 화면 GitHub - plla2/fe-sprint-coz-shopping: 🛒 API에서 데이터를 받아와서 localStorage에 저장하는 방식으로 북 🛒 API에서 데이터를 받아와서 localStorage에 저장하는 방식으로 북마크를 추가, 삭제할 수 있는 쇼핑몰 사이트입니다. - GitHub - plla2/fe-sprint-coz-shopping: 🛒 API에서 데이터를 받아와서 localStorage에 저 github.com 먼저, 깃 브랜치 전략을 사용하여 기능별로 브랜치를 따서 작업을 하고 PR하는 식의 작업은 처음해보았다. 모르는 것 투성이..
원본 링크: https://nextjs.org/docs/app/api-reference/functions/next-request Functions: NextRequest | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 05-11으로 공식문서의 추가적인 업데이트가 있을 수 있습니다. DeepL translator와 ChatGPT에 의존해서 번역하고 있습니다. 번역체를 자연스러운 어투로 옮기는 과정에서 오역이 발생할 수 있는 점 미리 알립니다. 이에 대한 피드백은 댓글로 알려주시면 감사하겠습니다. 한글로 번역하는 것이 더 어색한 경우 원문을 먼저 표기하겠습니다. NextRequest NextRe..
원본 링크: https://nextjs.org/docs/app/api-reference/functions/not-found Functions: notFound | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 05-11으로 공식문서의 추가적인 업데이트가 있을 수 있습니다. DeepL translator와 ChatGPT에 의존해서 번역하고 있습니다. 번역체를 자연스러운 어투로 옮기는 과정에서 오역이 발생할 수 있는 점 미리 알립니다. 이에 대한 피드백은 댓글로 알려주시면 감사하겠습니다. 한글로 번역하는 것이 더 어색한 경우 원문을 먼저 표기하겠습니다. notFound notFound 함수를 사용..
이번 스터디 주제인 DFS와 BFS에 대해 공부하고 포스팅하려고 한다. DFS와 BFS는 그래프를 탐색하는 방법을 크게 나눈 것이다. 그래프를 탐색한다는 것은 하나의 정점으로부터 시작하여 차례대로 모든 정점들을 한번씩 방문하는 것을 말한다. DFS와 BFS가 무엇이고 문제에서 어떻게 풀어야하는지 알아보자 깊이 우선 탐색(DFS, Depth-First Search) 최대한 깊이 내려간 뒤, 더이상 깊이 갈 곳이 없을 경우 옆으로 이동 DFS는 탐색할 때 시작 노드에서 한방향으로 계속 탐색하다가 더이상 갈 수 없을 때 다시 가장 가까운 노드로 돌아와 다시 탐색을 진행하는 방법 예를 들어, 미로를 통과할 때 한방향으로 쭉~ 들어가다가 더이상 길이 없을 때 다시 가장 가까운 갈림길로 돌아가서 다른 방향으로 탐색..
Functions: redirect | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 05-10으로 공식문서의 추가적인 업데이트가 있을 수 있습니다. DeepL translator와 ChatGPT에 의존해서 번역하고 있습니다. 번역체를 자연스러운 어투로 옮기는 과정에서 오역이 발생할 수 있는 점 미리 알립니다. 이에 대한 피드백은 댓글로 알려주시면 감사하겠습니다. 한글로 번역하는 것이 더 어색한 경우 원문을 먼저 표기 하겠습니다. redirect API Reference redirect 함수를 사용하면 사용자를 다른 URL로 리디렉션할 수 있습니다. 404로 리디렉션해야 하는 경우notFoun..
