Web前端(基础入门)：1.环境搭建

前言

小时候总会被问到：你长到后想做什么？但我总是支支吾吾回答不出。其实当时自己对计算机充满好奇与未知，就想长大后能做一个自己设计的网站，那将是一件很酷的事情。可惜成长的路线和设想总是有偏差的，但我依然没有放弃这个想法。只要梦想还在，就有实现的可能。哈哈~~废话不多说，跟着小伊从小白通往进阶之路吧！如有错处，还望各位大神批评指正！

一、环境搭建

首先来看什么是前端开发，小伊在此献上百度百科的给出的定义：
前端开发是创建Web页面或app等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互 。它从网页制作演变而来，名称上有很明显的时代特征。在互联网的演化进程中，网页制作是Web1.0时代的产物，早期网站主要内容都是静态，以图片和文字为主，用户使用网站的行为也以浏览为主。随着互联网技术的发展和HTML5、CSS3的应用，现代网页更加美观，交互效果显著，功能更加强大[1]。

接下来在本地电脑上安装前端开发所需的软件。

1、编辑器
可以用记事本、vscode(推荐)、sublime、atom、webstorm等编写代码，但小伊推荐使用vscode，它是微软于2015年发布的一款免费开源的现代化轻量级代码编辑器。

• Vscode :Visual Studio Code 是一个跨平台的代码编辑器,直接在百度搜索vscode,进入官网即可下载.

可以安装一些相关插件 ：

• open in browser或者view in browser(帮助开启页面的)
• image preview(编辑图片)
• vscode-icons(为每个源代码添加图标)

vscode一些基础的快捷键

• ctrl+x ： 剪切
• ctrl+c ： 复制
• Alt+向上/下箭头： 移动当前行
• Ctrl+/ ：加注释
• shift+alt+a ：添加或者删除块注释，来回切换
• shift++alt+上下箭头： 向上或者向下复制当前行

其他编辑器

• Sublime Text
• Atom
• Webstorm
• Notepad++
• UE
• Editplus
• DW

2、浏览器

• Chrome(好用，可以看一下浏览器市场份额排行)
• IE（如果是mac系统，可能没那么好用）
• Firefox

二、基本常识

开发岗位 ：

• 前端（主要负责界面与交互，比如动画、交互） html+css+js
• 后端（处理数据的，给前端提供接口）java,python,php…node

学习路线：
html5(html4)------->css3(css2)------>js
第一阶段：html4/5+css2/3 可以做PC页面+移动端页面
第二阶段：javascript

• 原生客户端js(es5/6/7…+dom+bom)
• jQuery
• bootstrap(响应式)
• 服务器相关技术,node(原生、框架express/koa)+数据库（mongodb/mysql/redis）+…
• 流行框架vue/react/angular
• 高级知识ts+…

三、HTML概述与基本结构

参考资料

[1] 百度百科https://baike.baidu.com/item/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/10009024?fr=aladdin