넥스트 제이에스3 mongoDB였던것 환경변수 프로그램에서 실행 환경에 따라 다른 값을 지정할 수 있는 변수 -> 데이터베이스 주소와 같은 값을 소스코드에 그대로 쓰는 것은 위험해서 환경변수로 사용하는 것이 좋음 -> precess.env라는 객체를 통해서 참조할 수 있음 next.js에서는 기본적으로 dotenv라는 라이브러리를 지원 -> .env같은 이름의 파일에서 환경 변수들을 저장해두면 node.js 프로젝트를 실행할 때 환경변수로 지정해주는 라이브러리 -> 주의할 점은 .env 파일 같은 건 소스코드에 포함시키면 안된다. //.env.local MONGODB_URI=mongodb+srv://admin:blahblah@.clusterName.blahblah.mongodb.net/ databaseName?retryWrites=true&.. 2024. 2. 26. 02.15 next.js의 프리렌더링 공부 프리렌더링 단순한 의미로는 ~~ 이전에 하는 렌더링 -> 웹페이지 로딩 이전에 하는 렌더링 프리렌더링이 실행되는 시점은? 웹브라우저가 html 코드를 받아오기 전에 렌더링 프리렌더링의 장점 - 초기 로딩이 빨리진다 -> html이 렌더링된 상태로 제공되기 때문에 - 검색엔진 최적화 -> 비어있는 html이 아니라 렌더링된 html을 미리 받기 때문에 프리렌더링의 2가지 방식 1. 정적 생성 2. 서버사이드 렌더링 1. 정적 생성 빌드를 하는 시점에 렌더링을 하는 것 (빌드할 때 html을 만드는것) - 빌드는 배포하기 전에 소스코드를 실행할 수 있는 형태로 바꿔놓는 것 소스코드를 빌드하면서 파일로 미리 만들어둠 -> 웹브라우저로 접속하면 만들어 놓은 걸 그대로 보여줌 -> 렌더링 된 상태에서 자바스크립트.. 2024. 2. 15. next.js공부중 next.js 1. 리액트 컴포넌트 파일에서 module.css를 import 해서 사용하기 2. global.css 적용할 때는 _app컴포넌트에 적용하기 3. alias 라는 거로 @ 설정 -> @ 사용하면 프로젝트 최상위 폴더를 기준으로 경로를 사용할 수 있음. -> 현재 파일의 경로랑 상관없이 사용 가능 4.파일시스템 기반 라우팅 -> 파일의 경로가 주소에 매칭되는 라우팅 방식 -> 폴더를 만들고 자바스크립트 파일을 만들면 됨 5. next.js의 폴더구조는 next.js에서 만든 거기 때문에 꼭 pages로 만들어야 하고 이 안에 파일을 넣으면 페이지가 됨 6. index.js는 최상위 페이지(홈페이지) 7.페이지에 사용되는 파일들은 꼭 export default로 해야한다. 8. pages폴더.. 2024. 2. 14. 이전 1 다음
