[생활코딩] React 배포하는 방법

React 배포하는 방법

 

npm run build

C:\Users\seolzone\IdeaProjects\lifereact>npm run build

> lifereact@0.1.0 build
> react-scripts build

Creating an optimized production build...
Compiled successfully.

File sizes after gzip:

  47.11 kB  build\static\js\main.a8c82644.js
  1.78 kB   build\static\js\787.032469ce.chunk.js
  427 B     build\static\css\main.3068919b.css

The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
You may serve it with a static server:

  npm install -g serve
  serve -s build

Find out more about deployment here:

  https://cra.link/deployment

 

2.npm install -g serve

C:\Users\seolzone\IdeaProjects\lifereact>npm install -g serve

added 89 packages, and audited 90 packages in 4s

24 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

C:\Users\seolzone\IdeaProjects\lifereact>npm serve -s serve
Unknown command: "serve"

To see a list of supported npm commands, run:
  npm help

C:\Users\seolzone\IdeaProjects\lifereact>npm serve -s build
Unknown command: "serve"

To see a list of supported npm commands, run:
  npm help

 

3.npx serve -s build

C:\Users\seolzone\IdeaProjects\lifereact>npx serve -s build

   ┌─────────────────────────────────────────┐
   │                                         │
   │   Serving!                              │
   │                                         │
   │   - Local:    http://localhost:3000     │
   │   - Network:  http://172.30.1.28:3000   │
   │                                         │
   │   Copied local address to clipboard!    │
   │                                         │
   └─────────────────────────────────────────┘

 HTTP  2023. 5. 16. 오후 8:39:31 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:39:31 ::1 Returned 200 in 58 ms
 HTTP  2023. 5. 16. 오후 8:39:36 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:39:36 ::1 Returned 200 in 2 ms

로컬 주소

  - Local:    http://localhost:3000     │
  - Network:  http://172.30.1.28:3000   │
   

 

배포후 기록이  터미널에 intellij에 남는다.

 HTTP  2023. 5. 16. 오후 8:39:31 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:39:31 ::1 Returned 200 in 58 ms
 HTTP  2023. 5. 16. 오후 8:39:36 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:39:36 ::1 Returned 200 in 2 ms
 HTTP  2023. 5. 16. 오후 8:41:40 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:41:40 ::1 Returned 200 in 2 ms
 HTTP  2023. 5. 16. 오후 8:41:45 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:41:45 ::1 Returned 200 in 2 ms
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 GET /
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 Returned 200 in 2 ms
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 GET /static/css/main.3068919b.css
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 GET /static/js/main.a8c82644.js
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 Returned 200 in 5 ms
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 Returned 200 in 8 ms
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 GET /favicon.ico
 HTTP  2023. 5. 16. 오후 8:43:42 172.30.1.28 Returned 200 in 3 ms
 HTTP  2023. 5. 16. 오후 8:45:26 172.30.1.28 GET /
 HTTP  2023. 5. 16. 오후 8:45:26 172.30.1.28 Returned 304 in 2 ms
 HTTP  2023. 5. 16. 오후 8:45:26 172.30.1.28 GET /static/css/main.3068919b.css
 HTTP  2023. 5. 16. 오후 8:45:26 172.30.1.28 GET /static/js/main.a8c82644.js
 HTTP  2023. 5. 16. 오후 8:45:26 172.30.1.28 Returned 304 in 4 ms
 HTTP  2023. 5. 16. 오후 8:45:26 172.30.1.28 Returned 304 in 4 ms
 HTTP  2023. 5. 16. 오후 8:45:57 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:45:57 ::1 Returned 200 in 1 ms
 HTTP  2023. 5. 16. 오후 8:46:02 ::1 GET /ws
 HTTP  2023. 5. 16. 오후 8:46:02 ::1 Returned 200 in 1 ms