聊聊干入职前端电脑都有什么秘密

聊聊干入职前端电脑都有什么秘密

前言

​ 对于热爱于前端的人来说，入职岗位后拿到电脑就会想着着手于做准备工作，需要安装什么，搭建什么环境，安装什么软件，还是在寻找自己备份的资料地址吗？还是记不起某些自己经常使用却忘记的软件？

​ 这篇文章来聊聊关于一开始的准备工作，方便自己方便他人，快速找到很不错，合适的软件、环境，分享一下万金油的开发环境、软件、网站

关于开发软件

​ 关于使用什么软件开发项目，如果是网站的话，推荐使用vscode，当然目前还有webstorm，惭愧，虽然我不用，冲着万金油方面，这里不过多介绍

• vscode

下载的过程中可能会出现很慢的情况，推荐使用镜像下载，下载地址

下载解压安装即可，顺便分享一下自己目前使用的插件：

Live Server:可以实时预览修改的代码，需要注意的是需要打开文件夹，不然会提示报错不能实时预览
any-rule：里面包含常见的正则规则
background：社会拒绝一个看你写代码的鼓励师，需要配置
CSS Tree：配合less等编译器神器
Easy LESS：less编辑
Image preview：可以预览自己插入的图片
Markdown All in One：预览一些Markdown文档，当然可以有很不错的Typora来代替
Prettier - Code formatter：格式化神器
px to rem & rpx & vw (cssrem)：转换格式，当然，这个有很不错的npm包来处理一些单位转换，比如postcss-plugin-px2rem
-- 最后还有一些组件库的h5标签很多就不过多推荐了，比如element UI和vue、react的一些组件标签就不过多推荐了

• HBuilder

​ 开发小程序以及一些h5的页面开发，目前市场主流应该是HBuilder，当然，还有着一些flutter，或者使用taro来开发小程序，这里也不过多介绍

• 微信开发者工具

  用于开发原生的微信小程序或者开发公众号h5项目，搭配HBuilder预览使用

关于辅助软件

谈完了主要的开发软件，来聊聊前端开发的时候的辅助软件，可能有些不怎么沾边就当是推荐电脑软件了

• Microsoft Edge

好马配好鞍，目前我觉得最好的浏览器

• Apipost

• Postman

• Apifox

这三软件用于接口测试，当然，本人喜欢第一个，但是基本上在项目开发的时候可以通过查看控制台来了解接口是否可行，就当是辅助

• Xmind

非常不错的思维导图软件，方便梳理结构

• Bandizip

压缩软件，个人常用

关于仓库软件

• git

关于版本控制首选，嘎嘎猛

• svn

这个本人没有用过，也是和git同名的版本控制软件

• Sourcetree

可视化git操作，虽然我使用过，但还是喜欢小黑窗敲命令行或者使用vscode上传，还是可以推荐一下不喜欢敲命令行的

关于后台软件

• node

前端开发少不了node，了解node环境也是很必要的，安装各个版本node地址：传送门

谈及到了node，少不了一些包：

cnpm、pnpm、yarn、nodemon

• nvm

​ 这里单独说一些nvm，在公司开发，当我们输入npm install等一系列安装包的操作，可能会出现，本人与开发者使用不同的node，这样就会导致有些包安装的时候报错，这时候就需要去切换自己的node版本，关于nvm的安装使用，参考：传送门

关于nvm有什么不了解的可以联系本人

关于网站推荐

• iconfont-阿里巴巴矢量图标库

目前最好的图标库

• w3school

这里收录了很多前端的知识，如果不想去MDN 里面查的话，这个还是很方便的

• ColorSpace

关于一些不错的组合色，渐变色推荐网站

• CodePen

在线编码的神器，看到一些不错的效果不想打开编辑器，可以使用这个在线编辑

• BootCDN

稳定、快速、免费的前端开源项目 CDN 加速服务

• echarts社区

关于Echarts的图表可视化案例，多用于参考

• Autoprefixer

css添加前缀处理兼容，这个多用于测试，在一些脚手架会使用webpack来处理兼容

---

结尾

很抱歉，还是有很多很多不错的网站，开发软件未能在上面展示，也希望可以在评论里面分享一下，自己的网站软件，最后提一句，你们干编程的，电脑每天关不关机！！！