01 环境配置

个人博客地址 www.codermjjh.cn/ 大家走过路过不要错过

电脑配置、推荐软件

电脑配置-显示隐藏文件拓展名

文件夹-查看-勾选文件拓展名，隐藏的项目

推荐安装的软件

• Chrome浏览器：开发必备浏览器
• VSCode编辑器：开发推荐编辑器（编写代码） www.aliyundrive.com/s/hnwNDL4cE…
• xmind Zen思维导图：思维导图笔记
• Typora：markdown笔记软件 www.aliyundrive.com/s/2JKZoNp9k…
• snipaste: 截图软件

开发工具选择

开发工具

• 记事本可以开发一个网页吗？答案：可以。但是有很多的缺点：
  • 创建和管理文件不方便；
  • 没有颜色标识/没有智能提示/无法调试程序；
• 专业的前端开发工具
  • WebStorm、Sublime Text、Visual Studio Code、Atom、HBuilder、IntelliJ IDEA、Dreamweaver
  • 智能提示、高亮识别、语法检测、集成环境、开发效率高
• 上课推荐开发工具：
  • Webstorm
    • 优点：集成开发工具，包罗万象
    • 缺点：重（占用系统资源多），收费
  • VSCode（上课使用）
    • 优点：轻（相当于一个编辑器），免费
    • 缺点：需要安装一些插件来辅助开发

VSCode工具安装

• VSCode编辑器下载-安装：code.visualstudio.com/

• 安装插件（增加功能）：右侧图标最后一项，Extensions，查找需要的插件（联网）

  • 中文插件：Chinese
  • 颜色主题：atom one dark
  • 文件夹图标：VSCode Great Icons
  • 在浏览器中打开网页：open in browser、Live Sever
  • 自动重命名标签：auto rename tag

• VSCode的配置：

  • Auto Save 自动保存
  • Font Size 修改代码字体大小
  • Word Wrap 代码自动换行
  • Render Whitespace 空格的渲染方式(个人推荐)
  • Tab Size 代码缩进
    • 推荐2个空格（公司开发项目基本都是2个空格）