iT邦幫忙

2023 iThome 鐵人賽

DAY 4
0
自我挑戰組

30天用React開發運動教室網站系列 第 4

Day 4 | 發布React專案

  • 分享至 

  • xImage
  •  

上次教大家如何建立React新專案後,今天接著來說明如何發布React專案👍

發布React專案

yarn start指令⽤於React專案開發,要配合react套件執⾏才能看到⾴⾯

  • 如果要發布專案,必須使⽤ yarn build指令
  • yarn build會建立⼀個build⽬錄,裡⾯的網⾴可以直接發布⾄任何雲端伺服器
    ex. Github Page、Vercel

Vercel是什麼?

這裡會使用Vercel來建立與發佈網頁

  • Vercel相較於Github Page,屬於較為專業的雲端發佈空間
  • 有專⾨的網⾴管理⾴⾯
  • ⾃動發佈與CI/CD功能

  1. 先將local的專案程式碼push⾄github,再將github的專案同步⾄Vercel
  2. 選擇要發布的專案程式

    https://ithelp.ithome.com.tw/upload/images/20230919/20163332lfCtnri3n5.png
  3. 在環境變數(Environment Variables)新增變數CI=falsehttps://ithelp.ithome.com.tw/upload/images/20230919/20163332LdoBKwqiKa.png
  4. 發佈(Deploy)
    小提示:第一次發佈在Vercel後會⾃動build發佈⾄github的專案

今天的內容就到這裡啦~
我們明天見!


上一篇
Day 3 | 建立專案
下一篇
Day 5 | UI_Ant Design
系列文
30天用React開發運動教室網站6
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言