iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 1
1
自我挑戰組

不用前端框架 手把手打造基礎SPA網站系列 第 1

[DAY01]前言-踏上SPA學習之旅

大家好,I am Yellow River,這次是第一次報名自我挑戰賽,題目是:「不用前端框架 手把手打造基礎SPA」。先簡單介紹一下自己,小弟任職過3年網頁設計,今年正式轉職為前端程式開發,負責研發雲端產品,過著白天工程師,晚上攻城屍的生活,沒想到轉眼間就到了驗收專案的月份,是不是很令人振奮阿?(才怪)

賽前其實很猶豫要不要報名,折騰一番後決定參加自我挑戰賽,打算把近來的研究整理成一系列的文章,畢竟快樂學習嘛~不要有壓力,就算沒完賽天也不會塌下來阿!(喂)

在決定寫這篇文章前,自己內心有個疑問,現今框架技術成熟,為何還要透過手動來寫SPA(Single Page Application)呢? 主要是目前正在學習React,但對於運作原理始終想要知道更多些,自從看了些網路大神們的文章,心血來潮決定不用框架來寫SPA,以原生Javascript來做出SPA網頁,希望可以讓各位明白SPA的原理與特性。因為也算剛接觸不久,若內容有誤也請各位前輩不吝指正。

本次挑戰賽預計撰寫的內容如下(共分為30天):

  1. SPA原理
  2. Javascript和SPA的關聯
  3. 使用NPM管理專案
  4. Webpack+ES6模組化開發
  5. 使用物件來建立頁面
  6. Router與Routes
  7. 渲染後的回呼函式(Callback after Render)
  8. 使用監聽事件
  9. 管理共同函式及狀態
  10. 番外篇-使用Bootstrap美化介面
  11. 番外篇-建立自訂函式模組
  12. 番外篇-使用非同步請求抓取資料
  13. 總結

第一篇算是暖身,所以沒有任何程式碼,希望大家快樂學習!


下一篇
[DAY02]3分鐘帶你初步認識SPA
系列文
不用前端框架 手把手打造基礎SPA網站30

尚未有邦友留言

立即登入留言