next.config.js 정리
·
Next.js
Next.js로 프로젝트를 진행하다 보면 next.config.js의 설정을 바꿔야 할 때가 있다.자주 사용하는 설정에 대해 정리하고자 한다. reactStrictModeapplication 내에서 문제가 일어날 수 있는 부분에 대한 경고를 알려주는 기능이다.Nextjs 문서에서는 strict mode를 활성화하는 것을 추천한다./** @type {import('next').NextConfig} */const nextConfig = { reactStrictMode: true,};module.exports = nextConfig; swcMiniftyswcMinifty이란 Terser와 비슷한 역할을 한다. 필요 없는 공백이나, 주석을 삭제하여 용량을 줄이고, 해당 스크립트를 해석할 수 없도록 암호화 하는..
next-auth callbacks (session 값 추가)
·
Next.js
사내 프로젝트 진행 중 로그인한 user session에 값을 추가적으로 가져와야되서 next-auth의 callbacks에 대해 알아보았다. 일반적으로 클라이언트 페이지에서 useSession()을 활용해 data를 가져오면 expires와 user의 eamil, name 만 가져온다. 그래서 만약 그 외의 데이터가 필요하면 callbacks중 Session callback 을 활용해 데이터를 추가하면 된다. 세션 콜백은 세션이 확인될 때마다 호출된다. session의 email과 token의 email이 같으면 session user 객체에 추가할 속성과 값을추가한다. (아래코드에서는 region을 추가했다.)// api/auth/[...nextauth].tsdeclare module "next-au..
S3 권한 설정 (IAM)
·
Dev
프로젝트 페이지에서 보여주는 썸네일 이미지는 AWS S3에서 가져오고 있다. 해당 방법에 대해 정리하기 전에 S3에 접근하지 위해서는 IAM을 통하여 Key값을 발급 받아야하기 때문에 IAM설정에 대해 먼저 정리 해보았다.IAMIAM(AWS Identity and Access Management)은 AWS에서 제공하는 서비스에 대한 엑세스를 안전하게 제어하는 서비스로 권한을 부여 혹은 제한하여 리소스의 안전성을 높인다.IAM설정엑세스 관리의 사용자에 들어가 사용자를 생성한다.사용자 이름을 작성 후 넘어간다. S3 권한 설정을 위해 직접 정책 연결을 선택 후 S3를 검색하면 나오는 리스트 S3FullAccess를 선택후 다음을 눌러 생성한다. 생성된 사용자를 선택 후 보안 자격 증명 메뉴로 이동하면 하단에..
minsun309
minsun