Skip to content

Instantly share code, notes, and snippets.

@Domiii
Last active April 30, 2019 06:45
Show Gist options
  • Save Domiii/0598e09327ba0a6e3a71747e9ad009e2 to your computer and use it in GitHub Desktop.
Save Domiii/0598e09327ba0a6e3a71747e9ad009e2 to your computer and use it in GitHub Desktop.

『開發互動式網站 + 程式設計』的(社團模式的)營隊

走路走 100km 的概念~

  • 我們希望可以讓有興趣的同學
  • 慢慢往前進,不斷的有進展,就可以學會學到好~
  • 要快速衝的話,就會到第一個脈絡之前就沒力氣了~

TA

  • 已經知道想要投入的 高中生/大學生/大人為主 (很有投入度/很有好奇心/願意學習的國中生當然也可以~)

時間

  • 夏天、三個禮拜,每個禮拜有三個下午(共 9 個下午)

最後產出 + 結果的期待:

  • 最後的結果一定會有,不過。。。 最後結果每個人都會不一樣,而且完整度都要看個人的狀況~
  • 最大的收穫可以期待是: 離開這個營隊之後會知道:
    • 程式設計是怎麼一回事
    • 程式設計如果要繼續學習的話,會知道怎麼做,知道怎麼找,知道怎麼走
    • 會有許多新的『學習程式設計』的技術與基礎,以後可以把更多概念與作法疊上去~
  • 心理準備:
    • (如果沒有基礎的話)可以從0開始學程式設計
    • 開始學習網站開發的程式設計技術(10 天肯定只是個起點,是個體驗,以後要繼續做才有任何意義~)
    • 開始建立一些『如何學會程式設計?』的自學習慣與能力
      • 突破程式設計新手平常都會踏入的大陷阱
    • 程式設計的學習沒有辦法趕,所以希望大家可以保持平常心~

氣氛

  • 輕鬆、自由自在(每個人可以自己選擇要做什麼)
  • 順利(Domi 每天介紹新的(很基礎的)學習資源,而且卡住的時候 Domi 會幫忙~)
  • 精彩 (Domi 每天會準備小組討論+實作的活動)
  • 不是『托兒模式』,每個人做的東西就是每個人自己執行的~

課綱

  1. 更多細節
  2. JavaScript 基礎
  3. 『用程式來解決問題的訓練』
    • JS 練習挑戰題目
  4. HTML+CSS 基礎
  5. 把東西做的漂亮一點
    • CSS: Flexbox
    • CSS 逆向工程挑戰
    • Bootstrap + Bootstrap Button
    • Bootstrap Navbar
  6. 本機網站端開發工具 基礎
    • Chocolatey(win)/homebrew(mac)
    • JS 的執行環境: Node
    • Node, NPM + 終端機使用 基礎
    • 編輯器: VSCode
  7. React 基礎 + es6 基礎 - 第一次做一個互動式的網站
  8. create-react-app
  9. react-router + 多個頁面的網站
  10. firebase: 讓使用者互相互動
    • firebase tutorial
    • firebase 基礎挑戰
  11. 程式設計基本功
    • 英打 + 打程式碼的練習
    • (滿滿)克服『英文太多』的焦慮與技巧
    • 編輯器使用技巧
    • 更多~

進行方式

  • Domi 每天分享+介紹一個學習資源 + 它的使用方式 + 它的難題在哪裡
    • 想要試試看新的東西的話,就選擇新的
    • 想要繼續做原來的東西,就先繼續做
  • Domi 不會逼迫任何人做任何事情
    • 每個人每天自己選擇自己要做什麼,自己執行
    • Domi 協助你 organize 你自己的學習路徑~
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment