这篇文章是我推荐给大家有想法学习前端, 或者已经开始琢磨 web 前端的小伙伴们的.
之前就有很多朋友跟我说, 学习编程学习前端的时候, 总是摸不清头脑, 一大推问题需要解决, 种种书籍需要去啃, 字符, 单词都需要去记. 就感觉要费上很多时间, 居然担忧青春饭是否能吃到?
实际上, 是很少有自己做过项目, 或者没有自己做过. 凡事都是从 0 到 1 的过程, 从 1 到 100 就非常简单了
小编为各位想加入程序员大军, 加入前端的朋友们整理了三十个实战项目列表, 有非常详细的教程. 选择几个进行学习, 或者发挥自己的想象去完成自己的项目
还有属于小编收集精选的整套自学视频, 获取方式在文末
欢迎大家装载 + 分享. 给需要学习的朋友们
项目列表:
项目一: PC 端网站布局
所含知识点: html 基础, CSS 基础, CSS 核心属性, CSS 样式层叠, 继承, 盒模型, 容器, 溢出及元素类型, 浏览器兼容与宽高自适度, 定位, 锚点与透明, 图片整合, 表格, CSS 属性与滤镜
项目二: HTML5+CSS3 基础项目
所含知识点: HTML5 新增的元素与属性, 表单域增强元素, CSS3 选择器, 文字字体相关样式, CSS3 位移与变形处理, CSS3 2D 转换与过度动画, CSS3 3D 转换与关键帧动画, 弹性盒模型, 媒体查询, 响应式设计
项目三: WebApp 页面布局项目
所含知识点: 移动端页面设计规范, 移动端切图, 文字流式 / 控件弹性 / 图片等比例 / 特殊设计的 100% 布局, 等比缩放布局, viewport/meta,rem/vw 的使用, flexbox 详解, 移动 Web 特别样式处理 (reset, 1px border, 高清图片)
项目四: 原生 Java 交互功能开发项目
所含知识点: 基本语法, 循环语句, 函数与数组, String 与 Date,BOM 与 DOM, 事件, 拖拽效果, cookie 存储, 正则表达式, Ajax, 面向对象基础, 运动与游戏开发
项目五: 面向对象进阶与 ES5/ES6 应用项目
所含知识点: Promise/A+, 设计模式 (观察者模式等), 原型链, 构造函数, 执行上下文栈与执行上下文, 变量对象与活动对象, 作用域链, 闭包, this,ES5,ES6
项目六: Java 工具库自主研发项目
所含知识点: DOM 库, 事件库, Ajax 库, 原型和继承库, MVVM 核心库, 基于 SPA 的路由库
项目七: jQuery 经典交互特效开发
所含知识点: 时间轴特效, tab 页面切换效果, 网页定位导航特效, 滑动门特效, 焦点图轮播特效, 导航条菜单效果, 瀑布流特效, 弹出层效果, 倒计时效果, 抽奖效果
项目八: PHP+MySQL 后端基础项目
所含知识点: PHP,MySQL,HTTP(s) 协议详解, Ajax 进阶, 跨域与 Defered,Apache 与 Nginx 环境搭建与配置, 接口的定义, Mock 数据, Restful, 前后端联调, 前端安全 (XSS,CSRF,JSON 注入)
项目九: 前端工程化与模块化应用项目
所含知识点: Gulp,Webpack,NPM,Git/SVN,CommonJS,AMD,CMD,ES6 模块化
项目十: PC 端全栈开发项目
所含知识点: 大首页, 列表页与详情页展示与交互特效, 搜索, 登录与注册, 购物车, jQueryUI 与 jQuery EasyUI,Bootstrap(ACE),Highcharts/Echarts,ArtTemplate,Velocity,Smarty, 云平台系统前端
为了帮助大家学习前端, 让学习变得轻松, 高效! 今天给大家分享一套教学资源, 从最零基础开始的的 HTML+CSS+JavaScript.jQuery,Ajax,node,angular 框架等帮助大家在学习 Web 前端的道路上披荆斩棘
这套资源的领取方式如下:
Web 前端学习教程的小伙伴们可以添加 QQ 群: 282549184 大家可以互相学习 提升自己
来源: http://www.jianshu.com/p/41b416a9678c