nextjs

[TIL] React/Next 로딩 화면 및 클립보드 구현

[TIL] React/Next 로딩 화면 및 클립보드 구현 날짜 2022.06.29. 목표 로딩 및 클립보드 기능 구현 내용 Next.js - 로딩 화면 구현 // _app.tsx import Router from "next/router"; import {useState, useEffect} from 'react' export default function App({ Component, pageProps }) { const [loading, setLoading] = useState(false); const start = () => { setLoading(true); }; const end = () => { setLoading(false); }; useEffect(() => { Router...

[TIL] 프론트 환경 구축과 배포

[TIL] 프론트 환경 구축과 배포 날짜 2022.06.21. 목표 DeSo 프로젝트 Front 환경 구축 내용 Next.js - getStaticProps vs getServerSideProps 공통점 - pre-render가 필요한 경우 사용 getStaticProps - 빌드 시 한번 호출 정적(고정된) 데이터 성능 우수 getServerSideProps - 페이지 요청마다 호출 동적 데이터 동적 수정 가능 npm ci npm ci(Continous Integration, 지속적인 통합) 장점 - 빠른 설치 속도 package.json 파일보다 package-lock.json 파일을 우선 기존의 node_modules 폴더를 삭제하고 package-lock.json 파일을 기준으로 package를 ..