Next.js
1.Next.js 기초
React로 만들어진 FrameWorkNext.js로 만든 high-Quality 웹사이트1\. 성능서버 사이드 렌더링 및 정적 사이트 생성코드 스플리팅 및 이미지 최적화SEO서버 사이드 렌더링을 통해 웹페이지의 콘텐츠가 초기 로드 시 완전히 렌더링 되므로, 검색엔진이
2.Next js의 Asset 최적화, Route Handler(벡엔드 구현가능) & Server Action, #\Next.js 캐싱(Caching)
Next/Image를 이용한 이미지 최적화 이미지는 일반적인 웹사이트 페이지 무게의 아주 큰 부분을 차지하며, 웹사이트의 LCP(Largest Contentful Paint) 성능에 큰 영향을 미친다.자동 이미지 최적화 기능크기최적화 : 각 기기에 맞는 크기의 이미지를
3.Next.js_React Hook Form /w Zod
제어 컴포넌트: 리액트에서 값이 제어되는 컴포넌트비제어 컴포넌트: 리엑트에서 값이 제어되지 않는 컴포넌트즉각적으로, 실시간으로 값에 대한 피드백이 필요하다 => 제어 컴포넌트즉각적인 피드백이 불필요하고 제출시에만 값이 필요하다, 불필요한 렌더링과 값 동기화가 싫다 =>
4.Next.js&SUPABASE
terminal에 입력.env.local sup abase 연결 URL, KEY 설정src>utils>supabase>client.tsmiddleware.tsserver.ts 생성사용하는 곳과 연결supbase table에서 Add RLS policycreate pol
5.Next.js+axios+json-server로 TodoList만들기
Next.js+axios+json-server를 활용하여 TodoList를 만들어보았다.Next.js 폴더생성axios 추가json-server에 todoList mocdata를 저장하기 위해 설치package.json에 yarn server로 포트 추가root에 db