有很多想转行前端的朋友，都是因为害怕自己搞不懂、学不会编程，搞不定代码，而不敢转到前端这一行。

北大青鸟西安建大IT学院很明白大家心中的这种顾虑，但既然已经有了这个转行或者学习的心思，不妨先自己看一看学一学。

这里北大青鸟西安建大IT学院的老师给想要尝试的大家整理了前端零基础入门资料：希望大家能打好基础，找对入门前端开发的学习方法。

01

工具篇

工欲善其事，必先利其器，在开始之前选择一个合适好用的编辑器是很重要的，工具不再多，在于好用就行，除了编辑器，达妹也要给代价要推荐其他的一些工具，才能够让你在学习的道路上更加顺畅。

1、WebStorm

不必多说，前端最强大的编辑器，特别是那无敌的智能提示，但是它的缺点在于如果项目多于大时，出现的卡顿让很多人苦恼。

2、goole

一个人的知识是有限的，掌握了搜索的技巧才能以不变应万变，很多时候某度出来的东西重复性很大，最重要的是垃圾信息很多，在某度找不到的答案，在这里很容易找到，Google 也是达妹的必备搜索。

3. Github

全球最大的开源交流社区，没有账号的赶紧注册，在这有很多优秀的资源项目，各种大神。观摩优秀代码是我们学习的很好路径。另外在开发过程中，很多时候任务重、时间紧，应该避免重复造轮子，这里能够找到你需要的工具或代码。

4. Markdown

Markdown 轻量级标记语言，简洁的语法，达妹认为人人都应该掌握，在用 world 时的场景，每次写完文章之后，不得不话费很多时间进行格式的排版，使用它你就可以避免这些烦恼。

02

HTML篇

一些准备就绪之后，开始我们的学习之旅，首先先从 HTML 开始。

HTML名为「超文本标记语言」，是整个页面的结构基础，它承载了我们的页面内容。

w3school 教程：内容非常的基础，适合小白学习，对 HTML 有一个入门了解。

freeCodeCamp：一个非常好的入门网站，采用闯关的模式，就像游戏打怪升级一样，非常的有乐趣，准备自学的小伙伴不妨试试。

03

CSS 篇

HTML 承载了页面的内容，但是有时候会略显单调与「丑陋」，CSS 的作用就是为这些内容加上样式，就像一个美女也要有漂亮的外衣去修饰才会更加漂亮，「人靠衣装马靠鞍」，网页的内容也是需要穿上一件漂亮的外衣去吸引用户。而 CSS 则完成了这个装饰。

芯晴素材网-网页特效代码，是集各种网页素材以及网页源码为一体的面向开发人员的一个网页素材网站。

前端网页制作过程中所涉及到的任何特效代码，都可以来这里搜索，非常方便使用，在你还不会自己写代码时，先看看别人是如何写这种动效代码的，鼠标特效、图片切换、导航、鼠标、图片轮播、文字滚动、css、菜单、图片放大等特效代码全部都有。

04

Java篇

有了 HTML 与 CSS，网页也就有了内容和样式，但是会缺少与用户的互动，所有的内容都静静的躺在那里死气沉沉。就好比一个美女穿着漂亮的衣服在你面前一动不动好像也没有什么吸引力，但如果又唱歌，又跳舞，还向你抛媚眼，那可真就把持不住了。Java 就是给网页添加这样的「行为」。

05

Jquery篇

虽说现在已经是单页面应用时代，有React，Vue 这种强大的框架可以使用，但也不缺乏一些老的项目需要维护，而且在学习之初，可以用它做两个简单的应用还是不错的，可以相对了解下基本用法，它可以让你更好，更方便的操作DOM。但不建议再深度学习。

jquery插件库网站，在合理，各种前端程序员能用到的插件，细化研究新东西的自学者都可以挖掘出各种小插件。

06

NodeJS与模块化

NodeJs 的出现让前端发展进入了一个新的领域，并且滋生出专业的 Node 工程师，不仅如此 Node 在前端模块化，工程化起到很重要的作用，所以了解是必须的，如果感兴趣的可以深入学习，可以向全栈工程师发展。

07

框架篇

框架能力也是前端开发人员币别的技能之一，三大框架的「最终目的」都是一致的。达妹认为初学者不一定纠结到底应该学习哪一个，可以选择其中的两个是最好的。对于刚入门的人来说，建议选择 Vue 入手，比较简单，灵活。