2024从零开始使用VSCode编程（动态页面技术栈简易版）技术介绍以及体验安装使用

本文只为记录并帮助有需要的小伙伴学习使用VScode

注意：本教程发布于2024年7月，软件为win1.91，后续版本使用时也可参考

重点注意：此教程相较于上个教程跨度较大，涵盖技术栈相较于静态页面（HTML+CSS+JS）有所增加，请确保静态页面制作流程熟悉后再了解

⚠❗⚠❗⚠❗！！！！！！教程信息量较大！！！！！！！⚠❗⚠❗⚠❗

教程前言

本篇文章将带你初步体验关于前端动态页面的开发所用技术栈以及知识点，后续会有更加详细的技术使用介绍

动态页面

• 实时更新：页面的内容可以根据用户的输入、搜索、系统时间、数据变化等因素进行动态更新。例如，社交媒体网站的新闻动态、电子商务网站的库存信息等。

• 交互性：用户可以通过填写表单、点击按钮、选择选项等方式与页面进行交互，页面会根据用户的操作进行数据或页面的更新。例如，搜索引擎的搜索结果页面、在线表单的即时验证等。

• 后台数据交互：页面可以从服务器获取数据或将数据发送到服务器，从而进行动态更新。例如，用户登录后显示个性化内容、从数据库中提取最新数据等。

• 客户端脚本：使用JavaScript等脚本语言在客户端进行处理和更新。例如，AJAX（异步JavaScript和XML）技术可以实现页面部分内容的更新而不重新加载整个页面。

• 服务器端脚本：使用PHP、Python、Ruby等服务器端语言生成页面内容。例如，使用PHP生成包含最新新闻的页面、使用Python处理用户提交的表单数据并返回结果。

简单来说：动态页面就是数据动态，具备前后端交互能力

一、涵盖新技术栈：

1、axios（获取后端传来的数据）：

• 实现异步请求，从服务器获取数据而不重新加载整个页面。

2、前端框架和库（简化编程操作）：

• Vue.js：用于构建用户界面的渐进式框架，双向数据绑定、Vuex状态管理。
• React：同类型，暂不讲解
• Angular：同类型，暂不讲解

注意：类似做衣服的布料，三个都是为了做衣服用的，不过是做不同的衣服的，个人建议学习Vue.js，但如果你是要制作大型项目的开发者请选择后两者学习

3、前端工具和构建工具（快捷添加开发工具）：

• 包管理器：如npm、Yarn，用于管理项目依赖。
• 构建工具：如Webpack、Parcel，用于打包、编译前端资源。（暂不讲解）
• vite：提高效率的，个人认为非必要（暂不讲解）
• Babel：提高效率的，个人认为非必要（暂不讲解）

二、涵盖新知识点

1、API和后端交互（规范前后端交互）：

• RESTful API：与服务器进行数据交互的常见方式，使用HTTP动词（GET、POST、PUT、DELETE）操作资源。

注意：本知识点是用于规范开发的接口（API）的

2、数据处理和可视化（规范数