前端小白阶段的项目都是在哪里找的~?

收藏的干货都拿出来啦

• Free Code Camp - http://www.freecodecamp.com/
  
• 目前有9个zipline项目都是纯前端，还有好多教学。
• 百度前端学院 - https://github.com/baidu-ife/ife
  
• 现在正进行中。 找不到组就自己做吧，都没那么难的。
• http://thecodeplayer.com/
  
• 和上面两个不太一样，是实时代码，观察实时变化，推荐~

最终目的是学习，不要所有项目都只用一种技术，这次用了angular，感觉熟悉了很多，下个就用React等等。

2018年更新

前言

现在前端发展日新月异，前端工程化、模块化、组件化等模式和思想也愈来愈成熟，基本上只会写页面已经不足以找到一份实习了。我觉得初学前端的同学需要重视JS基础，别太依赖jQuery、Vue等类库或框架，用原生JS实现一些Demo练练手。当然，最后还是需要熟悉使用一个框架的，推荐在Vue和React中选择。

在学习前端基础的同时，可以多逛逛很多优秀的技术社区，比如掘金或者SegmentFault来拓宽技术视野，对于激励自己以后的学习和发展也很有帮助。

练手项目

项目的话，必须推荐百度的IFE前端技术学院啊，组队线上刷项目push到GitHub，然后相互review评分，同一个功能需求代码的实现方式可能会有很多，可以多看看其他团队的代码实现并取其精华。

还有FreeCodeCamp社区(全球的非盈利编程学习社区，线上刷题线下面基)，成都FCC线下沙龙做的挺不错。下面是咱面基的照片。

FCC线上也会有很多阶段性的项目可以练手

上来就推荐新手看红宝书或犀牛书这样真的不太好，视频学习更易于理解，学习曲线更平滑，如果想深入学习就可以去看书了。

视频的话，国外有Treehouse、Youtube，国内我会看慕课网

最近慕课网也推出了付费实战课程，我买过一期HTML5阅读器的实战，一些基础的东西可能要自己看书看文档，但是一些开发思路和解决问题的方案还是需要有人带，老师算是大牛，有很丰富的项目开发经验，现在课程更新使用Vue重构，还长了一倍的价格，哈哈，我觉得挺值。

我的项目

当自己看了基础写过Demo、跟着大牛走了几遍项目（或者Github上看过一些源码），基本上就能开始想想自己可以把之前学的东西整合起来做个什么项目了。

我是从用jQuery做Todo应用开始的，然后就是写了一些小插件（原生JS插件、jQuery/Zepto插件）；在FCC上补基础，做了些比较入门的JS算法题；搭建个人博客的时候，把WordPress换成了Jekyll，苦于没有满意的主题模板，就干脆自己撸了一套博客主题；学习Vue，做了个购物车项目；沉迷王者农药无法自拔，在微信上线了王者图鉴小程序...

学习资源

最后，分享下我自己觉得不错的学习资源吧：

• 按着慕课网的Web前端工程师路径走一遍
• 搭配入门书籍《DOM编程艺术》和Mozilla 开发者网络文档，要重视基础的学习！
• 可以开始尝试着写静态网页了，同时需要理解HTML语义化和学习CSS布局、BFC等知识。写页面可能会接触到各种奇技淫巧，知识点也会比较凌乱，建议多写笔记和看W3C文档查缺补漏，这是个慢慢积累的过程。
• 上CodePen看看各种炫酷的demo，有喜欢的就Fork吧，学习别人的代码是如何写的，自己模仿着来。而且使用codepen在线coding炒鸡方便！
• 学习使用Git，并成为全球最大同性交友网站的一员~
• 参加百度前端技术学院或者FCC，动手做做上面的小项目，顺带让Github一片绿
• 有了一点学习前端的经验后，尝试像我一样搭建一个独立博客吧~ 不懂后台服务器数据库？没关系，用Jekyll或者Hexo这类静态博客框架吧，再自己写一套主题也算个人小项目了！
• 有空逛逛掘金、SegmentFault等技术社区，拓宽视野
• 代码量上来了就可以深入编码规范了
• 英语好的同学可以去Codecademy、StackOverflow
• 跟上前端开发的最新前沿
• 保持不断进取和敬畏技术的心

我收藏的工具类资源：

• Iconfont-阿里巴巴矢量图标库 很不错的图标资源站，新版已经上线快支持一下！
• Color Hunt & ColorDrop 配色站，萌萌的
• Regexper 正则表达式 可视化，学正则的利器
• BootCDN 国内免费的CDN

希望对同在学习前端的你有所帮助。