和chatgpt学架构02-环境搭建

简介: 和chatgpt学架构02-环境搭建

我们在上一篇 技术选型 里咨询了chatgpt前后端的框架选择和数据库的选择。有了框架之后就需要选择合适的开发工具了,继续咨询一下chatgpt

我现在选型,前端使用vue,后端使用nodejs,数据库使用mysql,需要搭建开发环境,用什么开发工具比较合适

以下是一些常用的开发工具供您选择:

  1. Visual Studio Code(VS Code):这是一款轻量级且功能强大的代码编辑器,支持大量的插件和扩展,适用于前端和后端开发。
  2. WebStorm:这是一款由JetBrains开发的专业Web开发IDE,提供了丰富的功能和工具,适用于前端和后端开发。
  3. Sublime Text:这是一款简洁高效的代码编辑器,支持大量的插件和自定义功能,适用于前端和后端开发。
  1. Atom:这是一款由GitHub开发的开源代码编辑器,具有可扩展性和自定义性,适用于前端和后端开发。

四款工具可用根据个人喜好,都下载安装一下,这里我们选择vs code来建立开发环境

1 安装vs code

下载地址:

https://code.visualstudio.com/

打开网站点击download,下载安装即可

2 vs code功能介绍

vs code的界面一共分为五个区域,顶部导航我们最常用的是file菜单,可以打开我们电脑里的工程目录,点击Open folder就可以打开我们本地的文件夹

有的同学可能要问要不要汉化,我个人建议是不要,既然你准备写代码,本身就是使用英文的环境编程,汉化的意义是不太大的。

第二部分是侧边栏导航,我们经常使用的是插件安装,因为编辑器默认这些高亮呀,自动补全呀都是需要使用插件的。点击插件的图标

在搜索框输入你需要的插件名称就可以

第三部分是我们的文件导航,在这里可以创建、修改文件,也可以建立文件夹

第四部分就是我们代码的编辑区了,日常我们的创作就是在这里完成的。其实目前的前端开发也基本都是组件化开发了,使用现成的UI框架会提效不少

最后一部分就是命令行窗口,类似于windows的cmd,可以在这里运行命令。

有时候我们需要打开多个命令行窗口,在顶部的菜单导航选择Terminal,选择第一个子菜单就可以


3 安装nodejs

因为本次我们是以javascript作为开发语言,前后端编程的时候需要引入第三方的库,javascript是通过npm来管理包的,需要先安装好Nodejs

https://nodejs.org/en


下载后按照指引进行安装即可,如何验证nodejs配置成功了呢?打开windows的cmd,可以按快捷键win+R

在cmd里分别输入

node -v
npm -v

如果可以正常显示出版本号就表示我们的安装成功了

4 安装vue

vue的话目前已经是3.0版本了,2.0版本到今年年底就停止维护了,因为是自己用所以使用新版本就可以,安装的时候可以使用脚手架搭建

先在你的磁盘里建一个vue的目录,然后进入vue目录,在地址栏里输入cmd

这样就在当前目录打开了cmd

在cmd里安装vue-cli,输入如下命令

npm install -g @vue/cli

接着创建我们的工程,输入如下命令

vue create my-vue-project

选择vue3版本

安装好之后 输入

cd my-vue-project

进入到工程的根目录,如何输入

npm run serve

这样就启动了工程,在地址栏里输入http://localhost:8080/可以看到我们的工程

5 在vs code打开工程

打开vs code 点击file->open folder,选择我们的工程的根目录打开

然后点击terminal打开一个命令行窗口,可以在这里输入启动命令

总结

本篇我们介绍了环境的搭建,做开发第一步就是要搭建开发环境,选择合适的工具无疑可以提高开发效率。我们介绍了nodejs、vscode、vue的搭建过程,有了这些材料我们就可以按照自己的想法架构软件了,还没有动手开发的同学赶紧照着做一遍吧,马上你也可以拥有自己的软件啦。

相关文章
|
JavaScript 前端开发 关系型数据库
和chatgpt学架构01-搭建项目脚手架
和chatgpt学架构01-搭建项目脚手架
|
存储 人工智能 架构师
ChatGPT 与软件架构 (4) - 架构师提示工程指南
ChatGPT 与软件架构 (4) - 架构师提示工程指南
138 0
|
JavaScript 容器
和chatgpt学架构05-首页开发
和chatgpt学架构05-首页开发
|
存储 人工智能 架构师
ChatGPT 与软件架构 (2) - 基于 Obsidian 和 GPT 实现解决方案架构自动化
ChatGPT 与软件架构 (2) - 基于 Obsidian 和 GPT 实现解决方案架构自动化
199 0
|
2月前
|
Java 数据库 Maven
谷粒商城笔记+踩坑(1)——架构、项目环境搭建、代码生成器
项目介绍、项目环境搭建、docker配置mysql,redis,jdk,maven、人人开源、快速开发、安装nodejs、逆向工程搭建,人人开源代码生成器
谷粒商城笔记+踩坑(1)——架构、项目环境搭建、代码生成器
|
5月前
|
机器学习/深度学习 人工智能 算法
【人工智能】第二部分:ChatGPT的架构设计和训练过程
【人工智能】第二部分:ChatGPT的架构设计和训练过程
152 4
|
4月前
|
负载均衡 Java Linux
黑马头条01,环境搭建,今日头条的介绍,今日头条的功能架构图,技术栈的说明,服务层,nacos(奶靠丝)安装,安装在Linux服务器上环境准备,
黑马头条01,环境搭建,今日头条的介绍,今日头条的功能架构图,技术栈的说明,服务层,nacos(奶靠丝)安装,安装在Linux服务器上环境准备,
|
JavaScript 前端开发
和chatgpt学架构04-路由开发
和chatgpt学架构04-路由开发
|
存储 NoSQL 容灾
轻松掌握组件启动之MongoDB(上):高可用复制集架构环境搭建
本文介绍了MongoDB复制集的架构和特点,强调了使用复制集提供数据的高可用性和冗余性的重要性。复制集由Primary节点和Secondary节点组成,确保数据一致性。复制集还具有数据分发、读写分离和异地容灾等附加功能。使用MongoDB复制集可以提供稳定可靠的数据存储和高可用性。
134 1
轻松掌握组件启动之MongoDB(上):高可用复制集架构环境搭建
|
机器学习/深度学习 人工智能 搜索推荐
软件测试/人工智能|一文告诉你ChatGPT原理与架构
软件测试/人工智能|一文告诉你ChatGPT原理与架构