作為一個轉職前端者,Side Project固然是一個必修課題。我決定利用這次鐵人賽的機會,紀錄初次開發專案的過程,與其他工程師合作,共同開發一個類SNS——且同時具有社群功能(類論壇形式)的網站專案——利用Firebase處理後台,並用Vue框架去開發。
除了介紹前兩個開發工具外,也會嘗試寫下開發時運到的問題與解法,讓這次的開發不僅僅專注於成品的完成,還有訓練自己解決問題的能力。
可能文章多有不成熟或誤讀之處,請大家不吝惜於提供指正與意見,先謝謝各位前端前輩們。
前言 昨天建置好環境後,今天終於能進入如何實際運用Vue這個框架的環節。 創建應用實例 第一步,創建Vue應用: import { createApp } f...
前言 在前一篇文章中,介紹了Vue3的模板語法,讓我們對Vue3的模板有了初步的認識。今天我們要來介紹Vue3中非常重要的一個部分 —— 指令(Directi...
前言 前一篇文章介紹了模板語法,今天我們將介紹Vue3的響應式基礎。在Vue3中,我們可以通過ref和reactive兩種響應式API創建響應式數據。ref和...
前言 今天要來講解v-bind的應用,以及它與class和style的綁定: 資料綁定提供了在HTML元素中靈活操作CSS類別列表和內聯樣式的解決方案,這是一...
前言 今天我們要來介紹如合用v-on這個指令進行監聽事件的處理。在 Vue 中,我們可以通過v-on指令(簡寫為@)來監聽DOM元素的事件,當指定事件被觸發時...
前言 今天將來初步了解生命週期的部分,並簡單介紹生命週期鉤子的名詞。 簡介 Vue 3 的生命周期是組件從創建到銷毀的整個過程,包含了一系列的生命週期鉤子:在...
前言 今天開始的工作日誌會比較流水帳化,變成主要紀錄今天預定的進度與踩到的坑以及解決的問題等。先進行各項工作時的具體操作步驟,省略比較瑣碎或重複性的部分,著重寫...
前言 今天繼續開發,重點著重在:初步探索Tailwind與理解App.vue。 工作重點 Tailwind 之前的專案架構下是使用了boostap切版,這次先諮...
前言 今天是開發的Day3,主要任務仍是切版與熟悉Tailwind。 實現內容 頁面大致完成,置換字型和顏色 已解決問題 如何在Vue中導入Google...
前言 今天是開發的Day4,重點為RWD版面以及V指令的複習。 實現內容 RWD修正 Tailwind:斷點、自定義變數 v-model指令 已解決問題...