|
| 1 | +# JavaScript30 - 30 天挑战纯 JS 中文指南 |
| 2 | + |
| 3 | +> _© 版权声明_ |
| 4 | +> 中文指南作者：[缉熙Soyaine](https://github.com/soyaine)，学生 |
| 5 | +> JavaScript30 教程作者：[Wes Bos](https://github.com/wesbos) |
| 6 | +> JavaScript30 挑战官网：[JavaScript30](https://javascript30.com) |
| 7 | +> 指南发布平台：[GitHub](https://github.com/soyaine/JavaScript30)、[简书](http://www.jianshu.com/notebooks/8509835/latest)、[Blog]() |
| 8 | +
|
| 9 | +## 灵感区 |
| 10 | + |
| 11 | +[Git 使用的相关教程](https://github.com/OpenMindClub/pythoncamp0/wiki/%5BGithub-Gitbook%5D) |
| 12 | +[ GitHub 漫游指南](http://github.phodal.com/) |
| 13 | + |
| 14 | +## 简介 |
| 15 | + |
| 16 | +This is my note when I practice the JavaScript30. |
| 17 | + |
| 18 | +想法来源是 [Nitish Dayal 写的教程](https://github.com/nitishdayal/JavaScript30/tree/master/exercises)。因为看了他的教程，我在深信「Learn by Use」的同时也相信，教是最好的学。所以我决定在练习的过程中写一份指南，希望能够帮助到想要进行练习的人们。 |
| 19 | + |
| 20 | +## 如何使用 |
| 21 | +目前还在更新之中，点击下方目录中的链接即可跳转到练习对应的指南。 |
| 22 | + |
| 23 | +如果阅读过程中，发现问题请[在这里提 issue]()。如果喜欢记得 Star 哟~♪(^∇^*) |
| 24 | + |
| 25 | +[在线 GitBook]() |
| 26 | +[GitHub 源码]() |
| 27 | + |
| 28 | +Wes Bos 提供了一份教程，该如何使用他的资料呢？ |
| 29 | + |
| 30 | +- [JavaScript30 官网](https://javascript30.com)：进入官网注册后可以观看和下载所有教程视频。 |
| 31 | +- [Nitish Dayal 写的英文指南](https://github.com/nitishdayal/JavaScript30/tree/master/exercises)：这是一份非官方的文字版指南，也是激励我写这一系列文章的主要因素。 |
| 32 | +- [挑战初始文档](https://github.com/wesbos/JavaScript30)：这是 Web Bos 这份教程涉及的代码，共有 30 个文件夹，每个文件夹中至少有两个文件。 |
| 33 | + - **index-START.html**：是提供给我们的初始文档，为了便于我们专注于 JavaScript 的编写，这个文档已经将基础的 HTML 和 CSS 部分写好，我们只需要在这个基础上编写 JavaScript 代码，实现特定的功能即可。 |
| 34 | + - **index-FINISHED.html**：已经实现了最终效果的文档，可以查看效果和实现思路。 |
| 35 | + |
| 36 | +Wes Bos |
| 37 | + |
| 38 | +## Plan |
| 39 | + |
| 40 | +people different way |
| 41 | +1. watch material and try to build the thing 先看完 |
| 42 | +2. puzzle it |
| 43 | +3. build at the same time as we are going to the video |
| 44 | + |
| 45 | +figure out what way you learn best |
| 46 | + |
| 47 | +## |
| 48 | + |
| 49 | +## 目录 |
| 50 | + |
| 51 | +1. [ ] JavaScript Drum Kit |
| 52 | +2. [ ] JS + CSS Clock |
| 53 | +3. [ ] CSS Variables |
| 54 | +4. [ ] Array Cardio, Day 1 |
| 55 | +5. [ ] Flex Panel Gallery |
| 56 | +6. [ ] Type Ahead |
| 57 | +7. [ ] Array Cardio, Day 2 |
| 58 | +8. [ ] Fun with HTML5 Canvas |
| 59 | +9. [ ] Dev Tools Domination |
| 60 | +10. [ ] Hold Shift and Check Checkboxes |
| 61 | +11. [ ] Custom Video Player |
| 62 | +12. [ ] Key Sequence Detection |
| 63 | +13. [ ] Slide in on Scroll |
| 64 | +14. [ ] JavaScript References vs. Copying |
| 65 | +15. [ ] LocalStorage |
| 66 | +16. [ ] Mouse Move Shadow |
| 67 | +17. [ ] Sort Without Articles |
| 68 | +18. [ ] Adding Up Times with Reduce |
| 69 | +19. [ ] Webcam Fun |
| 70 | +20. [ ] Speech Detection |
| 71 | +21. [ ] Geolocation |
| 72 | +22. [ ] Follow Along Link Highlighter |
| 73 | +23. [ ] Speech Synthesis |
| 74 | +24. [ ] Sticky Nav |
| 75 | +25. [ ] Event Capture, Propagation, Bubbling, and Once |
| 76 | +26. [ ] Stripe Follow Along Nav |
| 77 | +27. [ ] Click and Drag |
| 78 | +28. [ ] Video Speed Controller |
| 79 | +29. [ ] Countdown Timer |
| 80 | +30. [ ] Whack A Mole |
0 commit comments