Next.js
-
apply개발공부/TailwindCss 2023. 12. 13. 18:32
https://hani-develop-history.tistory.com/59 색깔 적용 안됨 최근에 지인들과 새로운 프로젝트를 진행하기로 했다. (Next.js와 Tailwind css를 사용) 오늘은 프로젝트에서 발생했던 문제와 내가 시도 했던 방법들을 공유하고자 한다. 문제 발생 Tailwind css를 사용 hani-develop-history.tistory.com 오늘의 위의 글에 이어서 프로젝트에서 tailwindcss를 사용하면서 발생했던 문제에 대해 다뤄보고자 한다. 문제 발생 페이지 이동할 때 초기화면에 로딩되는데 오랜 시간이 걸린다. 문제 원인 코드를 깔끔하게 만들기 위해 css 파일을 분리하기로 결정했었다. 그 방법으로 폴더별로 {페이지 이름}.modules.css 파일을 만든 후, ..
-
Next.js개발공부/Next.js 2023. 11. 30. 20:10
오늘부터 Next.js를 공부하려고 한다. Next.js란? 리액트 문제 해결 도구 Next.js 관련해서 정말 많은 글들을 읽어봤는데 결국 간단하게 정리하면 리액트의 문제를 해결하기 위해 만들어진 JS 웹 프레임워크이다. 리액트의 어떤 문제를 해결해줄까? 느린 페이지 로딩 속도 리액트는 클라이언트 사이드 렌더링(CSR)을 기본으로 하기 때문에 페이지 로딩 속도가 느림 왜 느리지? CSR은 JS 파일을 먼저 다운로드한 후 데이터를 받아오기 때문 SEO 속도 느림 CSR이기 때문에 검색 엔진이 웹 페이지의 콘텐츠를 이해하는 어려움 발생 개발 편의성 리액트는 다양한 기능 제공을 하지 않아 개발자가 직접 설정하는 부분이 많음 Next.js의 장점 결국 Next.js는 리액트의 단점을 보완했기 때문에 위에 내용..