Next.js를 사용하는 이유 프론트엔드 개발자라면 Next.js가 프론트엔드 시장의 점유율을 빠르게 점유하고 있다는 이야기를 들어보셨을 겁니다. Next.js를 사용할 줄 아는지가 프론트엔드 개발자 구인의 조건이 되기하죠(개인적으로 기술 스택보다 문제해결력이 더 중요하다고 생각합니다). 저 또한 스타트업에서 일을 하고 싶어서 공부를 시작한 케이스였습...

“미움 받을 용기2”를 고른 이유 [미움받을 용기 1]을 읽고나서 느낀 여운을 잊을 수 없었습니다. 자연스럽게 뒷 이야기가 궁금했습니다. [미움받을 용기2]는 아들러의 심리학을 실천하기 위한 구체적인 방법론에 대한 이야기입니다. “아들러 심리학을 어떻게 실천할 수 있을까”라는 질문에 대답합니다. 인상 깊은 내용 나쁜 그 사람, 불쌍한 나라는 핑계...

본 포스팅은 leerob 블로그의 Product and Platform Engineers를 번역한 것입니다. 프론트엔드와 백엔드 엔지니어의 구분은 점점 더 의미가 없어지고 있습니다. 프론트엔드 개발자는 더이상 HTML, CSS, JavaScript만 작성하지 않습니다. 이제 프론트엔드 중심의 개발자가 전체 웹 애플리케이션을 처...

배경 문득 Next.js에서 ESLint와 Prettier을 설정하는 방법이 궁금해졌습니다. 특히 두 가지가 궁금했는데요. 첫째는 저도 모르게 사용하고 있는 ESLint, Prettier가 무슨 기능을 제공하는지 입니다. 둘째는 ESLint, Prettier 설정을 통해 개발자간의 협업을 하는 예제입니다. 그래서 공식문서를 참고해 공부를 했습니다. ...

문제 발생 다른 컴퓨터에서 제가 작성한 코드를 실행해보고 싶었습니다. 그래서 깃허브에 업로드된 코드를 클론하고 npm install을 실행했습니다. 그랬더니 다음 에러를 만났습니다. npm error code 1 npm error path /.../node_modules/canvas npm error command failed npm error co...

본 포스팅은 React의 공식 문서의 React Compiler를 번역한 것입니다. Overview 이 페이지에서는 새로운 실험 단계의 React 컴파일러에 대한 소개와 성공적인 사용 방법을 알려드립니다. 이 문서는 아직 진행 중인 작업입니다. 더 많은 문서는 React Compiler Working Group repo에서 확인할 수 있으며,...

본 포스팅은 Next.js Learn의 Adding Metadata 내용을 번역한 것입니다. 메타데이터는 SEO와 공유 가능성을 위해 매우 중요합니다. 이 장에서는 Next.js 애플리케이션에 메타데이터를 추가하는 방법을 설명합니다. In this chapter 앞으로 다룰 주제는 다음과 같습니다. 메타데이터란 무엇인가요? 메타데이...

본 포스팅은 Next.js Learn의 Adding Authentication 내용을 번역한 것입니다. 이전 장에서는 form 유효성 검사를 추가하고 접근성을 개선하여 인보이스 경로 구축을 완료했습니다. 이 장에서는 대시보드에 인증을 추가하겠습니다. In this chapter 앞으로 다룰 주제는 다음과 같습니다. Authenticat...

본 포스팅은 Next.js Learn의 Improving Accessibility 내용을 번역한 것입니다. 이전 장에서는 오류(404 오류 포함)를 포착하고 사용자에게 대체 방법을 표시하는 방법을 살펴봤습니다. 하지만 퍼즐의 또 다른 조각인 form 유효성 검사에 대해 논의할 필요가 있습니다. Server Action으로 서버 측 유효성 검사...

본 포스팅은 Next.js Learn의 Handling Errors 내용을 번역한 것입니다. 이전 장에서는 Server Actions를 사용하여 데이터를 변경하는 방법을 배웠습니다. 이제 JavaScript의 try/catch문과 Next.js API를 사용하여 오류를 우아하게 처리하는 방법을 살펴보겠습니다. In this chapter 앞...