728x90 리액트3 [React] Nginx 로 배포하기 1. Nginx 배포1-1. React 프로젝트 빌드react 프로젝트를 빌드합니다.(react + vite + typescript) 구성입니다.npm run build 1-2. Nginx 설치wsl의 ubuntu로 접속합니다.sudo apt update Nginx 설치sudo apt install nginx 설치 확인// 버전 확인nginx -v// 실행 확인sudo systemctl status nginx 1-3. 파일 복사sudo mkdir -p /var/www/tsreact 폴더를 만들고 빌드 파일(dist)을 복사합니다.sudo cp -r /mnt/c/Users/mkk/Desktop/tsreact/dist/* /var/www/tsreact/ 1-4. Nginx 설정 파일 생성 또는 수정serve.. 2025. 5. 29. [React] Vite 프로젝트 jar로 배포하기 어플리케이션을 배포하는 간단한 방법은 웹서버를 이용하는 것일 겁니다.(Nginx, Apache 등) 하지만 다른 방법도 있습니다.이번 글은 클라이언트를 jar 로 배포하는 것을 해보겠습니다. (윈도우os) 로컬 환경에서 테스트 해보려면 wsl 이 필요합니다.1. wsl 설치cmd 를 관리자 권한으로 실행합니다. wsl --install// ubuntu 말고 다른 것을 쓰려면 wsl --install -d wsl을 설치하고 재부팅합니다. 설치가 제대로 됐으면 ubuntu를 실행할 수 있을 겁니다. 계정 비밀번호는 까먹기 쉬우니 따로 적어 두시는 걸 추천합니다. 1-1. wsl 주소 확인hostname -I// 대문자 I 입니다 172 로 시작하는 로컬 주소를 알 수 있습니다. 2. Vitevite 프로젝.. 2025. 5. 28. [React] Vite로 React 앱 시작하기 1. 프로젝트 만들기create-react-app 은 Webpack을 사용합니다. 1-1. CRA 와 Vite CRA(create-react-app)Vite번들러WebpackESBuild (dev), Rollup (build)실행 속도상대적으로 느림매우 빠름설정 파일숨겨짐바로 수정 가능 (vite.config.js)사용성무겁고 복잡가볍고 직관적 이 글은 Vite를 사용해 React 앱을 시작하는 법을 작성합니다. 1-2. npm vs npxnpm create vite@latest app -- --template react// 또는npx create-vite@latest app --template react// 또는 현재 디렉토리에 설치npx create-vite@latest . --template rea.. 2025. 5. 28. 이전 1 다음 728x90
