【入职第一天】想必各位小伙伴已经找到工作了，那么入职第一天我们应该做些什么呢？

庸俗今天不摸鱼
279 阅读5分钟

前言

作为前端cv工程师，当你入职一家公司，拿到新发的电脑，你会对电脑干点啥呢？装软件？你是疯狂的地到处找之前电脑备份的东西？又或者是想不起来有什么上一台电脑好用的软件叫什么名？找不到要用的软件和库地址？仿佛戴上了痛苦面具

一、开发环境

1. git/svn

版本控制首选，git下载、svn下载(svn代替git即可命令大差不差)

 git config --global user.name "你的昵称"

 git config --global user.email "你的邮箱"

2. node（nvm）

作为前端，必备的一个环境，不用多解释了，node官网、node github地址、node中文地址 。 nvm是node的多版本管理器，如有需要在多版本node之间切换可使用nvm，安装教程

npm 是一个网站 npmjs.org

npm 是包的管理工具

  1. 创建 package.json 文件 创建一个空的文件夹之后打开终端输入以下命令生成 package.json

    • npm init 逐个问你是否按照什么的方式生成
    • npm init -y 一键生成 包的名称不能是中文

  2. 修改 npm 的镜像

  3. 下载开发依赖包

    • npm install webpack -save-dev 简写 npm i webpack -D

  4. 下载生产依赖包

    • npm install axios --save 简写 npm i axios -S

  5. 删除依赖包 - npm remove sb -S || npm uninstall sb -S

    直接删除所有的依赖包：直接删除 node_modules 即可，但是直接删除可能比较卡，可以安装 rimraf -->

    • npm i rimraf -g rimraf NODE_MODULES

  6. 根据 package.json 文件安装依赖包

    • npm install || i

  7. 全局安装工具，只需要安装一次终生使用

    • npm i 包的名称 -g
    • npm i -g 包的名称
    • npm i rimraf -g

  8. 使用 yarn 管理依赖

  9. 安装 yarn - npm i yarn -g - yarn --version

  10. 创建 package.json 文件

    • yarn init
    • yarn init -y 包的名称不能是中文

  11. 修改 yarn 的镜像

    •  yarn config set registry https://registry.npm.taobao.org

    • yarn config get registry

  12. 下载开发依赖包 - yarn add 包名称 -D

    • yarn add webpack -D

  13. 下载生产依赖包

    • yarn add swiper -S

  14. 删除依赖包 - yarn remove swiper -S 直接删除所有的依赖包：直接删除 node_modules 即可，但是直接删除可能比较卡，可以安装 rimraf -->

    • npm i rimraf -g rimraf NODE_MODULES

  15. 根据 package.json 文件安装所有的依赖包

    • yarn

  16. 全局安装工具，只需要安装一次终生使用

    • yarn add 包的名称 -g
    • yarn add -g 包的名称
    • yarn add rimraf -g

  17. 包管理器 视自身需求选择 cnpm、pnpm、yarn

  18. vscode/webstorm/HBuilder 前端用的最多的两款编辑器就是vscode/webstorm，webstorm收费，我平时用vscode比较多，这里就不多介绍webstorm了，下载地址也留下，webstorm下载。 HBuilder下载地址 主要还是记录vscode的内容：

  19. 安装 vscode下载地址 下载过程中如果遇到下载较慢可以通过两种方式解决。 一是梯子 二是替换下载镜像链接，在vscode官网上找到对应要下载的版本，点击下载的时候会有一个下载链接 如：

可以将红框中的下载链接替换成国内的镜像 替换后的链接 ： vscode.cdn.azure.cn/stable/f804…

vscode好用的插件系列

  • git相关插件：gitLens、Git History、Git History Diff、Git Graph
  • 汉化插件： Chinese (Simplified)
  • 开发提示相关插件： Tabnine AI（强推）、Path Intellisense（路径提示）、Vetur、Volar、Auto Close Tag、Auto Complete Tag、Auto Rename Tag、HTML Snippets、Wrap Console Log Lite
  • 浏览器调试插件： JavaScript Debugger、Debug Visualizer、scode-js-debug
  • 静态服务器：Live Server
  • 代码运行器： Code Runner
  • 正则提示插件： any-rule、Regex Previewer（辅助验证正则结果）
  • Docker插件： Docker
  • 格式化类插件： EditorConfig for VS Code、ESLint
  • 进制文件查看： Hex Editor
  • TODO提示： Todo Tree
  • 流程图绘制： drawio
  • PDF查看： vscode-pdf
  • Markdown预览：Markdown Preview Enhanced
  • SVG文件预览：SVG Viewer
  • 图片预览（在html或者css写地址的时候可直接预览）：Image Preview 文件依赖分析（如：.vue文件可以通过该插件看到引用了哪些依赖）：Dependency Cruiser Extension
  • 颜色选择、设置：Color Highlight、Color Picker
  • 快速生成注释：vscode-fileheader 和 koroFileHeader 
  • npm模块导入智能提示： npm Intellisense
  • 接口请求：REST Client
  1. docker（选用） docker可以帮助前端快速获取一些偶尔使用的环境（偶尔使用的环境，又不想在电脑上安装一大堆），如：nginx、mysql、redis等之类的，之前发过一篇简单的使用，可以参考一下，地址
  2. 梯子 科学上网，不用解释

二、 常用网站

  1. MDN
  2. GitHub
  3. swiper 轮播图
  4. 草料二维码生成
  5. css动画
  6. vsCode 生成代码片段
  7. 思否论坛
  8. 表情符号
  9. ai生成代码
  10. 高清图片
  11. 插图

三、 常用软件

  1. Vscode
  2. webstorm
  3. telerik 抓包软件
  4. APIFox接口调试
  5. snipaste截图软件
  6. 向日葵 远程控屏 求救和居家必备利器！！

四、梳理总结积累 - 新环境熟悉

除了一些软件、网站的分享，入职一家新公司，需要快速去熟悉什么，也来叨叨几句，去到一个新的环境，要熟悉的内容，做好笔记，总结经验，下面是仅是我个人的一些小见解，合则取

  1. 熟悉 人 熟悉自己所处的团队，人际关系处好，熟悉团队的习性、技术栈、技术水平，不管是当技术管理还是技术开发，都要知道自己所处团队，能给团队带来什么？能从团队里获得什么？
  2. 熟悉 目标 公司的目标是什么？ 部门的目标是什么？ 团队的目标是什么？ 自己的目标是什么？
  3. 熟悉 流程 行政、人事、产研测流程等，熟悉各种流程，能让自己工作节省不少时间，特别产研测流程，只有熟悉流程才能够去分析是否合理，和过往比较是否能够给团队提出建议，或者好的流程也能让自己吸收作为经验

5、idea激活码 （其他激活码）

www.ajihuo.com/

avatar
文章
阅读
粉丝