728x90 분류 전체보기88 [Next.js] Next.js 기본 개념 정리 Next.js 공식문서를 참고하며 공부한 기본 개념들을 정리했습니다 Code splitting and prefetching Code splitting Next.js는 코드 분할을 자동으로 수행함 각 페이지는 해당 페이지에 필요한 부분만 로드함 홈페이지가 렌더링될 때 다른 페이지의 코드는 처음에 제공되지 않음 장점 수백 개의 페이지가 있어도 홈페이지가 빠르게 로드됨 특정 페이지에서 오류가 발생해도 나머지 애플리케이션은 계속 작동함 prefetching (미리 불러오기) 링크 컴포넌트가 브라우저의 뷰포트에 표시될 때마다 링크된 페이지의 코드를 백그라운드에서 자동으로 prefetching함 링크를 클릭할 때 쯤이면 대상 페이지의 코드가 이미 백그라운드에서 로드되어 페이지 전환이 거의 즉시 이루어짐 next/I.. 2023. 4. 13. [JWT] refresh token, access token 정리 (로그인 과정) refresh token과 access token에 대해 정리해보겠습니다통합 로그인 프로젝트를 진행할 때 JWT, refresh token, access token 등의 개념을 처음 접하였는데, 이 개념들을 간단하게 정리하고자 한다. 📌 JWT ? : JWT는 JSON Web Token의 약자이다.정보를 JSON object로 안전하게 전송하는 방법이다. JWT는 일반적으로 웹 애플리케이션에서 인증 및 권한 부여 목적으로 사용된다.즉, 유저가 로그인할 때 서버가 인증 정보를 보내주는데,암호화나 시그니처 추가가 가능한 데이터 패키지(=JWT) 안에 인증 정보를 담아서 보내준다.담기는 정보 중 refresh token과 access token이 유저 인증에 사용된다. 📌 refresh token & ac.. 2023. 4. 4. [FE] 답글 화면 구현하기 (+재귀함수) (feat. React) 목표: 여러 depth의 답글을 화면에 표시하기 기능: 답글이 있는 게시글은 아이콘으로 표시하고 - 아이콘을 클릭하면 답글이 보이고 - 그 밑으로 여러 depth의 답글을 표시한다 방법: table의 tr을 하나의 컴포넌트로 만들고 그 컴포넌트를 답글 depth만큼 계속 호출한다 (* 컴포넌트도 하나의 함수이기 때문에 재귀함수를 사용하여 구현할 수 있는 것) 부모 컴포넌트 (MainTable.js) const MainTable = () => { // 게시글 리스트 (-> api 요청으로 데이터를 세팅함) const [articleList, setArticleList] = useState([]) return ( // 코드 생략 { articleList.map(article => { } } ) } 자식 컴포.. 2023. 4. 2. 신입 프론트엔드 개발자의 입사 6개월 회고 벌써 입사한지 6개월이 되었다 지난 수습기간 3개월 간의 회고록을 작성한 것이 얼마 되지 않은 것 같은데 정신 없이 하루하루를 보내다 보니, 벌써 입사한지 6개월 이상이 되었다,, 이 글에선 그동안 진행했던 프로젝트들과 그 과정에서 느꼈던 점들을 기록해보고자 한다! 무엇을 했는가 🌈 '통합 로그인' 페이지 배포 [사용 기술 | React] : 2023년 새해가 밝자마자 통합 로그인 페이지를 배포하게 되었다. 배포 당일 오전에는 작성된 코드들을 전반적으로 살펴보며 오류가 없는지 점검했다. 늦은 오후에 배포를 하게 되었는데, 나는 아주 자그마한 주니어 개발자이기 때문에 자잘한 오류들을 해결해 나갔다. 그 외의 오류 해결은 시니어 개발자 분들이 맡았고, 그동안 다시 로그인 프로세스를 하나 하나 밟아보며 테스트.. 2023. 3. 12. 이전 1 ··· 17 18 19 20 21 22 다음 728x90 반응형
