12课-开发工具
前端开发工具 VSCode
Visual Studio Code（简称VSCode）是一款免费、开源的跨平台代码编辑器，可以在 Windows、macOS、Linux 上运行。它不仅支持多种编程语言，还拥有丰富的插件和工具，可以让开发者提高工作效率。
- 安装和启动 VSCode
在官网 https://code.visualstudio.com/ 下载并安装 VSCode。安装完成后，用桌面图标或开始菜单启动它。
- 常用快捷键
① Ctrl+Shift+P 这是最有用的快捷键之一，用于打开 VSCode 的命令面板；
② Ctrl+` 是一个快捷键，可以打开和关闭集成的终端；
③ Ctrl+N 新建一个文件；
④ Ctrl+Shift+N 新建一个文件夹；
⑤ Ctrl+S 保存当前文件；
⑥ Ctrl+Shift+S 另存为当前文件；
⑦ Ctrl+X 剪切当前行或选中内容；
⑧ Ctrl+C 复制当前行或选中内容；
⑨ Ctrl+V 粘贴当前行或选中内容；
⑩ Ctrl+Z 撤销上一个操作；
⑪ Ctrl+Shift+Z 重做最后一个操作。
- 使用插件
VSCode 可以通过安装插件来增强其功能。安装插件非常简单，只需要打开拓展面板，然后输入你需要的插件名称回车搜索并安装即可。 我们可以根据不同的开发需求安装不同的插件，推荐安装的插件有：Chinese (Simplified) (简体中文) Language Pack、GitLen、HTML CSS Support、Code Runner、Auto Rename Tag、TodoTree
- 使用内置终端
VSCode 包含一个内置的终端，它可以让你在编辑代码的同时轻松地再当前目录打开一个终端窗口进行命令行操作。你可以通过按 Ctrl+` 来打开这个终端。win10以上默认情况下VSCode使用的是powershell做为默认终端，可以通过终端右上角+号旁边的下拉按钮→选择默认配置文件→选择“Command Prompt即可。
数据库管理工具 Navicat
数据库管理工具是一种软件工具，用于管理数据库，包括数据库设计和建模、数据库连接和操作、数据库备份和还原、数据库性能监测和调优以及安全管理等功能。它帮助用户更方便地管理数据库，提高工作效率和生产力。
- 使用 Navicat 添加连接
要使用 Navicat 进行数据库管理，首先需要连接数据库。在 Navicat 的主窗口中，选择“连接”按钮，然后填写数据库连接信息，包括主机名、端口号、用户名和密码等。连接成功后，就可以在 Navicat 中查看数据库中的表和数据了。
- 使用 Navicat 创建数据库并导入数据库文件
要创建新的数据库，可以在 Navicat 的主窗口中右键点击对应连接，再点击“新建数据库”按钮，然后填写数据库名称和字符集等信息。创建完成后，就可以在 Navicat 中打开该数据库，创建表和导入数据了。如果有现成的数据库文件需要导入，可以在 Navicat 的主窗口中选择“导入向导”按钮，然后选择要导入的数据库文件和目标数据库即可。
- 使用 Navicat 创建数据库表
要创建新的数据库表，可以在 Navicat 中打开目标数据库，然后选择“表”选项卡，点击“新建数据表”按钮。在表的设计界面中，可以设置表的各个字段、数据类型、默认值、约束等属性。设置完成后，点击“保存”按钮，即可创建新的数据库表。
- 使用 Navicat 创建视图
要创建新的数据库视图，可以在 Navicat 中打开目标数据库，然后选择“视图”选项卡，点击“新建视图”按钮。在视图的设计界面中，可以设置视图的sql语句，也可以通过上方的”视图创建工具“，通过拖拽来生成视图。设置完成后，点击“保存”按钮，即可创建新的数据库视图。
- 使用 Navicat 备份恢复数据库
要备份数据库，可以在 Navicat 中打开目标数据库，右键“备份”→点击“新建备份”，填写注释后点击备份按钮等待备份完成即可。备份完成后，右键备份文件可以进行恢复操作。
版本控制工具 Git
- 提交代码
提交代码是 Git 中很常见的操作。要提交代码，需按以下步骤：
（a）打开 VSCode 编辑器，打开要提交的文件或文件夹。
（b）点击左侧状态栏的源代码管理的图标（有改动会显示“+1”等），此时会打出 Git 插件的面板。
（c）在 Git 插件的面板中，选择要提交的文件或文件夹，在右侧出现的已更改文件列表中点击加号，即添加到暂存区。
（d）在 Git 插件的面板中，填写提交信息，并点击“提交”按钮。此时，已成功提交，按钮会变成“同步更改”，点击即可提交到仓库。
- 切换分支
切换分支通常是在开发过程中非常常见的操作。如需切换分支，请按以下步骤：
（a）打开 VSCode 编辑器，打开要合并分支或更改当前分支的项目。
（b）在 VSCode 底部状态栏中，单击当前分支名称，这会打开 Git 插件的面板并显示当前分支的列表。
（c）在分支列表中，选择所需的分支即可切换到对应分支。
- 查看历史记录
Git 的历史记录是了解项目开发情况的重要途径。要查看历史记录，需要先安装GitLens插件，然后按照以下步骤查看历史：
（a）打开 VSCode 编辑器，打开要查看其 Git 历史记录的文件或文件夹。
（b）点击左侧状态栏的源代码管理的图标，此时会打出 Git 插件的面板。
（c）在面板中，找到COMMITS，点开它，就可以查看项目的提交记录。
- 要查看文件的历史版本，请按以下步骤：
（a）在 VSCode 编辑器中打开要查看其历史记录的文件。
（b）点击左侧状态栏的源代码管理的图标，此时会打出 Git 插件的面板。
（c）在面板中，找到FILE HISTORY，点开它，就可以查看文件的历史版本。
- 解决代码冲突问题
当我们在使用 Git 管理代码时，有可能会遇到代码冲突的情况。这时我们可以使用 VSCode 的 Git 工具来解决这个问题。下面是一步一步的详细操作过程，以帮助新手更好地理解：
（a）打开 VSCode 的 Git 工具面板
在 VSCode 的左侧侧边栏中，选择 Git 图标，然后 VSCode 会弹出 Git 面板。
（b）点击冲突文件的路径
在 Git 面板中，找到冲突的文件，然后点击它的路径。
（c）手动解决冲突
在编辑器中，找到与冲突有关的代码段，然后根据需要进行修改。通常，冲突会在两个分支之间发生，您需要阅读两个分支的代码，并决定如何合并它们。
（d）暂存解决方案
完成冲突解决后，您需要把已修改的文件暂存以备提交。在 VSCode 的 Git 面板上找到未暂存的文件，右键点击文件，然后选择 "暂存"。您也可以使用 Ctrl + Enter 快捷键完成这一步。
（e）提交更改
在您将更改暂存之后，您可以生成一条提交记录来保存这些更改。在 VSCode 的 Git 面板上找到已暂存的文件，右键点击并选择 "提交"。在弹出的窗口中填写提交信息，详细阐述您的更改，然后点击 "提交" 按钮。
（f）推送到远程仓库
提交更改后，您可以将其推送到远程仓库，使其他人可以访问您的更改，在 Git 面板上选择 "同步" 按钮，然后选择 "推送" 选项。如果您不打算推送这些更改，可以选择将其保留在本地分支上。
包管理工具 npm
npm 是 Node.js 的包管理工具，用于从包仓库下载和安装第三方模块，以及发布自己的模块。下面介绍一些常见的 npm 使用方法：
（1）安装模块
可以使用以下命令从 npm 安装模块：
npm install <package-name>
此命令将下载指定的模块并将其安装到 node_modules 目录中。也可以使用以下命令安装模块并将其添加到 package.json 文件中：
npm install <package-name> --save
（2）卸载模块
可以使用以下命令卸载已安装的模块：
npm uninstall <package-name>
此命令将从 node_modules 目录中删除指定的模块，并从 package.json 文件中移除依赖。
（3）更新模块
可以使用以下命令更新已安装的模块：
npm update
此命令将更新项目依赖中的所有模块到最新版本。