# Hello World
致力于将编程和艺术相结合,以直观、生动、有趣的方式呈现枯燥的编程概念和原理。
# IDE
IDE (Integrated Development Environment,集成开发环境)是含代码编辑、关键词高亮、智能感应、智能纠错、格式美化、版本管理等功能于一身的“高级代码编辑器”
每个IT工程师都要有自己趁手的IDE,它是我们的武器
但是要知道无论使用什么IDE编写出来的代码,本质上都是底黑字”的,都是“纯文字”的
前端最常用的 IDE 有 Webstorm (opens new window)、Sublime (opens new window)、Atom (opens new window) 和 VSCode (opens new window)和 HBuider (opens new window) 我们可以分别去它们的官网看一下。

Webstorm 是最强大的收费编辑器,因为它拥有各种强大的插件和功能.
Sublime 同样非常好用,第一它免费,第二它轻量、高效,第三它插件非常多。
Atom 是 GitHub 出品的编辑器,免费并且插件丰富,而且跟 Sublime 相比风格上还有些小清新。
VSCode 是我日常使用编辑器 微软出品的轻量级(相对于 Visual Studio 来说)编辑器
- 如果你要走大牛、大咖、逼格的路线,就用 Webstorm
- 如果你走普通、屌丝、低调路线,就用 Sublime
- 如果你走小清新、个性路线,就用 VSCode 或者 Atom
- 如果你面试,最好有一个用的熟悉,其他都会一点
WARNING
最后注意:千万不要说你使用 Dreamweaver 或者 notepad++ 写前端代码,会被人鄙视的。
如果你不做 .NET 也不要用 Visual Studio ,不做 Java 也不要用 Eclipse。
Dreamweaver是曾经网页制作的王牌IDE,推崇“所见即所得”,用拖拽控件的方式进行网页开发。
但是近几年,前端开发技术、形式已经发生了根本性的变化, Dreamweaver现在不是前端开发工程师的主流选择了。
# Visual Studio Code简介
Visual Studio Code简称VS Code,来自微软公司

优点:内置功能非常丰富、插件全且安装简单、轻量、有MAC版本
# VSCode颜色主题
- vs code提供了不同风格的颜色主题
- 在文件→首选项→颜色主题中,将主题改为Light+ (default light)
# ctrl +鼠标滚轮缩放字号
- 如果能用ctrl+鼠标滚轮缩放字号,会非常方便
- 我们需要进行相关的配置,打开配置中心,搜索“滚动”即可

# vscode常用插件
chinese 汉化插件
open in browser 右键打开浏览器
Live Server 开启自动刷新功能
Prettier 代码格式化 让代码的展示更加美观
vscode-icons 根据文件的后缀名来显示不同的图标
Bracket Pair Colorizer 2 以不同颜色显示成对的括号,并用连线标注括号范围。简称彩虹括号。
CSS Peak 在HTML通过对应标签的名字快速跳转到对应的CSS
Image preview 图片预览
# 快捷键

ctrl+c 复制
ctrl+V 粘贴
ctrl+s 保存
ctrl+x剪切 也可以用于删除整行
ctrl+z 返回上一步
ctrl+y 撤销返回上一步
ctrl + f 查询/替换内容
Sublime快捷键扩展
- Sublime是另外一个非常著名的编辑器,Sublime中的快捷键非常的经典,而VS Code可以集成Sublime的快捷键
- 需要安装插件,在插件中心搜索Sublime,安装插件即可


# 跳转操作
Cmd +Pagedown/Pageup 在已经打开的多个文件之间进行 非常实用
Ctrl + Tab 在已经打开的多个文件之间进行
# 移动光标
方向键 在单个字符之间移动光标 地球人都知道
Alt+鼠标点击任意位 在任意位置,同时出现光标
Ctrl + D 将全文中相同的词逐一加入选择
# 工作区快捷键
Cmd +B 显示/隐藏侧边栏 很实用
Ctrl + \ 创建多个编辑器
Cmd + Shift+N 重新开一个软件的窗口
Ctrl + W 关闭当前文件
# 其他快捷键
shift + alt + f 代码格式化快捷键
shift + alt + ↓ 向下复制一份 : 选中要复制的内容
# 鼠标操作
在当前行的位置,鼠标三击,可以选中当前行。
用鼠标单击文件的行号,可以选中当前行。
# markdown文件
下载并安装 Typora 进行编写查看 .md 文件