一、为什么要选择前端
大学主要学的是c#
、.NET开发
… ,每次上课的时候都感觉听懂了,但过两天几乎都忘了,每次期末做项目的时候,自己几乎是在Ctrl c Ctrl v ,就感觉自己始终是云里雾里的。
大二的时候有了专门的web前端课程,而且知道了以后就业可以选择后端、也可以选择前端。被一些网页特效所吸引,慢慢地对前端有了兴趣,自己下来也会主动去学习、去反复的敲代码。那时就决定自己以后是做前端了,所以在后面的时候跟后端相关的课程,就只有在上课听听。
二、多次想放弃做前端
记得实习的第一天进公司,经理问我:“了解Less、Sass、Vue、React、Node、Npm、Babel、Webpack、Gulp、Grunt、ES6、Git、MarkDown …”。说了很多当时我从没听过的东西,那时的我只知道 HTML、CSS、JS/JQuery,甚至连 Ajax 都不太会用。经理说完之后,就要让用MarkDown写一篇关于刚说的东西是什么,做什么的文档给他。经理说完,就知道自己还有很多的东西需要学习,自己下来就先在网上学习了下MarkDown,现在写博客文章也一直用的MarkDown。
给了一个星期适应,然后经理就要求用vue做商城的后台管理系统、自己就在网上自学Vue,特别是刚接触用vue-cli构建项目的时候,用命令行构建vue项目、也不懂webpack、ES6这些、运行项目时还常常报错,简直要崩溃,每天都怀疑自己适不适合做前端。
可能是因为一个会vue同事离职了,所以那管理系统项目没做完,就让我先用bootstrap写个响应式商城页面了,终于让用熟悉的模式做网页了,信心又慢慢地回来了。 但是在做完商城页面后,经理又让用react写商城后台的管理系统项目。那时感觉 React 比 Vue 更让人崩溃。实习结束了,我也没完全搞明白Vue 和 React ,只知道怎样构建项目,会简单写写页面。
实习时感觉自己“被要求”学的东西还挺多的,vue、react、node、nw.js 等等,虽然那时学起来感觉始终是云里雾里的,但自己的自学能力还是有了更大的提升,所以在这儿也要感谢之前的公司和经理!
毕业后,从青岛回来,找工作去面试的时候,面试官都会问会不会微信小程序、vue、react 这三个中的一个。我那时就在想自己太多东西不懂了,可能不适合做前端,也想放弃找前端的工作了,然后就去面试了几家销售相关的工作。经过自己的思想斗争,就觉得自己学了几年的前端技术,说放弃还是有点遗憾的,有点不甘,所以就在家花了一个星期的时间在慕课网上买了一套微信小程序的课程来学习,因为感觉小程序和vue还是很相像的,看视频和翻阅它文档,很快就上手了。静下心学了一个星期的小程序后,又去面试了一家招前端开发的,也终于面试上了。
三、为什么做这个博客网站
实习时有个同事,她有自己的博客网站,当时就想搞一个自己的个人博客,然后问了她的博客是怎么做的后,自己也去百度云买了个虚拟空间、看了下WordPress官网,经过几天摸索和百度,终于把自己博客网站做好了。因为WordPress是用的PHP写的,我那时只知道一点node相关的技术,所以我用WordPress搭建出来的博客网站,只是在上面写写文章,就想着在CSDN这样的网站上面写文章,感觉被搜索出来的几率更大得多,所以后面虚拟空间到期后,自己也没再续费了。
毕业后工作一年多的时间,自己的前端技术也有了更大的提升。之前也只是做自己前端部分的工作,但自己一直想自己独立完成一个项目,而且自己能独立完成一个项目,后面跟后端人员交流、配合的时候,也会更顺一些。
做个人博客网站就是最好的选择,自己先在腾讯文档(可随时在网上编辑)里做表,然后逻辑业务搞清楚了,再开始做这博客网站。
四、关于此博客
做这个博客网站的时候,也遇到了一些问题,但经过百度一般也都能解决。技术上遇到问题,花些时间都差不多能解决,但是自己在想着怎样设计自己的博客页面的时候,就会时不时的卡壳,也借鉴了很多人的博客网站的样式,终于磕磕碰碰的把自己的博客网站给做出来了。
下面我就简单的介绍下自己博客网站,所用到的一些技术:
1、后端及接口
使用的 Node
MongoDB
开发。用了 express
框架和 mongoose
对象模型库,crypto
、passport
、passport-jwt
、jsonwebtoken
的模块做注册和登录验证,multer
的模块做文件(图片、音乐)上传,fs
模块读取上传的文件和错误日记的输出,nodemailer
模块做的邮件的发送。
2、后台管理系统
vue-cli
4.x构建的项目、用了 element-ui
前端UI框架, axios
请求接口数据,mavon-editor
的vue编辑器写文章。
关于后台博客管理系统部分截图
3、博客前端页面
用的也是 vue-cli
4.x构建的项目,但没有用UI框架,只是把bootstrap的栅格系统的css代码给copy过来了,博客左下角的猫是在一个 大神的github 上面copy下来的。