可以在 freeCodeCamp bilibili 频道观看本次分享的视频。

0、实务学堂

我主要是在一个叫“实务学堂”的学校使用 freeCodeCamp 教一群 15 到 18 岁的打工子弟学编程，目的是教他们一点技能，让他们能够找工作。

这个学校是在北京的郊区，是一个面向 15-18 岁农民工子女的全日制、非学历职业教育公益项目。它的使命和愿景是：探索打工子弟职业发展新路径，为好的社会培养“珍贵的普通人”。学校目前大概有 15 个孩子，他们的年龄是在初中到高中之间。

也许大家此前从创始人欧阳艳琴的两篇文章中了解过实务学堂：《如果教育不能改变阶层，还要做教育吗？》，《一个「珍贵的普通人」要如何成长》。

这是我们在学校年会上的分享：我们为什么来实务学堂当老师。

我们在这个学校里想实践一点“全人教育”。全人教育是我们思考目前中国的教育现状，找到的一个感觉值得探索的一个方向。说起来大家其实也不陌生，就是德智体的全面发展。但说起来容易，做起来难，尤其是那些资源受限的家庭的孩子，要做到这一点，实在是太难了。我们认为关键是降低成本、保证质量、促进他们全面而自由的发展。这是我们正在努力的目标。

具体到计算机科学，如果我们把它放到全人教育视角下观察，就会发现它不是简单的教人编程，而是有它的硬目标和软目标。

上面图片中列出的硬目标和软目标，是哈佛大学计算机科学方向的学生手册里写的。其中，硬目标除了设计、编程，还包括和外界交流、表达自己观点的能力。这对资源受限的孩子来说，是非常需要的。我们希望孩子们有这样的能力。而软目标也包括基本的道德观、合作能力等。这是我们除了编程教学以外工作的重点。

1、探索教育

孩子们学习前端还挺开心的。他们总结出学习前端的意义——能够看懂别人的代码，写出自己的网页，还可以找到工作。所以他们对这方面学习的期望还挺高的。

Khan

我们刚开始是用 Khan 的一套前端编程课程来教他们。这套课程涵盖 HTML、CSS、jQuery、JS 和 SQL。除了教授技术知识，还有一些专业人士通过视频跟学生交流自己在工作上是怎样的。

所以 Khan 整个是面向中学生，让他们探索一下职业发展的可能，建立兴趣，并不是说真的就能够把他们培训出来去工作，找到一份 Web 前端的工作。

Khan 的练习系统是这样的，能够根据学生的一些错误来提示。

它有一个特别强大的后台，能够显示学生在这上面学了多久，在课间学了多久，在课后又学了多久。

学生们学这个还蛮开心。从这两张照片可以看到他们学习时的情景。

但它是英文的，我们的学生学起来有些难度。

林大

然后我们又探索了林大的慕课。它的内容属于入门级别，课程最后有一个项目，是让学生做一个网站。有一位讲师引导学生建立一个网站。

就像课堂上课那样，不过是以视频的方式，老师一板一眼地在上面讲，然后讲完之后，有一些特别简单的练习。我们尝试了这种方式，发现学生们还是坐不住，另外练习题也太少了。

职校课程

然后我们也尝试了一些职业学校的课程，发现他们的课程特点是内容特别多、进度特别快。因为在职校里面，学生是半年左右要学完，所以是从早学到晚。但是在我们学堂里，很多学生不仅要学编程，还要学写作、阅读、项目管理、艺术等全方位的课程，所以这些职业学校的课程也不太适合我们。

所以我们通过两个学期的探索，最后总结出什么样的系统适合这些孩子。我们发现让他们从做中学（learning by doing），他们才能够有兴趣，才能坐得住。然后课程学起来还得容易上手，刚开始很简单，把他们带入坑，最后又能达到职业的水平。我们后来发现了 freeCodeCamp。

freeCodeCamp

我们发现 freeCodeCamp 的优点是什么呢？

第一点它是中文的，所以我们要特别感谢对 freeCodeCamp 进行汉化的志愿者，你们真的是非常棒，我非常感谢。要不然我们让那些孩子看英文的课程，他们太崩溃了。

第二呢，freeCodeCamp 是以“就业”为学习目标，这一点跟我们也特别匹配。因为我们这些孩子高中毕业以后，会面临选择职业。当然他们也有其他的一些职业，比如说服务行业，餐饮、快递这些行业。这些孩子其实挺聪明的，他们其实对前端开发有这样的兴趣，所以我们应该帮助他们探索一下这方面的经验。

另外我们特别感恩 freeCodeCamp 的就是它有一个很好的社区，大家在里面分享自己的职业发展的历程。而且里面有很多人原来也是没有学过编程的，然后通过 freeCodeCamp 成功地走向了编程的道路，所以孩子们从中也得到了很多的启发。志愿者们分享的那些文章，对大家来说就是一个最好的榜样。我们大家也在社区里面跟大家一起探讨，我觉得非常好。

然后 freeCodeCamp 是以练习为主，所以让大家能够从做中学。

我们的一位特别优秀的同学，罗明阳，他在给他的下一届同学介绍经验的时候，原话是 “freeCodeCamp 作业特别好，做 freeCodeCamp 特别重要”。

我们另外一位特别优秀的同学，王鑫，这是他的作品集。大家看这个背景就是 freeCodeCamp 的“作品集”项目，非常好。

他做了 freeCodeCamp 的致敬页项目，做了诗词网站，还有实务学堂简介页面。他也是一个特别喜欢做前端开发的同学。

2、资源分享

下面我跟大家分享一些资源。

教学

首先分享一些关于教学的。哈佛大学有一个叫 Bok 的教学中心。我们研究了 Bok 教学中心的“以学生为中心来设计课程”的这套理论和教程，我觉得很有收获，所以跟大家分享一下。

其实设计一个课程特别难，但是这个教学中心提出一个方法，“以练习为中心”——你要先设计一个课程，你先把练习设计好，然后从练习出发，来决定你要给学生们上什么课程，怎么安排课程的时间表，以及资源的调动。所以我们目前在用这个方法对我们的课程进行设计，收获很大。

第二个是斯坦福大学专门有一门课，《如何教新手学计算机编程》。当时我们觉得挺有意思的。他们专门给助教上了这门课。开发这门课程的老师本身是一个教育学博士，他曾经在高中任职，现在在斯坦福大学教大一的孩子编程。他专门写了一本书，挺好的。

然后这里还有一个小网站，上面有各种的 CS 的教学小技巧，比如：上课的时候，怎么让大家更加积极？debug 的时候，要提什么问题？挺有意思的。

卡耐基梅隆大学有一个学习实验室 LearnLab。这个实验室专门有一个硕士学位：怎么来开发教学系统。其实目前国内的各种教学软件、教学 APP、教学系统，都是非常热门，对吧？那么卡耐基梅隆大学有一系列的课程，硕士研究生在一些公司里实习一个学期或者一年，做一个毕业设计，其实就是做一个教育的 APP，所以他们很系统地培养这方面的人员，大家如果有兴趣的话，你可以去看看他们是怎么样的。

然后他们的课本是这本书，《e-Learning and the Science of Instruction》。大家要开发教育APP 的话，应该怎么开发？这本书详细地教大家从认知科学的角度来开发教学 APP，让学生学得更好。

研究

然后还有一些研究，比如说斯坦福大学有一个 Chris Piech 的团队，他们在做编程方面的一些研究。

比如说他能拿到很多学生的编程的数据，然后能够可视化，看出来这个学生是怎么学习编程，一路是怎么走过来的，给大家提供一些启发，设计自己的编程教学系统。

这是我们做过的一个研究，用深度学习的方法来建立习题的深度表征的模型，发现相似的题目，然后进行习题的推荐。假设有很多的学生可以让我们来实验的话，我们就可以像阿尔法狗似的，通过很多的“无辜的学生小白鼠”来实验，以寻找一种最优的导学策略。当然这是一个探索性的方式，在真实世界中非常的困难，我们不能随便用学生做实验的。

所以这是模仿阿尔法狗，做的一个人工智能导学系统。这是我们的一个学生做的，他的代码在 GitHub 上，大家可以去下载。

图像识别也是一个领域，比如说怎样把一些学生手册或者学生的一些手写的答案识别出来，然后录入系统。

会议

跟咱们有关的几个学术会议，其中最热门的就是 SIGCSE，它是 ACM 的一个特别的信息组，是关于计算机科学教育的，大家有兴趣的话可以关注。

有几个会议，比如 AIED 人工智能教育的会议、EDM 教育数据挖掘，这几个会议都还挺好玩，都是全世界的喜欢教计算机编程的老师，来自高中、大学，或者公益机构的，有印度的，有非洲的。大家都在那里探讨，怎么才能把孩子们教好，或者怎么把黑人的孩子教好，或者怎么把女孩子教好，大家都想了特别多的招，挺有意思的。他们每年会开一个会议，所以大家可以去会议的网站上去看他们在做什么。

工具

下面我跟大家分享一些简单的工具。第一个是叫作 Canvas 的教学系统，它有一个云平台，大家可以上去申请账号，免费账号是 500M。然后上面有一个完整的课程的教学平台，我们觉得很好的。我们学堂目前在用这个系统。

还有一个我们用来给学生的编程作业自动评分的系统，我们目前用的是卡耐基梅隆的这套系统，魏林老师给大家部署的，用起来也非常好。魏林老师目前是在深圳创业，他是一位非常优秀的老师。大家有兴趣的话可以跟我们联系，然后我们一起创业。

这是谷歌开发的一个工具，Quizlet。在国外很多英语老师用它来帮助学生们复习单词。对编程来说，因为编程里面很多单词是英文的，所以我们目前是用这个系统来帮助大家复习英语单词，也挺好玩的。好像这是谷歌开发的，后来独立出来，非常好的一个东西。它里面有很多的游戏，还可以对战，这样孩子们学起来就有兴趣了。

我们根据 freeCodeCamp 的内容做了一套测试题，给孩子们做测试。测试其实是一个帮助孩子们学习的一个特别好的工具，因为他知道要测试，那么他学习的时候就会更加认真地去从中总结一些知识点。这样其实能够帮助学生们更好地学习。测试的成绩其实不重要，但是测试能够帮助学生主动地去学习，这也是一个认知科学发现的一个规律。

所以我们根据 freeCodeCamp 的内容，一共总结了 200 道测试题，都是填空题。我们放在考试星网站上，如果大家有兴趣的话，可以来找我们要，我们可以分享给大家。

这是我们教学的一些材料，包括学生手册，教学大纲，第一天新教师上课的友情的提醒，以及我们的编程课总结，大家可以下载，也欢迎大家给我们指正。

课程

然后有些课程的资源，比如说纽约历史协会的编码实验室，这是挺好的一个实验室。比如说前端开发，它的课程会要求孩子们给某一个历史人物做一个网站，就像 freeCodeCamp 的第一个项目似的。

然后纽约教育局有一个 CS4All 的全套教案，里面有前端开发的内容。这套教案比较好的地方是每一堂课那一个小时应该怎么安排，它里面都有很详细的安排。这也是一套特别专业的教案。

这是我们家孩子学 Khan 里面的算法入门，她写了一些笔记。她写得挺开心的，所以我也分享给大家。可汗的算法入门课程非常棒。咱们知道有一本大学课本《算法导论》，课本的第一作者 Thomas H.Cormen，达特茅斯的一位教授，他在 Khan 里面给小孩子们上这门课，所以你想想这个课程是多么的专业。我们的孩子很喜欢，所以她做了详细的笔记，大家也是可以分享。

这个是英国剑桥大学的一个女孩子，她毕业了以后教孩子编程，在英国的电视节目上教学。然后 DK 给她出了一套少儿编程的课本。她刚开始是用 Scratch 教大家编程，然后过渡到 Python，最后会完成一个作业，就是 Python 打泡泡的一个游戏，是个可视化的游戏。当时我们觉得这套课本也非常好，也给学堂的孩子们上过。

目前我们是在用纽约的一个叫作 CodeNation 的公益组织开发的一套课程，这套课程是一套前端的课程，包括三个部分。它的目标跟我们特别一致，就是给那些资源贫乏的高中生提供材料，让他们能够从事编程的工作。

这套课程分为三个阶段，第一个阶段是入门，主要是帮助大家建立兴趣。第二个阶段是进阶，这时候需要调用一些 API。最后一个阶段是要调用 Freebase 数据库，开发一个真实的 React 应用。我们觉得特别好，目前我们正在用它的第一阶段课程的材料。

可视化编程的话，大家都对 Scratch 比较熟悉，但是这里我想要特别隆重地推荐谷歌的 Blockly 可视化编程。这是给软件开发人员的一套课程，所以它不像 Scratch 有很多比较开心的游戏什么的，它比较单纯，但是也很好玩。它直接就进入编程的一些基本概念，然后会映射到 JavaScript 的代码。

我们给孩子们做过一个 4 节课的编程夏令营，就用的这套材料，孩子们兴趣特别大。你看这里面还有一个特别小的孩子，他才上小学，所以可以说这套材料是“童叟无欺，老少皆宜”，非常好。谷歌的材料是非常专业的，我们真的非常感谢他们。

然后我们的魏林老师基于斯坦福的 CS106 编译了一套课程。因为 CS106 也是英文的，所以我们也花了很多的功夫，请了很多志愿者，帮我们一起来把这些作业进行汉化。魏林老师做了全套的教学视频放在了 B 站上（https://space.bilibili.com/393215832）。魏林老师目前在深圳寻找创业伙伴，有兴趣的同学我们可以一起来努力。

然后就是伯克利的一套课程，它分为两部分，一套叫作 WDD，就是 Web 开发。它的课程特点在于“左边是设计，右边是开发”。伯克利的设计学院非常优秀。它会讲网页怎么布局，比如说留白，怎么让网页上有它的重点，所以它左边是讲设计。右边是讲编程，从 HTML 讲起，一直讲到 JavaScript 的开发，也是挺有意思的一套课程，全部开源了。

大家知道 React 计算框架目前比较流行，所以伯克利专门针对 React 做了一套完整的课程，我们觉得非常好，希望我们的孩子未来能够进入 React 的编程开发。

最后一套课程是斯坦福的这套 CS142 Web 应用。虽然说是 Web 应用，但其实它是针对本科生的一套从 HTML 一直到后台数据中心的整个一套课程，甚至大家看它的内容包括了 cookie session、全栈的状态管理、网络安全攻击、大规模的分布式的处理，一直到数据中心。也就是说这是帮助学生在计算机科学领域打基础的一套课程，开拓学生的眼界，我们觉得非常好。

3、链接

借这个机会我想向大家求助。首先大家都是在各个公司里的程序员，我们学堂的孩子其实很需要寻找暑假实习和毕业实习的机会，如果大家能给我们提供机会，请跟我们联系。也欢迎大家成为我们学生们的老师。我们相信我们的学生能够从大家身上学到很多的东西。

此外，我们的魏林老师正在深圳创业，他是一个非常非常热心、非常有追求的老师。他是从英国回来，想做一种与众不同的教育。所以我们也欢迎大家一起来创业。我们非常看好软件开发方向的职业教育领域创业。因为有很多的人需要再培训，我们国内也面临同样的挑战。

所有上面这些资源，大家都可以到这个网页，进入《全人教育下资源受限高中生的前端编程教育》这个 PPT，得到资源的链接。这个网页上也有我们正在为孩子们上的、参照纽约 CodeNation 课程开发的《前端开发趣味入门》课程的全部材料（视频、练习代码、同学作品），供大家参考。

最后，我诚挚地邀请大家关注我们和加入我们。这是我们去年在北京的一所学校，叫作“探月学院”，开的一个年会，当时所有的孩子和志愿者都在。我们是一个非常开心的团队，很高兴认识大家，谢谢！

（本文首发在 freeCodeCamp 微信公众号）