「使用 Vue 3 從 0 到 1 架設網站!!!」,盼讀者可以透過該主題,瞭解網站從0到1的整個建置過程。以及會使用到哪些技術堆疊。所以並不會單一的介紹特定技術,而是會介紹在架站的過程當中,使用到了哪些技術,及技術所扮演的角色。
例如:
1、使用 Vite 來當做 dev server。
2、使用 Git 來做版控。
3、使用 Vue 來做元件。
4、使用 Vue Router 來做單頁應用程式(SPA)。
5、使用 GoDaddy 來購買網域。
6、使用雲端主機來上線網站。
當然不只這些,以上所使用到的技術都可以替換成自己熟悉的工具。
希望對讀者有幫助,也可以一起動手做。
目前已經登入成功,那就先來將登入狀態處理一下,以及登出的功能。 驗證 JWT 的 API 在 typedefs.ts 檔案,先加上以下的 checkJWT 那...
登出功能原來是寫在 Home.vue 當中,但像這種登出功能,是很多頁面其實也會用到,像這類型的功能,如果能夠一直往父層去放的話,比較能達到所謂共用的目的。 所...
目前有三個頁面,分別是(以下列出本機端的範例網站): 首頁(http://127.0.0.1:5173/):這個頁面不論有無登入,都可瀏覽。 註冊頁(http...
接下來就倒數七天的文章了,今天想先闡述一下目前的架構,以及後續的佈署。 前後端分離,所以目前有兩個網站 兩個網站描述如下: 使用 Vite + Vue 3 +...
目前有一個資料夾 webmix_efficiency,也就是一開始使用 vite 架設出來的網站。 接下來要產出靜態網站,並 push 到 GitHub。 第一...
在上一篇文章當中,已經將網站 push 至 GitHub 上的特定 repo 了。接下來呢,就要透過 DigitalOcean 上的 Apps 服務,經過設定之...
先前所寫的 GraphQL API,筆者想要用 Docker 的方式,也就是打包成映像檔(Image),然後做佈署。所以今天就來練習一下,怎麼打包成映像檔。 目...
今天要來將 GraphQL API 的映像檔,佈署至 DigitalOcean 的 Apps 服務。 Dockerfile 建立映像檔 在 webmix_api...
在 webmix_efficiency 資料夾下,在串接 API 時,筆者之前都是寫 localhost 這樣的 API,所以當佈署到伺服器上時,會導致 API...
今天是參與「2022 iThome 鐵人賽」的最後一天,就不寫程式了。 想談論一下寫的學習過程心得以及簡單的自介。 前後端分離架構及佈署 前端架構及佈署 使用了...