본문 바로가기

분류 전체보기74

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.
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.