没项目经验,这7个前端项目让你脱颖而出

很多面临毕业的学生想入行前端,但苦于缺少项目经验,不知道做个什么项目能够达到公司的用人要求。也有很多前端的初学者,不知道做什么项目能找到工作。还有就是刚刚工作几年的前端工程师,可能在公司做的东西每天就是重复的画页面,能力提升缓慢,可能在跳槽时没有亮眼的项目经历,无法找到满意的工作。

我今天整理了7个项目给大家作为推荐。

为什么推荐这7个项目呢?因为它们包含了我们所能接触到的全部基础功能,像身份认证、API接口、数据库操作、React/Vue路由切换页面、音乐或者视频播放等等。

另外这7个项目之间还有相互的融合包含,你中有我,我中有你。像社交应用、电商应用、视频应用中也会有实时聊天应用。

在选用技术框架时,可以挑选自己擅长框架来开发,我选的是Vue/React技术栈,后台使用Node Express框架。数据库使用Postgres、MongoDB。

这里推荐大家去深入完成其中的1~2个你感兴趣的就可以了,不必去花时间全部完成,因为面试官更需要的是项目深度,而不是项目的广度。

1. 实时聊天应用

聊天软件的主要功能就是可以实时的给用户发送消息并可以实时的回复,在用户离线时也可以查看聊天的记录。

如果构建实时聊天应用?

    首先使用create-react-app或者vue-cli来创建项目 使用现有的Sass服务商,例如极光IM、腾讯IM、网易云信,它们都有免费使用的额度。 使用socket.io框架自行搭建聊天服务 使用Node.js自行搭建websocket服务

这里我推荐大家按顺序从上到下,先从现成的IM服务接入开始,熟悉他们的API设计方式,然后自行搭建时可以参考。

2. 社交媒体应用

如何构建社交媒体应用?

3. 电商应用

我们常用的有:淘宝、京东、拼多多等

如何构建电商应用?

如果大家接入支付功能不方便,可以使用stripe NPM包,使用Stripe可以使用测试环境进行创建订单,处理支付。

4.视频应用

我们常用的:B站、抖音、优酷、爱奇艺等等

如何构建视频应用?

    使用create-react-app或者vue-cli来创建项目,使用Node/Express来构建后台服务 使用阿里云OSS/VOD,腾讯云COS/VOD来存储视频 使用Postgres或者MongoDB数据库,使用像Prisma(Postgres)或者Mongoose (MongoDB)这样的ORM框架 将后台应用和前端应用部署阿里云、腾讯云等

5. 博客应用

博客一般所具有的功能就是用来展示自己的,我们可以博客上发表帖子内容。

如何构建博客应用?

    使用React的Gatsby、Next.js,Vue的Nuxt.js来创建项目 使用一些markdown转换插件来处理markdown,比如remark等等 将应用部署阿里云、腾讯云等

6.论坛应用

我们常用的像:百度贴吧、天涯论坛、v2ex、StackOverflow等

我们程序员会经常去v2ex、StackOverflow去讨论一些技术问题,或者发帖来请教,等待其他人进行回帖解答。

如何构建论坛应用?

7. 音乐应用

我们可以通过音乐软件进行听音乐,上传音乐,评论,创建歌单等等。

如何构建音乐应用?

    使用create-react-app或者vue-cli来创建项目,使用Node/Express来构建后台服务 使用阿里云OSS/VOD,腾讯云COS/VOD来存储音频 使用Postgres或者MongoDB数据库,使用像Prisma(Postgres)或者Mongoose (MongoDB)这样的ORM框架 将后台应用和前端应用部署阿里云、腾讯云等

唠叨

经验分享 程序员 微信小程序 职场和发展