본문 바로가기
반응형

JavaScript112

30. 배포 - 1 React 애플리케이션을 위한 배포 전략 React로 개발한 애플리케이션을 배포하기 위해서는 몇 가지 고려해야 할 사항이 있습니다. 이번 글에서는 React 애플리케이션을 배포하는 전략에 대해 알아보겠습니다. 1. 정적 파일 호스팅 React 애플리케이션은 정적 파일로 빌드되기 때문에, 가장 간단한 배포 방법은 정적 파일을 호스팅하는 것입니다. 대표적인 정적 파일 호스팅 서비스로는 Netlify, Vercel, GitHub Pages 등이 있습니다. # React 애플리케이션 빌드 npm run build # 빌드된 파일을 정적 호스팅 서비스에 업로드 2. 서버 사이드 렌더링(SSR) 적용 SEO(Search Engine Optimization)를 위해 React 애플리케이션에 서버 사이드 렌더링을 적용.. 2024. 2. 20.
29. 보안 - 2 CSRF(Cross Site Request Forgery) 방어 CSRF(Cross Site Request Forgery)는 사용자가 의도하지 않은 요청을 악의적으로 실행하는 공격입니다. 이번 글에서는 CSRF 공격을 방어하는 방법에 대해 알아보겠습니다. CSRF 공격 원리 공격자는 희생자의 브라우저를 이용하여 특정 웹 애플리케이션에 요청을 보냅니다. 희생자는 이미 해당 웹 애플리케이션에 로그인되어 있는 상태이므로, 브라우저는 요청을 처리합니다. 이러한 과정에서 희생자의 인증 정보가 유출되고, 공격자가 의도한 동작을 수행합니다. CSRF 방어 방법 CSRF 토큰 사용: 모든 요청에 CSRF 토큰을 포함하여 요청이 유효한지 검증합니다. Change Password SameSite 속성 설정: 쿠키에 Sam.. 2024. 2. 20.
28. 보안 - 1 XSS(Cross Site Scripting) 방어 XSS(Cross Site Scripting)는 웹 애플리케이션에서 발생하는 보안 취약점 중 하나로, 악의적인 사용자가 스크립트를 삽입하여 사용자의 정보를 탈취하거나 악의적인 행동을 할 수 있습니다. 이번 글에서는 XSS 공격을 방어하는 방법에 대해 알아보겠습니다. XSS 공격 종류 Reflected XSS: 사용자가 입력한 데이터가 서버에서 동적으로 생성된 페이지에 반영되어 공격을 실행합니다. Stored XSS: 공격자가 악성 스크립트를 데이터베이스에 저장하고, 다른 사용자가 해당 데이터를 조회할 때 공격이 실행됩니다. DOM-based XSS: 클라이언트 측에서 발생하며, 브라우저의 DOM(Document Object Model)을 조작하여 공격을.. 2024. 2. 20.
27. 서버 사이드 렌더링(SSR) - 2 Next.js를 이용한 SSR 구현 방법 Next.js는 React 애플리케이션을 쉽게 서버 사이드 렌더링(SSR)할 수 있도록 도와주는 프레임워크입니다. 이번 글에서는 Next.js를 사용하여 SSR을 구현하는 방법에 대해 알아보겠습니다. Next.js 소개 Next.js는 React 기반의 프레임워크로, 서버 사이드 렌더링, 코드 분할, 라우팅 등을 내장하고 있어 React 애플리케이션을 쉽게 개발할 수 있습니다. 특히 SSR을 지원하여 초기 로딩 성능을 향상시키고 SEO를 개선할 수 있습니다. SSR 구현 방법 프로젝트 생성: 우선 Next.js 프로젝트를 생성합니다. npx create-next-app my-next-app cd my-next-app 페이지 생성: pages 디렉토리에 SSR을 적.. 2024. 2. 20.
반응형

티스토리툴바