什么是前端?

为了更好的了解什么是前端,首先我们需要先了解web系统。那么什么是web系统呢?官方讲就是以网站形式呈现,用户通过浏览器访问,完成一定功能的系统。这么讲可能还是不能很好的理解,举生活中你接触到的例子,你就会恍然大悟了。比如人们现在经常使用到的电商网站,淘宝,京东,天猫等就是一个web系统。

而前端就是web系统从开发人员的角度有的一个概念,还有一个与之相对的概念是后端。前端是网页上为用户呈现的部分,通俗地讲,你使用这些网站的时候能够看见的一些反馈和页面就是由前端人员编写代码呈现出来的,比如网站中页面的转换,图片的大小效果,字体和页面布局等等。而后端是你不能看见的部分,它主要负责的是与数据库进行交互,完成数据存取。

浏览器在前端中起的作用:

浏览器,全称网页浏览器,是一种用于检索并展示万维网信息资源的应用程序。这些信息资源可为网页、图片、影音或其他内容,它们由统一资源标志符标志,信息资源中的超链接可使用户方便地浏览相关信息。

浏览器是前端开发工作者的承载体,前端开发人员写出形式可被浏览器识别和解析的网页文件代码,接着浏览器中就会将开发人员写的代码可视化,呈现出最终的效果。可以说代码是原材料,而浏览器就是一位勤劳的加工工人,帮助呈现出最后的精美的产品,也就是我们的网站/网页。

vscode安装

前端开发最基础的编译器就是vscode了,它对新手真的非常的友好,有很多方便的快捷方式,能够很好地解决我这样的新手对文件结构不熟悉的问题,当然如果你想学好任何一门语言,记住它的语法以及结构都是必不可少的,因此在你学习的过程中,该记的还是得记。

那么现在我来说一说vscode的安装方法,最简单的安装途径是在电脑自带的软件商城中下载(亲测好使)。直接在软件搜索栏输入vscode即可。

另一种途径则是从官网下载:https://code.visualstudio.com/




系统前端架构设计图 前端系统功能_开发人员


但是我试着下了一下,它下载特别慢,而且莫名其妙显示网络错误下载失败,于是我去求助了大神的文章,他也遇见了和我同样的问题,指路: 里面有详细的安装过程,我补充一点就是,如果你想要在桌面找到这个软件,那么别忘了在安装过程中点击创建桌面快捷方式

下载完成之后,你会发现它是英语的,如果你不习惯这个环境,可以点击左边栏的扩展,在里面搜索下图第一个插件,安装之后就会发现它是中文页面啦~

还有一个支持右键打开的插件,也是比较使用的,建议大家也下载下来,即下图第二个插件。


系统前端架构设计图 前端系统功能_前端_02