PTT推薦

[分享] 我寫了一份超新手 JavaScript 入門教材

看板Soft_Job標題[分享] 我寫了一份超新手 JavaScript 入門教材作者
poopoo888888
(阿川)
時間推噓48 推:48 噓:0 →:50

大家好,小弟最近在教朋友 JavaScript,寫了一份自學教材

我發現傳統的程式設計教法,從程式觀念一個一個介紹,有點無聊,很多人無法吸收

所以我想說換個方法試試,以不斷寫「小專案」為主,然後在過程中

順便吸收會用到的程式觀念,這樣比較好玩,比較好消化

目前已開發五份課程,共35課 + 35份作業

Part 1 - https://codelove.tw/@howtomakeaturn/course/l3j5xk

Part 2 - https://codelove.tw/@howtomakeaturn/course/vx8gqZ

Part 3 - https://codelove.tw/@howtomakeaturn/course/gqveaW

Part 4 - https://codelove.tw/@howtomakeaturn/course/837eq0

Part 5 - https://codelove.tw/@howtomakeaturn/course/Zq4v3w

已經把內容簡化再簡化、先只教最最簡單的東西

應該可以降低新手的入門挫折,而且只談 JavaScript 基礎、DOM 基礎、前端基礎

不教 React, Vue 等等框架,但是背後的觀念都會談,基本功先有,之後學框架更容易

如果有完全沒基礎的朋友,可以試試看,或許會對 web 領域開始有興趣!

跟大家分享一下~!

(教材持續開發中,這邊先分享五份,應該夠新手天天研究、寫作業1個月左右)

--

※ PTT 留言評論
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 1.161.36.252 (臺灣)
PTT 網址

DrTech01/23 10:19真的完全不懂的新手,連你教材上的 HTML onclick要怎麼跑

DrTech01/23 10:19起來,都做不到好嗎。建議站在使用者的角度寫教材。

DrTech01/23 10:22JS,HTML,與瀏覽器的關係要先講,不然根本是背步驟做事而

DrTech01/23 10:22已。

DrTech01/23 10:31作業更好笑:不想把商品報價、聯絡方式直接顯示在畫面上。

DrTech01/23 10:31違反正常UX的做法。沒事增加一個按鈕步驟來湊作業題。明明

DrTech01/23 10:31有更好的例子onclick可以用在哪裡。

Hsins01/23 10:53幫推 :) 人家就說了試著用做小專案方式呈現,而不是傳統方

Hsins01/23 10:53式的教材,不用嫌棄成這樣吧,有點類似 Wes Bos 那個 JavaS

Hsins01/23 10:53cript 30 的簡易版本

mercurycgt6801/23 11:04

TheArrow01/23 11:22推好心~

makeout01/23 11:32推好心,原PO的動機很好,願意嘗試並提供新手入門,樓上

makeout01/23 11:32的說明也是合理,但如果能用建議的口氣更好,沒看過影片

makeout01/23 11:32,但覺得原PO用不同角度切入不錯

holebro01/23 11:39我也很好奇有經驗工程師跟完全菜鳥的gap之間對教材設計

holebro01/23 11:39的影響 但不知道資工所碩論做這個教授給不給過

javy052101/23 11:54

GoalBased01/23 12:1516樓 我聽過有人報告給教授類似的東西 被教授說了一聲

GoalBased01/23 12:15垃圾丟到地上 第一次看我們在學校教授發飆

GoalBased01/23 12:16*第一次看到教授在學校發飆

chchchuang01/23 12:21推好心

hobnob01/23 14:38這個主題不是學術研究,所以產不出論文,當然就拿不到補助

hobnob01/23 14:38,只可以當做好事但不能畢業

adsl1236701/23 14:47教授當然不給過啊

lovdkkkk01/23 14:52建議可以直接用 Github 提供完整檔案,下載或復制內容另

lovdkkkk01/23 14:53存再用瀏覽器打開等等,真的嬰兒看 jsfiddle 也是不清楚

Apache01/23 16:28師大資教所

andrew022001/23 17:01推好心

NTUTM0401/23 18:21推有心

canis83102501/23 19:10推好心

MoonCode01/23 19:20讚 比出張嘴的強不知道多少了

smdf01/23 19:39推好心

new12285101/23 19:50免費的還嫌喔,心胸狹窄欸

Csongs01/23 20:191f竟然還有耐心看完

t51059901/23 20:21

eva1945200201/23 22:06我有稍微看一下,第一個課程就在教function概念及撰

eva1945200201/23 22:06寫,完全不認為沒寫過程式的人就看得懂,如果是給完

eva1945200201/23 22:07全沒寫過javascript的程式設計師學習,那就很適合

yuinami01/23 22:14好心推

async01/23 23:13市面上已經有很多本基礎入門的書,已經是校閱過的,直接買

async01/23 23:13來看應該比較完整

tkd0915212901/24 01:18

OkamiIII01/24 01:30推推

s06yji301/24 01:371F的回饋有道理

vi00024601/24 02:03我也覺得直接看W3C school會比較好

vi00024601/24 02:04不過對初學者是引起興趣比較重要

jay123peter01/24 05:44

hduek15301/24 05:47這種中間的就是 太菜的看不懂 不夠菜的不一定看

analyze001/24 09:21

gtjs4501/24 12:08雖然很基本 但有分享有推

gtr2210136101/24 12:16分享知識給推

silenthillwu01/24 13:43感恩,好心

mohai01/24 16:19回樓上,資訊教育這個主題也是學術研究,如果你的教授是軟

mohai01/24 16:19體工程領域的,或是師範大學軟體相關系所才會有興趣做類似

mohai01/24 16:19的題目

mohai01/24 16:22如果真的要做類似研究要找到對教授跟學校,我身邊就一堆碩

mohai01/24 16:22士用資訊教育相關的題目畢業,眼界不要這麼狹隘。

stygian235701/24 18:50推熱情

peter9801/24 20:37確實 這是新手教學 上面在那邊扯UX的真的很會

peter9801/24 20:38乾脆說教C的一開始教printf("Hello World");的很廢算了

peter9801/24 20:38反正debug都馬是printf("123");

menesn01/24 22:37我想學async,要怎麼確保可以從DB讀到內容再作下一件事

menesn01/24 22:37nodejs function在module裡面沒辦法用await,很苦惱

shter01/24 23:01為何 module 裡面不能用 async await ?

shter01/24 23:02Node.js 8 之後就原生支援 async function 能用 await

shter01/24 23:04module.exports 的 function 用 async 內部就能 await

shter01/24 23:07require async function 如果不用 await 接就當 promise 用

kenny6141001/24 23:14

secretfly01/24 23:28一樓標準嘴砲腦XDDD 你說新手看不懂就看不懂喔

secretfly01/24 23:29這邊的人怎麼都只會出一張嘴 人家編排有它的風格啊

secretfly01/24 23:30啊不然要別人怎麼學 看MDN?還是又是那一套舊的教學?

secretfly01/24 23:30舊的教學那麼了不起那麼好 那就不用來看這個教材就好

secretfly01/24 23:32說要丟github更好笑 新手最好是搞得懂github怎麼用

secretfly01/24 23:32真的是要怎麼嫌 什麼可悲智障理由都有欸 笑死

lovdkkkk01/25 00:02不放 github 提供檔案下載連結直接下載也可以

lovdkkkk01/25 00:03重點不是放 github, 是提供完整可執行的檔案

lovdkkkk01/25 00:04我是覺得直接檔案拉進瀏覽器能跑會比較直白啦

lovdkkkk01/25 00:05其實放 github 也一樣可以給檔案連結

lovdkkkk01/25 00:06新手不用會用 github, 只要會開連結, 複製貼上或另存

kenkio01/25 00:14超讚的 如果我一開始學的時候就讀這套就不會學得那麼辛苦

kenkio01/25 00:14了!

jason860701/25 00:18有熱情推

geraldliu9801/25 00:44推風氣

menesn01/25 08:17shter感謝大大

mathrew01/25 14:26推分享,有這種熱情很讚

shaly081501/25 19:36

kuochuwon01/25 21:56網頁很完整,如果新手期看到這個會很感激

ku39999901/25 22:21覺得人家有可改進做不好的地方也不用講話這麼gy吧

hanksky01/26 06:58我有其他語言經驗,最近在學js,已經看過基礎書籍,這篇

hanksky01/26 06:58內容剛好符合我的需求,謝謝分享,感覺如果完全沒語言經

hanksky01/26 06:58驗可能還要自己再多學基礎,才比較適合

dingdingcho01/26 12:57推推推

rkl01/26 13:24

lazarus112101/26 15:52從DOM開始很OK,不過接javascript新手應該看不懂

demon99028001/26 19:02推好心

zxcchiou01/26 20:14

pacino01/26 20:45某Dr到處嗆人,人家捐錢卻嫌人捐太少?自己捐多少?