분류 전체보기72 [Front-End] nvm(npm/node) 설치 아래 코드를 터미널에 입력합니다. /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" NVM 설치 $ brew install nvm 환경변수 설정 $ echo $SHELL /bin/zsh // or /bin/bash $ sudo vim ~/.zshrc // zsh $ sudo vim ~/.bash_profile // bash nvm -v $ nvm -v 0.39.5 Node 설치 $ nvm install 16 v16.20.2 $ node -v v16.20.2 $ npm -v 8.19.4 $ nvm list // nvm 버전 리스트 $ nvm use 14 // 14 버전으로 낮추기 2024. 3. 17. Next.js 13 버전과 14버전의 차이 Next.js는 무엇인가? 개발자가 웹서비스를 만들기 위한 필요한 도구를 제공하는 React의 프레임워크다. 라우티, 데이터 패칭, 렌더링 같은 성능 최적화나 개발자 경험 조금 쉽게 생산성 높이 하는 고려를 할 수 있는것. 화면을 그리는 것 외에 성능 seo 전반적인 개발자 도구들을 제공하는 Next.js입니다. pre-rendering Next.js 13 - 파일 시스템 기반의 라우팅: 디렉토리 구조를 어떻게 짜냐에 따라 라우팅이 달라진다는 의미. 12 이하) pages 디렉토리들 기준으로 라우팅을 지원했다. 13) app 디렉토리로 바꾼다. App Directory 13.4 -> App Router - 서버 컴포넌트: React Server Components (RSC) react18에서 도입한 걸 .. 2023. 12. 18. [Next.js] Next 13 기존 Next.js 12 버전에서 최신버전으로 업데이트 하는 방법 npm i next@latest react@latest react-dom@latest eslint-config-next@latest Next.js 공식문서에서 설명하고 있는 변화에 대해서 적으며, 다음과 같이 app/Direact - Easier, faster, less, less client JS - 쉽고, 빠르고, 적은 클라이언트 JS layout React Server Components (리액트 서버 컴포넌트) Streaming Turbopack - Up to 700x faster Rust-based webpack replacement. - 700배 빠른 Rust 기반의 웹팩 대체품 New next/image - 더 빨라진 레이지 .. 2022. 11. 24. [Next.js] 최근 검색어 저장 (localStorage) 컴포넌트는 크게 2개로 나눌 수 있다. src/page/search src/components/TogetherSearchBar 메인 기능은 search 페이지에 구현하였고, 검색어 관련 데이터는 props로 하여금 TogetherSearchBar 컴포넌트에 전달하였다 분석 1 1 번 요구사항을 해결하기 위해서 검색 결과를 태그 내에서 관리하고 해당 e.target.value를 결과 페이지로 다이나믹 라우팅하면서, 로컬 스토리지에 저장한다 버튼 클릭 이벤트를 통해 기존 배열에서 해당 클릭된 타깃 검색어를 지워줘야 하므로, 일반 배열 형식으로 바로 푸쉬하는 것보다는 id 값을 통해 객체형식으로 배열에 넣어주었다 분석 2 2번 요구사항을 해결하기 위해서는 검색 결과를 담고 있는 localStroage에 저장된.. 2022. 5. 24. 이전 1 2 3 4 5 ··· 18 다음
