作者poopoo888888 (阿川)
看板Soft_Job
标题[分享] 我写了一份超新手 JavaScript 入门教材
时间Mon Jan 23 10:15:57 2023
大家好，小弟最近在教朋友 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.cc), 来自: 1.161.36.252 (台湾)
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Soft_Job/M.1674440160.A.AE4.html
1F：→ DrTech: 真的完全不懂的新手，连你教材上的 HTML onclick要怎麽跑 01/23 10:19
2F：→ DrTech: 起来，都做不到好吗。建议站在使用者的角度写教材。 01/23 10:19
3F：→ DrTech: JS，HTML，与浏览器的关系要先讲，不然根本是背步骤做事而 01/23 10:22
4F：→ DrTech: 已。 01/23 10:22
5F：→ DrTech: 作业更好笑：不想把商品报价、联络方式直接显示在画面上。 01/23 10:31
6F：→ DrTech: 违反正常UX的做法。没事增加一个按钮步骤来凑作业题。明明 01/23 10:31
7F：→ DrTech: 有更好的例子onclick可以用在哪里。 01/23 10:31
8F：推 Hsins: 帮推 :) 人家就说了试着用做小专案方式呈现，而不是传统方 01/23 10:53
9F：→ Hsins: 式的教材，不用嫌弃成这样吧，有点类似 Wes Bos 那个 JavaS 01/23 10:53
10F：→ Hsins: cript 30 的简易版本 01/23 10:53
11F：推 mercurycgt68: 推 01/23 11:04
12F：→ TheArrow: 推好心~ 01/23 11:22
13F：推 makeout: 推好心，原PO的动机很好，愿意尝试并提供新手入门，楼上 01/23 11:32
14F：→ makeout: 的说明也是合理，但如果能用建议的口气更好，没看过影片 01/23 11:32
15F：→ makeout: ，但觉得原PO用不同角度切入不错 01/23 11:32
16F：推 holebro: 我也很好奇有经验工程师跟完全菜鸟的gap之间对教材设计 01/23 11:39
17F：→ holebro: 的影响 但不知道资工所硕论做这个教授给不给过 01/23 11:39
18F：推 javy0521: 推 01/23 11:54
19F：→ GoalBased: 16楼 我听过有人报告给教授类似的东西 被教授说了一声 01/23 12:15
20F：→ GoalBased: 垃圾丢到地上 第一次看我们在学校教授发飙 01/23 12:15
21F：→ GoalBased: *第一次看到教授在学校发飙 01/23 12:16
22F：推 chchchuang: 推好心 01/23 12:21
23F：推 hobnob: 这个主题不是学术研究，所以产不出论文，当然就拿不到补助 01/23 14:38
24F：→ hobnob: ，只可以当做好事但不能毕业 01/23 14:38
25F：→ adsl12367: 教授当然不给过啊 01/23 14:47
26F：推 lovdkkkk: 建议可以直接用 Github 提供完整档案，下载或复制内容另 01/23 14:52
27F：→ lovdkkkk: 存再用浏览器打开等等，真的婴儿看 jsfiddle 也是不清楚 01/23 14:53
28F：推 Apache: 师大资教所 01/23 16:28
29F：推 andrew0220: 推好心 01/23 17:01
30F：推 NTUTM04: 推有心 01/23 18:21
31F：推 canis831025: 推好心 01/23 19:10
32F：推 MoonCode: 赞 比出张嘴的强不知道多少了 01/23 19:20
33F：推 smdf: 推好心 01/23 19:39
34F：→ new122851: 免费的还嫌喔，心胸狭窄欸 01/23 19:50
35F：推 Csongs: 1f竟然还有耐心看完 01/23 20:19
36F：推 t510599: 推 01/23 20:21
37F：→ eva19452002: 我有稍微看一下，第一个课程就在教function概念及撰 01/23 22:06
38F：→ eva19452002: 写，完全不认为没写过程式的人就看得懂，如果是给完 01/23 22:06
39F：→ eva19452002: 全没写过javascript的程式设计师学习，那就很适合 01/23 22:07
40F：推 yuinami: 好心推 01/23 22:14
41F：→ async: 市面上已经有很多本基础入门的书，已经是校阅过的，直接买 01/23 23:13
42F：→ async: 来看应该比较完整 01/23 23:13
43F：推 tkd09152129: 推 01/24 01:18
44F：推 OkamiIII: 推推 01/24 01:30
45F：推 s06yji3: 1F的回馈有道理 01/24 01:37
46F：推 vi000246: 我也觉得直接看W3C school会比较好 01/24 02:03
47F：→ vi000246: 不过对初学者是引起兴趣比较重要 01/24 02:04
48F：推 jay123peter: 推 01/24 05:44
49F：→ hduek153: 这种中间的就是 太菜的看不懂 不够菜的不一定看 01/24 05:47
50F：推 analyze0: 推 01/24 09:21
51F：推 gtjs45: 虽然很基本 但有分享有推 01/24 12:08
52F：→ gtr22101361: 分享知识给推 01/24 12:16
53F：推 silenthillwu: 感恩，好心 01/24 13:43
54F：推 mohai: 回楼上，资讯教育这个主题也是学术研究，如果你的教授是软 01/24 16:19
55F：→ mohai: 体工程领域的，或是师范大学软体相关系所才会有兴趣做类似 01/24 16:19
56F：→ mohai: 的题目 01/24 16:19
57F：推 mohai: 如果真的要做类似研究要找到对教授跟学校，我身边就一堆硕 01/24 16:22
58F：→ mohai: 士用资讯教育相关的题目毕业，眼界不要这麽狭隘。 01/24 16:22
59F：推 stygian2357: 推热情 01/24 18:50
60F：→ peter98: 确实 这是新手教学 上面在那边扯UX的真的很会 01/24 20:37
61F：→ peter98: 乾脆说教C的一开始教printf("Hello World");的很废算了 01/24 20:38
62F：→ peter98: 反正debug都马是printf("123"); 01/24 20:38
63F：推 menesn: 我想学async，要怎麽确保可以从DB读到内容再作下一件事 01/24 22:37
64F：→ menesn: nodejs function在module里面没办法用await，很苦恼 01/24 22:37
65F：推 shter: 为何 module 里面不能用 async await ? 01/24 23:01
66F：→ shter: Node.js 8 之後就原生支援 async function 能用 await 01/24 23:02
67F：推 shter: module.exports 的 function 用 async 内部就能 await 01/24 23:04
68F：→ shter: require async function 如果不用 await 接就当 promise 用 01/24 23:07
69F：推 kenny61410: 推 01/24 23:14
70F：推 secretfly: 一楼标准嘴炮脑XDDD 你说新手看不懂就看不懂喔 01/24 23:28
71F：→ secretfly: 这边的人怎麽都只会出一张嘴 人家编排有它的风格啊 01/24 23:29
72F：→ secretfly: 啊不然要别人怎麽学 看MDN？还是又是那一套旧的教学？ 01/24 23:30
73F：→ secretfly: 旧的教学那麽了不起那麽好 那就不用来看这个教材就好 01/24 23:30
74F：→ secretfly: 说要丢github更好笑 新手最好是搞得懂github怎麽用 01/24 23:32
75F：→ secretfly: 真的是要怎麽嫌 什麽可悲智障理由都有欸 笑死 01/24 23:32
76F：推 lovdkkkk: 不放 github 提供档案下载连结直接下载也可以 01/25 00:02
77F：→ lovdkkkk: 重点不是放 github, 是提供完整可执行的档案 01/25 00:03
78F：→ lovdkkkk: 我是觉得直接档案拉进浏览器能跑会比较直白啦 01/25 00:04
79F：→ lovdkkkk: 其实放 github 也一样可以给档案连结 01/25 00:05
80F：→ lovdkkkk: 新手不用会用 github, 只要会开连结, 复制贴上或另存 01/25 00:06
81F：推 kenkio: 超赞的 如果我一开始学的时候就读这套就不会学得那麽辛苦 01/25 00:14
82F：→ kenkio: 了！ 01/25 00:14
83F：推 jason8607: 有热情推 01/25 00:18
84F：推 geraldliu98: 推风气 01/25 00:44
85F：推 menesn: shter感谢大大 01/25 08:17
86F：推 mathrew: 推分享，有这种热情很赞 01/25 14:26
87F：推 shaly0815: 推 01/25 19:36
88F：推 kuochuwon: 网页很完整，如果新手期看到这个会很感激 01/25 21:56
89F：推 ku399999: 觉得人家有可改进做不好的地方也不用讲话这麽gy吧 01/25 22:21
90F：推 hanksky: 我有其他语言经验，最近在学js，已经看过基础书籍，这篇 01/26 06:58
91F：→ hanksky: 内容刚好符合我的需求，谢谢分享，感觉如果完全没语言经 01/26 06:58
92F：→ hanksky: 验可能还要自己再多学基础，才比较适合 01/26 06:58
93F：推 dingdingcho: 推推推 01/26 12:57
94F：推 rkl: 推 01/26 13:24
95F：→ lazarus1121: 从DOM开始很OK，不过接javascript新手应该看不懂 01/26 15:52
96F：推 demon990280: 推好心 01/26 19:02
97F：推 zxcchiou: 推 01/26 20:14
98F：推 pacino: 某Dr到处呛人，人家捐钱却嫌人捐太少？自己捐多少？ 01/26 20:45
99F：推 hsiliang: 推分享 01/27 12:10
100F：推 anselhsuen: 推分享 01/27 12:14
101F：推 mcps5601: 感谢分享 01/27 13:26
102F：推 i78524: 推热情 赞赞 01/27 14:28
103F：推 LenaPark: 赞 01/27 15:07
104F：推 CarpeDiemAL: 推推 一楼大概人生很不如意吧可怜R 01/28 17:08
105F：推 paly: 支持 01/28 18:47
106F：推 a82611141: 推用心 01/29 14:06
107F：推 michael4210: 推 01/29 22:48
108F：推 upasaka: 不用看视频W3 school教村狂做三篇必有所得，看不懂英文説 01/30 02:57
109F：→ upasaka: 明装 chrome外挂「侧边翻译」，看不懂句子段落翻一下。 01/30 02:57
110F：推 sx4152: 帮推 01/30 13:27
111F：→ loadingN: 我就好奇 所以有新手看了这个有兴趣吗？ 01/30 14:06
112F：→ sx4152: 我是觉得新手连第一个教学都无法做出来 01/30 16:11
113F：推 overhead: 一楼只是语气不够客气，但评语很紥实 01/31 01:14
114F：推 victor999: 推 01/31 09:28
115F：推 jackal998: 推 01/31 11:57
116F：推 zonppp: 真的"超"新手应该没办法理解这份教材吧 01/31 13:56
117F：推 sjr500: 推用心 01/31 21:28
118F：推 DSB520: 一楼语气不好但讲的没错 01/31 22:12
119F：→ DSB520: 教材看得懂的用不太到 看不懂的还是看不懂 01/31 22:12
120F：→ DSB520: 感觉教材族群偏窄 但真的谢谢热心 01/31 22:12
121F：推 vi86199764: 推好心 02/01 00:29
122F：推 t7552175: 推 02/01 17:51
123F：推 ZincAllure: 确实是给JS新手 而不是程式新手吧 第一堂课就提到HTML 02/02 11:24
124F：→ ZincAllure: /CSS 新手不可能懂吧 02/02 11:24
125F：嘘 johnny94: 纯嘘一楼，干什麽东西 02/03 21:03
126F：推 dyjo4949: 推 用心～ 02/03 22:31
127F：推 tenpoinyuki: 推好心 02/04 22:59
128F：推 chien2013: 推好心 02/05 01:13
129F：推 lokuyan: 好 02/07 22:17
130F：→ ch1rmon: 一楼就标准只会嘴炮主管性格，自己跳下来什麽都不会做 02/10 07:18
131F：推 newwer: 推 02/10 22:41
132F：推 virdust2003: 推 03/15 08:04