iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

用vue.js寫出一個實用的科內分享網站 系列

常看到許多網站教學如何寫出一個漂亮的網站,但很少有教學寫出一個實用且實際上能用的網站,所以我想以一個實際上有作用,而且能使用的角度下用vue.js去雕刻一個網站,並且在我們公司有測試環境所以能夠模擬真實網站需要上架的情況,並供科內的同仁使用,那主題就定為科內分享網站

鐵人鍊成 | 共 30 篇文章 | 13 人訂閱 訂閱系列文 RSS系列文
DAY 1

Day1為什麼要做網站勒?

【前言】其實有蠻多很有趣的的主題,最後會選擇做一個平庸的網站,原因是想要圓一個大學時期的後悔 大學讀的是資訊管理,有一堂課是WEB後端網站,老師提供了一個方便,...

2021-09-13 ‧ 由 喬飛 分享
DAY 2

Day2安裝vue我選擇的是vue3!!

我的編譯器使用vscode在終端機下 vue create XXXX(檔案名稱)即可看到這個畫面 (要先安裝node.js 這邊就不多做贅述了XD)再來這邊選擇...

2021-09-14 ‧ 由 喬飛 分享
DAY 3

Day3大哥我錯了我選擇vue2

接續昨天我們要決定使用哪一個前端框架 最後我選擇使用vuetify 使用前端框架的用意是讓我們的網站變得水水(漂漂) 而且前端框架的網格系統(grid)使得我們...

2021-09-15 ‧ 由 喬飛 分享
DAY 4

Day4給你一個導覽列大家說好不好

今天從導覽列開始做 首先先把 components裡的helloword .vue 跟有import helloworld.vue的文字刪除v-main v-a...

2021-09-16 ‧ 由 喬飛 分享
DAY 5

Day5給你一個漂漂的導覽列大家說好不好!

延續昨天,今天來完成一個導覽列吧!!首先先在components創一個navbar.vue 像昨天那樣直接創在app.vue不是一個好的範例,最好把組件分開v-...

2021-09-17 ‧ 由 喬飛 分享
DAY 6

Day6一個網站總需要一點首頁吧!

延續昨天 今天從首頁開始下手我的首頁想放入科內同仁的文章(類似ptt部落格的感覺)跟之前一樣去vuetify網站看看有沒有適合的tag作為載體我所使用的是 v-...

2021-09-18 ‧ 由 喬飛 分享
DAY 7

Day7綁手綁腳綁Class

延續昨天今天主要研究如何把v-for裡面的item做一個客製化的css或是icon找了許久發現一篇不錯的影片也是在教vuetify怎麼使用 裡面則提到如何用名稱...

2021-09-19 ‧ 由 喬飛 分享
DAY 8

Day8燈燈燈燈登入

延續昨日今天來研究一下登入!首先要先有一個登入畫面在views新增一個檔案 檔案名稱叫做login.vue 再來直接複製about頁面的全部東西 再來去rout...

2021-09-20 ‧ 由 喬飛 分享
DAY 9

Day9傑森史塔森#vue.js資料庫使用json server

延續昨天今天要來做註冊頁把註冊的按鈕給加了上去以下是目前頁面 那我們就開始搞註冊頁吧!跟day8的流程一樣就不多贅述了總之我新增了一個register.vue然...

2021-09-21 ‧ 由 喬飛 分享
DAY 10

Day10你敢不敢給我登入

延續昨日有了資料庫之後再來就是想想如何登入!登入的意思就是你輸入的帳號密碼都和資料庫的帳號密碼一樣了解了這個思路接下來就來實作看看首先 在終端機下json-se...

2021-09-22 ‧ 由 喬飛 分享