NextJS

NextJS가 아주 좋고 대세라고 합니다.그래서 제가 한번 사용을 해보겠습니다.저는 극극 초심자이니깐 아래 노마드코더의 영상을 따라가며 기록을 남깁니다.https://nomadcoders.co/nextjs-fundamentals/lectures/3437intr

library : 내가 원하는 것을 언제든지 가져다가 씀framework : 정해진 틀이 있고 규칙만 지켜서 쓰면 편하게 쓰기 가능\--> 만약 클라이언트 쪽에서 JS를 비활성화하면 동작하지 않음\--> 만약 클라이언트 쪽에서 JS를 비활성화해도 동작함\--> JS를

우리는 NextJS를 쓰면서 앞으로 Layout 이라는 패턴을 많이 쓰게 될겁니다.위 그림처럼 components에 넣어서 말이죠왜냐면!!!\_app.js를 잘 사용하지 않기 위해서입니다얘는 global로 선언을 해야하는 경우들이 많기 때문에 위험부담이 있습니다그래서

API가 유료인경우도 있고 제한이 걸려있는 경우도 있는데 누군가가 마음대로 쓰는 것을 방지하게 위해서 숨겨보자이게 오픈되어있는 것을 확인하는 방법은노란색으로 칠해진것을 보면 알 수 있다Network --> popular (우리가 부른 API) --> 뒤에 key해결하기

위에 코드를 사용해야만 한다얘는 function name을 바꿀수 없습니다무조건 getServerSideProps로 써야함그러면 백엔드에서 rendering이 돌거야그렇다면API_KEY를 여기다가 쓴다면 아예 밖으로 보여지지 않겠지?Server에서만 도니까!!아래처럼

pages 폴더 안에 만들어주면 끝!1\. movies\\all.js --> xxxxx/movies/all2\. movies\\index.js --> xxxxx/movies3\. about.js --> xxxxx/about4\. indes.jx --> xxxxx/URL

Mini_project의 마지막!pages 폴더 안에 404.js를 만들면 끝!1~5까지 모두 들어간 코드는 내 github에 있습니다아아아ChiWoo-Shin Githhub 감사합니다!

Next JS를 쓰면서 PWA 세팅하는 방법을 처음 공부하였다.생각보다 어렵지 않았으나 순서를 정리해놓으려고 합니다.특히 아니 이것도 해야돼? 이런것들이 있는데 해야합니다.npm install next-pwa여기까지 완료한 후 yarn build or npm run b

나는.. ESLint와 전쟁중이다....간단하게 말하면 import 할때 .tsx 확장자를 쓸때는 allowImportingTsExtensions 이게 enable 되어있어야 한다는 얘기다.공식 문서에는 아래처럼만 써있다.이걸 보고 해결했다면 당신은 똑똑이다. 나는

Layout만 설정을 해놓으면 모든 화면에 동일하게 적용되는 것을 알 수 있다.하지만 우리는 로그인 전에는 필요가 없다그래서 로그인 이후에만 적용해보겠다우리가 사용할 파일은 \_app.tsx 다내가 겪은 순서대로 작성하겠다이렇게 하면 제일 처음 접근한 페이지 local

Yup이 무엇이냐?정의를 보면 아래와 같이 써있다Yup is a schema builder for runtime value parsing and validation. Define a schema, transform a value to match, assert the s