git, github

react 프로젝트 url로 올리기 [vercel 사용]

비니_ 2025. 11. 10. 15:07
728x90

 

 

1. git repo에 올리고

2. vercel에 add project를 하여 연동시키면 끝!

 

vercel => https://vercel.com/

 

 

기본 html은 정적파일이기 때문에 그냥 git으로도 가능하지만

react나 vue 등은 빌드(build) 과정이 필요해서 ( 정적 서버/배포 플랫폼 필요 ) 바로 못띄운다

 

이유 정리

  1. React/Next.js는 개발 코드가 그대로 브라우저에서 동작하지 않음
    • src 폴더 안의 JSX, ES6 모듈, TypeScript 등은 브라우저가 바로 이해 못함
    • 예: <Component /> JSX, import/export 문법
  2. 빌드 과정 (npm run build)
    • JSX → JS로 변환
    • 모듈 번들링 (여러 파일을 하나/몇 개로 합침)
    • CSS/이미지 최적화
    • Next.js는 SSG/SSR 페이지 생성
      → 이렇게 만들어진 정적 파일이 실제로 브라우저에서 실행 가능
  3. 정적 파일을 배포
    • HTML, JS, CSS 번들, 이미지 등을 제공할 웹 서버가 필요
    • GitHub Pages는 정적 파일 제공만 가능
    • Vercel/Netlify는 빌드 실행 + 정적/SSR 제공 가능

 

728x90