前言

零基础开始学习前端

前端主要学习技能

1. HTML
2. CSS
3. JavaScript

   JavaScript前言

   
   Javascript是一种web技术，最初起名叫LiveScript，它是Netscape开发出来一种脚本语言，其目的是为了扩展基本的html的功能，用来替代复杂的CGI程序来处理web页表单信息，为web页增加动态效果。当Java出现以后.Netscape和Sun公司一起开发了一种新的脚本语言Javascript.

前端框架

1. React
2. Vue
3. Angular
4. … …

学习方法

1. 关于前端的学习方式有很多种,主要就是需要花时间
2. 在学习的过程以实践为主,自己敲代码的过程中会遇到的问题会很多,而且自主解决问题后会有比较深的理解
3. 无论是自学或是在公司实习,都需要不断的尝试犯错,只有在面对报错的情况才会成长
4. 记住一句话: 做为程序员,不是在改BUG,就是在改BUG的路上
5. 遇到问题不要焦虑

5.1 首先需要解决问题
5.2 其次解决不了的问题先理清思路
5.3 有报错的代码一般都会有提示在哪里错了
5.4 实在不会可以先百度,然后再理清思路
5.5 再解决不了的问题就先问问同事,同事都解决不了的问题就和产品聊聊能不能换个思路或方法

学习时间安排(建议)

CSS +HTML

1. 全天学习 两个月
2. 兼职学习 三个月

主要学习方向：

  - 学习CSS基础使用
  - 学习CSS+HTML页面布局
  - 熟练使用CSS3和HTML5属性
  - 熟练使用CSS动画
  - 独立完成10个以上的页面布局

JavaScript

1. 全天学习 两个月
2. 兼职学习 四个月

主要学习方向：

  - 对页面的操作
  - Ajax
  - 了解浏览器的事件循环机制
  - 了解dom
  - 熟练操作表格的增删改查
  - 熟练编写走马灯
  - 熟记JS的基础类型
  - 熟记JS操作数组、字符串、对象的方法
  - 独立编写20个以上的公共方法

React框架

1. 全天学习 两个月
2. 兼职学习 四个月

主要学习方向：

  - 了解组件继承原理
  - 熟记React的生命周期作用对页面的操作
  - 熟练使用React路由（[Router](https://reactrouter.com/web/api/Link/to-object)）
  - 熟练使用React数据管理（[Redux](https://redux.js.org/)）
  - 熟练使用函数式组件（[Hooks](https://reactjs.org/docs/hooks-intro.html)）
  - 熟练使用类组件（[Class](https://reactjs.org/docs/state-and-lifecycle.html#adding-local-state-to-a-class)）
  - 熟练使用组件库（如：[AntDesign](https://ant.design/components/overview-cn/)）

Git命令

一周

主要学习方向：

  - 熟练使用git命令

周边技术

webpack

一个模块打包器。它的主要目标是将 JavaScript 文件打包在一起,打包后的文件用于在浏览器中使用

node.js

Node.js 就是运行在服务端的 JavaScript。
Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。

knex.js

操作MySql的轻量级框架

社区与代码库

github

代码库和技术讨论社区

码云（gitee）

代码库和技术讨论社区

掘金

技术讨论社区

stackoverflow

技术讨论社区

MDN

技术讨论和技术学习社区

w3school

技术学习社区

菜鸟教程

技术学习社区

官网

工具

Sourcetree

可视化UI的Git管理工具

Visual Studio Code

代码编辑器

ApiPost

接口调试工具

蓝湖

UI稿可以转换成我们前端需要的样式

框架

React

• ReactNative

  VUE

  Angular

  QucikUI

  Layui

  Avalon

  Dojo

  Ember

  Aurelia

组件库

AntDesign

Element

Flutter

Vant UI

iView UI

Cube UI

Mint UI

We UI (微信小程序)

Lay UI

At UI

图形库

ECharts

Highcharts

Charts.js

D3.js