전체 글50 Next.js와 React의 차이 및 장단점(+초기세팅) React로 만든 프로젝트를 리팩토링 해야하는데 next를 사용해보자는 의견이 나와 Next.js의 장단점을 기록해 보려한다. 요약 : “Next.js를 사용하여 SSR 기반의 SEO 친화적인 웹 애플리케이션을 구축하고, 파일 기반 라우팅과 이미지 최적화, API Routes를 통해 효율적인 프론트엔드-백엔드 통합 개발 환경을 구현가능" 1. 장단점 항목 React Next.js렌더링 방식CSR (Client Side Rendering)SSR, SSG, ISR 지원라우팅직접 설정 필요 (reac.. 2025. 10. 12. 브라우저 인증 방식(쿠키, 세션, 토큰, JWT 등) 본문 이해 위한 사전 지식 인증(authentication)과 인가(Authorizion) - 인증은 사용자가 주장하는 id와 비밀번호가 맞는지 확인하는 과정으로 주로 로그인 절차를 통해 수행된다, - 인가는 인증된 사용자가 특정 리소스에 접근할 권한이 있는지를 확인하는 절차이다. Http의 비상태성(Stateless) - Http는 요청 간의 상태를 저장하지 않는 Stateless 프로토콜이다. - 지속적인 인증이 필요한 경우 세션또는 토큰 기반 방식으로 인증상태 유지해야함 1. HTTP 인증 방식 소개 - 웹 어플에서 보안은 매우 중요한 요소다, 특히 사용자 인증은 앱의 보안을 강화하는데 필수이다. 그 중 두가지가 basic auth와 bearer token이다. - Basic auth는 가장 간.. 2025. 9. 9. [Javascript] Strict Mode에 대해서 1. strict mode란?function jun() { x = 10;}jun();console.log(x) // 10전역변수에 x가 존재하지 않기에 참조에러가 발생할 듯 하지만 자스 엔진이 암묵적으로 전역 객체에 x프로퍼티를 동적 생성한다.이를 암묵적 전역이라 한다.이런 현상은 오류를 발생시키는 원인이 될 가능성이 크다. 따라서 반드시 let,const 키워드를 사용해 변수를 선언한다음 사용해야 함좀 더 잠재적 오류를 줄이는 개발 환경을 만들기 위해서 strict mode를 사용 가능ESLint 같은 도구 사용하면 strict mode와 유사한 효과를 얻을 수 있다 소스코드를 실행 전에 소스코드를 슼캔해 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 리포팅 해주는 도구하지만 strict mode와 .. 2025. 8. 12. [React] Pure Component란? 1. 정의pure component는 같은 state와 props가 주어졌을때 항상 동일한 결과를 렌더링하는 컴포넌트즉 불필요한 렌더링을 방지해서 성능을 최적화할 때 쓰이는 개념 2. 함수형 컴포넌트에서의 pure component함수형 컴포넌트는 React.memo() 로 감싸서 만들 수 있다.이전 props와 새 props를 얕은 비교해서 값이 같으면 렌더링을 생략한다.참고: 함수형에서는 같은 state를 다시 설정하면 원래도 렌더링을 하지 않기 때문에 state 비교는 따로 안함import React from "react";const MyComponent = React.memo(function MyComponent({ value }) { console.log("렌더링!"); return {val.. 2025. 8. 11. 이전 1 2 3 4 ··· 13 다음
