从零开始：搭建家校通全栈开发环境（React + Express + MongoDB）

目录

• [1 开发工具选择](#1 开发工具选择)
• [2 安装git](#2 安装git)
• [3 安装nodejs](#3 安装nodejs)
• [4 安装mongodb](#4 安装mongodb)
• 总结

我们已经有了一个系列低代码搭建家校通的教程，有时候低代码有一些局限性，需要结合全代码来进行混合开发。这个系列呢就准备按照全栈的思路搭建一套家校通系统。系统包含三块，分为管理后台、小程序和H5。

管理后台是为管理员准备的，包括日常经常做的用户审核、配置权限、配置部门等。小程序和H5主要是为教师和家长准备的，日常可以进行沟通交流和提交作业还有在线学习和练习。

要想全栈开发，首先就是需要准备搭建开发环境。我们从零开始起步。

1 开发工具选择

生产软件，找到合适的工具是比较重要的，首先需要一个比较合适的集成开发环境。这里推荐vscode，主要是因为他免费，而且还可以安装各种辅助性的插件。

https://code.visualstudio.com/

点击Download for Windows就可以下载安装包

双击安装程序，同意协议点击下一步

修改默认的安装路径，改为D盘

下一步

下一步

点击安装

点击完成

工具安装好了之后，需要安装一下AI的扩展。现在AI已经发展的比较快了，有了AI的辅助可以节约不少时间。点击侧边栏的扩展，在搜索框里输入你可以使用的AI插件

搜索到了插件之后点击install就可以把插件安装到开发工具里

2 安装git

代码如果写了删，删了写有时候会有版本管理的问题。比如我可能上一个版本已经调试好了，加了一些功能之后就报错了，我想恢复到原来的状态，那本地安装一个版本控制工具是比较合适的，比较流行的是git

https://git-scm.com/

点击下载windows版本

选择64位的安装版本

双击安装

3 安装nodejs

我们这次全栈开发是基于nodejs，所以先需要安装一下运行环境

https://nodejs.org/en

双击安装

勾选接受协议

同样的将安装路径修改为D盘

一路next

nodejs还自带了包管理器npm。包管理器是我们的一个很方便的工具，可以下载那些好些人贡献的各种各样的库，基本上你能想到的功能都有别人做过了，直接拿来使用就可以

按win+r唤醒我们的命令行，输入cmd打开命令行窗口

输入如下命令，验证nodejs和npm是否正常安装成功

node -v
npm -v

4 安装mongodb

mongodb是一款文档型数据库，可以自由创建字段，比较适合我们这种经常有各类表单搭建的场景，下载地址

https://www.mongodb.com/try/download/community

双击安装

同意协议

点击自定义安装

修改安装路径，更改为D盘

点击下一步

数据库安装好之后我们用自带的图形化工具连接一下，先创建一个连接

URI保持默认，name自己输入就可以

默认会带的三个数据库，是mongodb自己使用的，日常我们可以不用去操作，在列表上点击创建数据库的按钮，我们自己创建一个数据库

mongodb在创建数据库的时候要求至少创建一个集合，集合就是关系型数据库表的概念，我们这里创建一个用户集合

mongodb是无模式数据库，意味着和mysql是不同的。mysql要求事先把表结构创建好之后再写入数据。mongodb事先不需要创建表结构，是在数据写入的那一刻同时保存结构和数据的，意味着你可以动态的修改字段。

总结

我们本篇按照全栈的结构搭建了我们需要的工具，如必备的集成开发环境vscode，必备的运行环境nodejs，版本控制工具git，数据库mongodb。把基础环境搭建好，我们在下一个篇就介绍前后端分离的基础目录，如安装配置react，搭建express。