自学前端简历怎么写？项目怎么学？

本篇含简历模板+项目学习+项目经验分享，送全套前端路。

一、简历模板

这里就不多说了，是什么写什么就好。

开发经验

⚫ 精通 HTML、CSS、JS 基础，熟悉 H5、CSS3 新属性，熟悉 ES6 新特性
⚫ 熟悉响应式，flex 等页面布局方式，熟练使用 less、sass
⚫ 熟练运用 Vue、React 前端开发框架，了解 ReactNative 的基本实现原理
⚫ 熟悉组件间的通信和数据的管理 , 熟练 Redux/Vuex 使用
⚫ 熟悉常见 UI 框架如：Bootstrap、Element-UI、Vant、Ant-design 等
⚫ 熟悉 Webpack 等构建工具
⚫ 熟悉微信小程序开发流程
⚫ 熟练使用 Git 等项目管理工具
⚫ 了解 NodeJS，了解 Express 框架开发

项目经历（这里可以参考写）

项目一：优联校园后台管理系统

项目描述：优联校园是一款大学生校园生活服务软件，为在校大学生提供社团活动，二手交易，学生兼职，学生租房，

驾校报名、微商城等服务，项目技术栈：React + React-router + Axios + Ant-design + React-redux

责任描述：

1. 负责应用管理模块，包括社团管理、二手交易、学生兼职、学生租房等界面，使用 Antd 中 Button , Form , Modal ,

Table 等组件来展示页面

2. 使用 React-router 来配置路由，实现组件间页面的跳转

3. 使用 Axios 来请求数据并渲染页面

4. 根据需求文档完成业务逻辑

5. 抽离公共组件并封装到项目组件库中

项目二：优联校园 APP

项目地址：https://sj.qq.com/myapp/detail.htm?apkName=io.dcloud.H5125DB64

项目描述：优联校园是一款大学生校园生活服务软件，为在校大学生提供社团活动，二手交易，学生兼职，学生租房，

驾校报名等服务，项目技术栈：React-Native + Less +Redux + Fetch + Codepush + Genimotion + AndroidStudio + XCode

责任描述：

1. 使用 create-react-native-app 创建项目
2. 使用 react-router 配置路由
3. 使用 Redux-saga 做异步请求的状态管理
4. 使用 genimotion 模拟器
5. 使用 android studio 和 xcode 打包 App

项目三：买拉购商城后台管理系统

项目描述：买拉购商城后台管理系统是为买拉勾小程序配置的后台管理系统，包括商品管理，订单管理，权限管理，

项目技术栈：UmiJS + Dva + React + ES6 + Ant Design Pro + Axios + Prop-Types + Moment

责任描述：

1. 使用 Ant Design Pro 生成完整的开发框架
2. 采用 Umi 的路由方案，通过约定式路由配置来生成菜单
3. 使用 Dva 的 effect 来管理同步化异步请求，获取服务端返回数据，调用 reducer 改变 state 更新 model
4. 使用 prop-types 检测 props 数据类型 , 根据提示快速定位类型传递错误
5. 使用 Moment 对日期格式化处理

项目四：买拉购小程序

项目描述：买拉购小程序有商品展示，会员，购物车，个人中心，支付等功能，项目技术栈 Wepy + Less + ES6

责任描述：

1. 使用 Wepy 脚手架创建项目
2. 配置 tabbar 菜单栏并完成基础页面布局
3. 封装 wepy.post 函数发起网络请求，将数据渲染到页面
4. 对项目进行优化，美化页面的 UI 显示效果，抽离业务逻辑到单独的文件中

自我介绍

多人说不要写自我评价。觉得这个版块非常没有用。我认为恰恰相反，千篇一律的自我评价，什么认真啊踏实啊确实让人反感。但是如果可以写成【敏捷开发的忠实粉丝，单元测试驱动开发的实践者，曾主动重构代码】，【看书爱好者，年度目标5本书，已完成4本，正在看《领域驱动设计》】。有没有感觉这样的自我评价，就非常有意思？

二、前端项目怎么学怎么找

2.1 项目类型

后台管理系统
移动端（webapp）
微信小程序
微信公众号

2.2 工作年限

3年工作经验的话大概有5个项目合适

2年工作经验的话有4个项目合适

2.3技术栈

Vue+vuex+vue-router+webpack+ES6+node+vue-resource+mock+art-template| (12k)

React+redux+react-router+webpack+ES6

2.4 项目查找网站

https://www.leapcloud.cn/website/case#

apicloud.com/cases

历趣应用商店 - 手机APP下载&手游排行榜

小程序|小程序社区|小程序开发社区-极乐小程序社区-www.wxapp-union.com

http://app.weijuju.com/all_tpl.html?list=03_0_0

https://adhub.com.cn/#!/case

http://www.pc6.com/pc/shoujikanche/10/

解放号数智版-伴行数字化转型的软件产业互联网

IT项目在线交易平台--米鼠网

2.5 常用插件

vue常用插件：总有你能用上的插件（vue插件总结）

react es6学习：全栈前端

前端高频面试文档学习：https://github.com/yygmind/blog

2.6 项目介绍

使用了什么技术、实现了什么功能、遇到了什么样的问题，如何解决的；

我做了 XX 项目重构，用了 XX 技术方案，克服了 XX 的困难，最终让 XX 这类需求变更可以短平快的被消化，极速

研发、快速上线、且数据采集也做到了标准化，研发成本大大降低，数据积累增长迅速，比如 XX，最后在 XX 产品线中开始推广。

具体:

xxxx后台管理系统:

1. 使用vue-cli搭建项目基本结构,对项目进行模块化划分,并集成ivew组件库、axios请求库

2. 利用axios拦截器实现了权限校验,对系统的登入权限进行控制,避免了无效请求

3. 利用vue-router路由钩子函数实现系统角色权限控制，使不同权限的角色可以查看不同的模快

4. 使用iview进行组件化开发,实现了登录、用户列表、访问统计、个人信息修改、权限配置、角色管理等页面

5. 自定义日期选择组件实现,使用自定义指令、过滤器、注册全局组件等技术实现多个组件共享日期选择器组件

xxxx移动商城

1. 负责登录、注册、商品列表、购物车、订单等模块

2. 使用rem对页面进行布局,以适应不同设备屏幕

2.7 专业技能

2.8 需要提前准备

1. 哪个项目让你最满意、代表你的最高水平？如何做的？

2. 让你印象最深刻的一个（技术）难点，害的你搞了很久，最后怎么解决的，有什么心得？

3. 你做的时间最久的一个项目（或产品），你看到这个项目有哪些问题，你能做什么？

4. 你能给我们团队或者产品带来什么？

三、前端学习全套路线图

HTML+CSS-->移动web->JavaScript基础-->Web APIs->数据交互&异步编程-->Node.js-->Vue2+Vue3-->React核心技术-->微信小程序

黑马程序员前端：2022年前端学习路线图

分享黑马学生独立完成的项目：

学员作品展示- 深圳 -38期肖同学：《光·遇》官网 - 温暖的灵魂终将相遇
学员作品展示- 深圳 -38期王同学：《阴阳师：百闻牌》手游官网_安卓测试预约_百鬼欢聚一局忘忧
学员作品展示- 广州 - 27期三组：三亚婚纱摄影_三亚拍婚纱照_首选【飘视觉】_三亚外景海景婚纱摄影_三亚婚纱店
学员作品展示 - 西安 -7期张同学：- 西安唯一视觉【官网】西安婚纱摄影|西安婚纱照|西安婚纱影楼|婚纱摄影工作室