분류 전체보기70 next.js 14버전 앱라우터에 대해서 헷갈렸던 것 1. 고민 코드 2. 고민 내용 3.피드백 4. 피드백 듣고 정리 2024. 2. 27. Authentication/Authorization Authentication 인증 : 서버가 리퀘스트를 보낸 유저가 누구인지를 파악하는 기능 Authorization 인가 : 리퀘스트가 어떤 권한이 있는지 판단하는것 클라이언트가 서버에 인증서를 받고 다시 서버에게 전달하는 방법 두 가지↓ http는 비연결성과 무상태성을 가진다. -> 한번 서버에 요청하고 응답을 받으면 연결이 끊긴다. 따라 지속성을 위해 쿠키가 등장! 1. 쿠키 서버 리스폰스나 클라이언트 코드에 따라 브라우저에 저장되는 작은 단위의 문자열 파일들 유저 인증뿐만 아니라 브라우저 이용자에 대한 개인화된 기능과 데이터 제공 수단으로 사용할 수있다. - 로그인을 하지 않아도 검색기록이 저장되거나 쇼핑카트를 사용 하거나, 테마 유지 등 쿠키 인증 사용 시 보안 설정 Domin - 서버와 요청의 .. 2024. 2. 27. 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. next.js 로 엔드포인트 만들기; next.js 로 엔드포인트 만들기; pages폴더 안에 api폴더를 만들고 파일을 생성하면 api의 경로가 된다 -> http://localhost:3000/api/links 이런 식으로 const links=(req, res)=>{ res.send('Hello, api') // res.send는 응답을 보내는 메서드 } export default links links 파일에 api를 요청하는 코드를 넣고 주소로 들어가면 이렇게 나온다. 다이나믹 라우팅도 활용 가능 -> http://localhost:3000/api/short-links/(아무거나 넣기) [id.js] 파일에 코드를 적음 const handler=(req, res)=>{ res.send('hello next') // res.send는 .. 2024. 2. 21. 02.15 next.js의 프리렌더링 공부 프리렌더링 단순한 의미로는 ~~ 이전에 하는 렌더링 -> 웹페이지 로딩 이전에 하는 렌더링 프리렌더링이 실행되는 시점은? 웹브라우저가 html 코드를 받아오기 전에 렌더링 프리렌더링의 장점 - 초기 로딩이 빨리진다 -> html이 렌더링된 상태로 제공되기 때문에 - 검색엔진 최적화 -> 비어있는 html이 아니라 렌더링된 html을 미리 받기 때문에 프리렌더링의 2가지 방식 1. 정적 생성 2. 서버사이드 렌더링 1. 정적 생성 빌드를 하는 시점에 렌더링을 하는 것 (빌드할 때 html을 만드는것) - 빌드는 배포하기 전에 소스코드를 실행할 수 있는 형태로 바꿔놓는 것 소스코드를 빌드하면서 파일로 미리 만들어둠 -> 웹브라우저로 접속하면 만들어 놓은 걸 그대로 보여줌 -> 렌더링 된 상태에서 자바스크립트.. 2024. 2. 15. 이전 1 ··· 3 4 5 6 7 8 9 ··· 14 다음
