Java小白 前端后端开发 环境搭建【jdk+idea+webstorm+maven+nodejs+vue+mysql】

这是我自己的环境搭建记录，分享给大家一起学习~~
后续还会再补充自己做的小项目【含前端和后端】
如有任何问题，欢迎大家批评指正！

一、安装JDK

1. 百度搜索JDK8，在官网下载适配自己电脑型号的exe文件
   【JDK8和JDK1.8是一个东西，不同的叫法而已】
   
2. 双击运行exe文件，进行安装
   
   
   【安装的中途还会让你设置一下jre（Java Runtime Environment）的安装路径】
3. 配置环境变量
   
   
   
   【变量名就写JAVA_HOME，不要动】

4. 检查是否安装成功

二、安装IDEA集成开发环境

1. 百度搜索IDEA，我下载的是社区版【Ultimate的配置过程基本一样】
   
2. 双击exe文件进行安装
   
   
   
   
3. 安装完成后，创建个项目试试，双击图标
   
   
   
   
   

三、安装webstorm

【这里就不放图了，主要步骤和IDEA是一样的】

1. 百度搜索webstorm，官网下载
2. 双击exe一步步next安装即可
3. 安装完成后，打开后需要进行激活（需要教程的可以在评论区留下你的邮箱📫）

四、安装Maven包管理工具

1. 官网下载编译好的Maven【 https://maven.apache.org/download.cgi 】
   

2. 解压到某个文件夹下
   

3. 配置环境变量
   
   
   
   
   【后边依次点击确定即可】

4. 验证是否安装成功
   

5. 配置本地仓库----修改settings文件
   
   
   

6. 配置镜像----修改settings文件
   

<mirror>
	<id>alimaven</id>
	<mirrorOf>central</mirrorOf>
	<name>aliyun maven</name>
	<url>http://maven.aliyun.com/nexus/content/repositories/central/</url>
</mirror>

7. 配置JDK----修改settings文件
   

<profile>
      <id>jdk-1.8</id>
      <activation>
        <activeByDefault>true</activeByDefault>
        <jdk>1.8</jdk>
      </activation>
      
      <properties>
        <maven.compiler.source>1.8</maven.compiler.source>
        <maven.compiler.target>1.8</maven.compiler.target>        
        <maven.compiler.compilerVersion>1.8</maven.compiler.compilerVersion>
      </properties>
</profile>

8. 在IDEA中配置Maven
   【对于当前的项目，想用maven进行管理，设置过程如下】：
   
   
   
   【想让所有新创建项目都默认通过maven进行管理，设置如下】：
   

-DarchetypeCatalog=internal

……………………………………接下来创建一个基于Maven的普通Java 项目………………………

【如果是要创建一个Web项目，那模板就选web的那个就行】

五、安装配置Node.js，@Vue/cli

1. 官网下载node.js
   
2. 安装【中途选择安装路径，其他Next即可】
3. 检查是否安装成功
   
4. 修改环境变量，修改配置路径【node_global、node_cache】
   （如果不配置的话，npm install xxx 会默认安装到C盘的路径下）

npm config set prefix “……”
npm config get prefix
npm config set cache “……”
npm config get cache

5. 安装淘宝镜像cnpm

npm install -g cnpm --registry=http://registry.npm.taobao.org

6. 安装vue脚手架3.x的版本，@vue/cli

cnpm install -g @vue/cli
vue -V

要是想安装指定版本的vue/cli，需要用下述命令：
npm install -g @vue/cli@3.11.0 // 后面为版本号

7. 项目启动测试【webstorm中打开的项目】
   
   
   

六、安装配置MySQL

1. 下载 【https://dev.mysql.com/downloads/windows/installer/8.0.html】
   
2. 双击进行安装
   Next
   Next
   Yes
   Execute Next
   Next
   

Execute
Finish

3. 启动和停止MySQL命令【安装完默认就是开启的啦哈】

4. 连接MySQL数据库
【方式一： 利用MySQL提供的客户端命令行工具】

【方式二： 利用系统自带的命令行工具执行指令】

七、IDEA社区版连接MySQL

【IDEA社区版不支持连接数据库，我们需要下载一个插件】

【但是社区版的IDEA操作MySQL功能上非常局限，太不友好了，所以我准备换成Ultimate了！】
【安装过程类似于社区版，有需要激活教程的，可以在评论区留下你们的邮箱📫~】

后续的环境部署，请继续跟进：【续】Java小白 前端后端开发 环境搭建