新人前端开发流程&常用软件&git常用指令

最咸的那条咸鱼
175 阅读5分钟

前言

入行有一些时间了, 记得刚入职时遇到了一些问题: 比如项目跑不起来, 很多网站没有权限，项目背景不了解, 需求不理解, 不熟悉开发流程等等; 还有一些算不上问题的问题, 本人社恐的原因👀, 这些就成了问题: 比如食堂在哪, 工卡怎么用, 班车怎么坐等; 今天就记录一下关于开发流程以及常用git指令的问题, 也希望能帮到大家;

准备工作

  1. 安装电脑: 当时我的表情是这样的😲还好不是从机箱内部装起, 不然又要花费好多时间了, 就是开箱开箱, 插线再插线;
  2. 看文档:🤯 包括各个项目地址, 各个系统业务流程, 环境搭建, 开发规范, 发布规范, 安全协议等等等, 听着挺全的, 为什么我还有那么多问题呢: 文档太多了, 分不清主次; 文档更新不及时，无法跟着一步一步做; 专有名词太多不知道什么意思, 没有解释, 也不好每一个词都问一遍;
  3. 安装软件: 企业微信, 办公软件office, 浏览器 chrome, 调试工具 Vue.js devtools,开发工具 vscode, 版本管理工具 git, 运行环境 node, 数据库可视化工具 navicat ...

好用的软件和插件:

  • 截图-钉图工具 Snipaste sp.png

  • 浏览器插件 FeHelper (JSON美化, 时间戳转换, 图片转Base64等等功能) fe h.png

  • web调试代理工具 whistle
    whistle.png

vscode插件

  • git分支和历史记录 GitLens, GitHistory Snipaste_2022-11-26_23-48-10.png

  • 中文插件 Chinese 中文.png

  • 文件夹图标 vscode-icons icon.png

  • 标签自动闭合 Auto Rename Tag

    代码闭合.png

  • 代码风格检查 ESLint

    es lint.png

  • vue2

    vue2.png

  • vue3

    **v3.png

开发流程

  1. 根据文档上git地址把项目拉取到本地, 熟悉项目中文件的结构, 项目所用到的具体技术, 比如组件库用的什么版本, 用了哪些包, api的封装, 还有工具封装了哪些;

  2. 需求开发: 一些小的需求(比如改个文案或者增加个小功能)是产品给到组长,也就是前端负责人审核，审核通过后指派具体组员去开发;
    大些的需求: 看对现有项目的影响, 逻辑改动, 代码改动范围及数量, 由产品,前端,后端,一起开会决定的,评审需求是否可行, 接口的具体制定, 开发周期预估... 然后排期
    产品 -> ui -> 前后端 -> 测试 -> 灰度发布 -> 正式发布

  3. git：分支名称一般用这两个格式： ① feat/需求信息 例：feat/imageUploading 就是图片上传功能的意思; ② fix/bug信息 例：fix/imageUploading 修复了图片上传的bug；

    首先在master主分支下 执行git checkout -b 分支名 创建并切换到这个分支，然后开发完成执行git add .暂存所有更改，再执行git commit -m "记录本次提交的信息" 提交到分支生成commit记录,再执行git checkout dev切换到dev测试环境，再执行git merge 分支名把刚才写好的功能分支合并到dev中，再执行git push 推送到线上进行测试；

git 指令

Ø  配置用户名：git config --global user.name "用户名"

Ø  配置邮箱：git config --global user.email "邮箱"

Ø  克隆项目：git clone 地址

Ø  创建并切换分支：git checkout -b 分支名

Ø  查看分支：git branch

Ø  添加修改的文件到暂存区：git add 文件名

Ø  查看暂存区状态：git status

Ø  提交代码到本地仓库：git commit -m "描述信息"

Ø  查看历史记录：git log

Ø  退出git log 等状态： q

Ø  查看所有历史记录：git reflog

Ø  拉取远程仓库最新代码： git pull origin 分支名

Ø  合并分支： git merge 分支名

Ø 推送最新代码到远程仓库： git push origin  分支名

Ø  项目git 初始化：git init

Ø  关联远程仓库: git remote add origin 地址

Ø  查看已关联远程仓库:  git remote -v

Ø  http与ssh互转：
git remote set-url origin <https://xxxx.git> gitremote set-url origigit@git.xxx.git

Ø  commit提交后发现备注写错:

  git commit --amend

【 1. 开始编写：i ;  2. 按键切到命令模式: Esc ; 3. 修改后保存退出 : wq 】

Ø  暂存a分支已修改代码->切换b分支工作完成后->回到a分支释放暂存代码:

feat/a> git stash

feat/a> git checkout fix/b

fix/b> git checkout feat/a

feat/a> git stash pop  

Ø  将本地分支推送到远程仓库中，-u同时指定为默认远程仓库，可以直接git push:

git push -u origin master

Ø  回退到上一版本： git reset HEAD^

Ø  回退到指定commit: git reset –-hard 【commithash】

Ø  强制推送 git push -u origin 分支名 -f

Ø  创建dev分支并跟远程地址上的dev分支关联起来：git checkout -b dev origin/dev

Ø  修改当前分支名称：git branch -m "feat/xxx"

Ø  删除本地分支： git branch -d 分支名

Ø  强制删除本地分支： git branch -D 分支名

Ø  git强制覆盖本地文件（使本地仓库和远端仓库保持一致）： git fetch --all && git reset --hard origin/master && git pull

Ø  将代码从一个分支转移到另一个分支,只需要某一次提交，或某几次提交可以使用cherry-pick 避免多次无用提交记录

git cherry-pick commitHash

Ø  合并分支时使用merge会保留分支所有commit记录，rebase则不会，在更新下游分支时可以使用

git rebase feat/xxx

Ø  在rebase的过程中，也许会出现冲突(conflict)。在这种情况，Git会停止rebase并会让你去解决冲突；在解决完冲突后，用”git add“命令去更新这些内容的索引(index), 然后，你无需执行 git commit,只要执行:

$ git rebase --continue

Ø  已有本地分支和远程分支关联

git branch --set-upstream-to=origin/分支名

avatar
文章
阅读
粉丝