我是傲夫靠斯，欢迎关注个人公众号【前端工程师的自我修养】，天天更新。前端
不少面临毕业的学生想入行前端，但苦于缺乏项目经验，不知道作个什么项目可以达到公司的用人要求。也有不少前端的初学者，不知道作什么项目能找到工做。还有就是刚刚工做几年的前端工程师，可能在公司作的东西天天就是重复的画页面，能力提高缓慢，可能在跳槽时没有亮眼的项目经历，没法找到满意的工做。vue
我今天整理了7个项目给你们做为推荐。react
为何推荐这7个项目呢？由于它们包含了咱们所能接触到的所有基础功能，像身份认证、API接口、数据库操做、React/Vue路由切换页面、音乐或者视频播放等等。程序员
另外这7个项目之间还有相互的融合包含，你中有我，我中有你。像社交应用、电商应用、视频应用中也会有实时聊天应用。web
在选用技术框架时，能够挑选本身擅长框架来开发，我选的是Vue/React技术栈，后台使用Node Express框架。数据库使用Postgres、MongoDB。面试
这里推荐你们去深刻完成其中的1～2个你感兴趣的就能够了，没必要去花时间所有完成，由于面试官更须要的是项目深度，而不是项目的广度。vue-cli
1. 实时聊天应用
咱们天天都会用到聊天软件：像微信、QQ、抖音、淘宝等，这些软件有的主要功能是聊天，有的是做为辅助功能。但如今大多数的软件中都会有聊天的功能。数据库
聊天软件的主要功能就是能够实时的给用户发送消息并能够实时的回复，在用户离线时也能够查看聊天的记录。微信
若是构建实时聊天应用？
- 首先使用
create-react-app或者vue-cli来建立项目 - 使用现有的Sass服务商，例如极光IM、腾讯IM、网易云信，它们都有无偿使用的额度。
- 使用socket.io框架自行搭建聊天服务
- 使用Node.js自行搭建websocket服务
这里我推荐你们按顺序从上到下，先从现成的IM服务接入开始，熟悉他们的API设计方式，而后自行搭建时能够参考。websocket
2. 社交媒体应用
社交媒体软件咱们经常使用的像：微信、微博、小红书。
这和聊天软件其实很类似，在社交媒体软件上，用户们能够相互关注，浏览对方的帖子/图片/视频，并能够进行点赞、评论等操做。
如何构建社交媒体应用？
- 使用
create-react-app或者vue-cli来建立项目，使用Node API来构建后台服务 - 使用Postgres或者MongoDB数据库，使用像Prisma（Postgres）或者Mongoose (MongoDB)这样的ORM框架
- 使用微信、微博等实现第三方登录功能
- 将Node API和前端应用部署阿里云、腾讯云等
3. 电商应用
咱们经常使用的有：淘宝、京东、拼多多等
电商软件可让咱们不用走出家门就能买到东西，咱们能够在购物车中加入商品、删除商品，以及使用微信、支付宝、银行卡进行结帐。
如何构建电商应用？
- 使用
create-react-app或者vue-cli来建立项目，使用Node API来构建后台服务 - 使用Postgres或者MongoDB数据库，使用像Prisma（Postgres）或者Mongoose (MongoDB)这样的ORM框架
- 使用支付宝、微信接入支付功能
- 将Node API和前端应用部署阿里云、腾讯云等
若是你们接入支付功能不方便，可使用stripe NPM包，使用Stripe可使用测试环境进行建立订单，处理支付。
4.视频应用
咱们经常使用的：B站、抖音、优酷、爱奇艺等等
视频应用通常基本的功能有视频上传、视频浏览、点赞、评论、搜索视频等。
如何构建视频应用？
- 使用
create-react-app或者vue-cli来建立项目，使用Node/Express来构建后台服务 - 使用阿里云OSS/VOD，腾讯云COS/VOD来存储视频
- 使用Postgres或者MongoDB数据库，使用像Prisma（Postgres）或者Mongoose (MongoDB)这样的ORM框架
- 将后台应用和前端应用部署阿里云、腾讯云等
5. 博客应用
咱们经常使用的：老的博客像新浪博客、QQ空间、CSDN、博客园，如今比较新的像掘金社区、简书等。
博客通常所具备的功能就是用来展现本身的，咱们能够博客上发表帖子内容。
如何构建博客应用？
- 使用React的
Gatsby、Next.js，Vue的Nuxt.js来建立项目 - 使用一些markdown转换插件来处理markdown，好比
remark等等 - 将应用部署阿里云、腾讯云等
6.论坛应用
咱们经常使用的像：百度贴吧、天涯论坛、v2ex、StackOverflow等
咱们程序员会常常去v2ex、StackOverflow去讨论一些技术问题，或者发帖来请教，等待其余人进行回帖解答。
如何构建论坛应用？
- 使用
create-react-app或者vue-cli来建立项目，使用Node/Express来构建后台服务 - 使用Postgres或者MongoDB数据库，使用像Prisma（Postgres）或者Mongoose (MongoDB)这样的ORM框架
- 使用微信、微博等实现第三方登录功能
- 将Node API和前端应用部署阿里云、腾讯云等
7. 音乐应用
咱们经常使用的有：网易云音乐、QQ音乐、网易云音乐。
咱们能够经过音乐软件进行听音乐，上传音乐，评论，建立歌单等等。
如何构建音乐应用？
- 使用
create-react-app或者vue-cli来建立项目，使用Node/Express来构建后台服务 - 使用阿里云OSS/VOD，腾讯云COS/VOD来存储音频
- 使用Postgres或者MongoDB数据库，使用像Prisma（Postgres）或者Mongoose (MongoDB)这样的ORM框架
- 将后台应用和前端应用部署阿里云、腾讯云等
唠叨
若是本文对你能起到做用，您的点赞、评论、关注是对我最大的鼓励 O(∩_∩)O👍👍👍
我是傲夫靠斯，微信搜【前端工程师的自我修养】，让咱们天天进步一点点，期待更好的本身。