강의 리뷰
-
[노마드 코더] NextJS 시작하기 파트 2리뷰강의 리뷰 2023. 10. 31. 18:28
redirect vs remask 사용법 next.config.js(JSON파일이 아닌 일반 node.js 모듈, 서버 및 빌드단계에서 사용되며 브라우저 빌드에는 포함되지 않음)에 설정 reactStrictMode: true, async redirects() { return [ { source: '/old-blog/:path*', destination: '/new-sexy-blog/:path*', permanent: false, }, ]; }, async rewrites() { return [ { source: '/api/movies', destination: `https://api.themoviedb.org/3/movie/popular?api_key=${API_KEY}`, }, { source: '/a..
-
[노마드 코더] NextJS 시작하기 파트 1 리뷰강의 리뷰 2023. 10. 31. 11:50
프레임워크 vs 라이브러리 차이 프레임 워크 프레임워크가 나의 코드를 부르는 형태(reactDOM render등 불러오는 것이 없음) pages 외에 라이브러리처럼 커스텀하는 곳 없음 커스텀하여 코드조합 가능(index.js와 router...) Next.js vs React의 차이 React CSR로 브라우저가 보는 ui 만드는 모든 작업을 한다. 만 html에 렌더링되고 나머지는 client side에서 그려준다. Next 페이지를 미리 만들어줌(404등...) Hydration SSR에서 만들어진 매마른 페이지에 동적이벤트라는 수분 공급을 해주는 과정 pre-rendering 2가지 종류가 있음 SSG => 빌드 타임에 HTML 생성, pre-render된 HTML은 다음 리퀘스트에 재사용 SSR ..
-
[React] 01. 기본 개념 및 설정강의 리뷰 2023. 10. 18. 17:40
SPA, SSR, SSG의 차이 - SPA : 서버에서 제너레이션이 아니라 클라이언트에서 제너레이션 - SSR : html 그리는 것을 서버에서 하는 것으로 요청이 들어올 때 데이터에서 html을 만들어서 내려보내는 것 - SSG : 빌드시점에 서버에서 미리 html을 만들어 놓는 것 getStaticProps, getServerProps assets, public의 차이 React.ReactElement, React.ReactNode의 차이 컴포넌트형과 함수형의 라이프사이클 차이 프로젝트 설치 yarn create vite rbvite(프로젝트명) yarn install yarn dev useState, useReduce의 차이
-
[HTML & CSS 기초] 반응형강의 리뷰 2023. 8. 6. 17:24
반응형 웹 - 사용자의 해상도에 따라 웹 페이지의 레이아웃을 최적화해서 보여주는 기술 뷰포트 - 모바일 웹에서 웹페이지가 사용자에게 보여지는 영역 - 컨텐츠의 width를 device의 width에 맞게 적용 미디어 쿼리 @media 미디어 타입 and (미디어-지정-규칙){ css 정의 } ex) body { background-color: yellow; } @media screen and (max-width: 1000px) { body { background-color: red; } } @media screen and (max-width: 600px) { body { background-color: blue; } } ex) landscape:가로, portrait:세로 @media (orientati..
-
[100일 코딩 챌린지]1-5일차강의 리뷰 2023. 7. 16. 09:08
웹 개발이란 무엇이며 웹은 어떻게 작동할까요? - 주소창에 URL입력 - DNS서버에 IP response 받음 - client에서 서버에 https request - 서버에서 client에 response 웹 작동방식 -https://도메인/path === URL vscode prettier formatter settings => Dafault Formatter검색 => prettier-esbenp.prettier-vscode 입력 후 저장 레이아웃 구성 header, main, footer, 네비게이션바, 사이드바 선택자와 결합자를 이용하여 스타일 주는 법 인라인 엘리먼트 => 좌우 이동은 마진으로, 상하 이동은 패딩으로 => display:inline-block 으로 해결 가능 블락 엘리먼트=> 상..
-
merge란 ?강의 리뷰 2022. 7. 13. 08:19
독립적으로 만든 브랜치들을 단일 브랜치로 통합 가능하도록 함 병합 과정 git status : HEAD가 병합 수신 브랜치를 가리키는 지 확인 git checkout : 수신 브랜치가 변경을 위해 사용 git fetch : 최신 원격 커밋 가져옴 git pull : main 브랜치가 최신으로 업데이트 되었는 지 확인 git merge 빨리 감기 병합 브랜치를 실제로 병합하는 대신, 현재 브랜치 팁을 대상 브랜치 팁까지 이동시키는 작업만으로 기록을 통합 한 브랜치에서 할 수 있는 모든 커밋을 현재 커밋을 통해 사용 가능하므로 기록이 효과적으로 결합됨 작은 기능이나 버그 수정시에 주로 사용하는 병합 3방향 병함 대규모 기능이나 동시에 여러 개발자가 작업할 경우 발생하는 시나리오 충돌 일반적으로 =======..