给想学前端的小白整理了一下学习路线

2024-02-02 17:44

本文主要是介绍给想学前端的小白整理了一下学习路线,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

第一阶段:前端入门

  1.Html5

  2.Css3

第二阶段:JavaScript

  ①JavaScript 基础语法

  ②JavaScript 高级(WebAPI/Dom Bom)

  ③JavaScript 框架(jQuery)

  ④数据可视化(echarts)

第三阶段 服务端编程

1.node js基础

2.ajax

3.promise

4.axios

5.了解学习es6语法,http协议规则

6. TypeScript

第四阶段 Vue.js

①框架:Vue.Js【vue2,vue3】

②学会使用UI组件库(网站快速成型工具)

③vue项目实战

第五阶段 微信小程序

第六阶段 React.js 基础

第一阶段:前端入门

CSS & HTML

对于刚入门的朋友我依旧建议先将 CSS(3) & HTML(5) 的知识点认真学习一边。学习的途中最好是学习完一部分就自己在敲一遍代码,加深自己的记忆。

当然如果你愿意,建议你可以先仿一个网站的静态页面(掘金、知乎等都可以),有一些属性就可以了解他实际的实现场景。

当然刚开始敲代码的时候还是不要过分依赖自动补全功能,一开始就使用自动补全对你记忆一些属性时没有帮助的;踏实点学习,日后会有回报的。

关于 CSS(3) 你需要了解的一些知识点
  • 盒模型(标准 & IE )
  • flex、float、Normal Flow 等的理解
  • CSS 常用选择器
  • 行内、内部、外部样式的区别
  • CSS 层叠规则
  • BFC 与 IFC 的了解
  • CSS3 的 transform、transition、animation 等属性的运用了解
  • 响应式布局的理解
  • ……

CSS 说容易也容易,说复杂也复杂;因为 CSS 总是能给你意外的惊喜。

HTML(5) 你需要了解的一些知识点

说到 HTML 我想有很多人是 div 一把梭。因为 div 用的爽,不用担心默认样式。

有人说 HTML 语义化的优点很多,比如清晰的页面结构、有利于 SEO、便于团队开发和维护;这些我都承认,不过我还是喜欢 div 一把梭。

  • HTML 语义化( 不是很理解为什么面试总会问 )
  • canvas
  • 本地存储( localStorage、sessionStorage、cookie 的理解 )
  • video 和 audio 的使用
  • 应用缓存( cache manifest )
  • ……

第二阶段:JavaScript

JavaScript 基础语法

1、JS中的变量

1.1、变量的创建

1.2、动态类型

2、基本数据类型

2.1、 number数字类型

2.2、string字符串类型

2.3、boolean布尔类型

2.4、undefined未定义数据类型

2.5、null空值类型

3、运算符

3.1、比较运算符

3.2、逻辑运算符

4、条件语句和循环语句

5、数组

5.1创建数组

5.2获取数组元素

5.3新增数组元素

5.4删除数组元素

6、函数

6.1 语法格式

6.2函数表达式

6.3作用域

7、对象

7.1创建对象

 JavaScript 高级(WebAPI/Dom Bom)

  1. Web API介绍
2.API的概念API的概念
API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。
任何开发语言都有自己的API
API的特征输入和输出(I/O)
API的使用方法(console.log())
  1. Web API的概念

浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM)此处的Web API特指浏览器提供的API(一组方法),Web API在后面的课程中有其它含义

4.掌握常见的浏览器提供的API的调用方式

5.ECMAScript - JavaScript的核心定义了javascript的语法规范

JavaScript的核心,描述了语言的基本语法和数据类型,ECMAScript是一套标准,定义了一种语言的标准与具体实现无关

  1. BOM - 浏览器对象模型

一套操作浏览器功能的API

通过BOM可以操作浏览器窗口,比如:弹出框、控制浏览器跳转、获取分辨率等

  1. DOM - 文档对象模型

一套操作页面元素的API

DOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操作

  1. BOM的概念

一套操作页面元素的API

DOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操作

  1. BOM的顶级对象window

window是浏览器的顶级对象,当调用window下的属性和方法时,可以省略window

注意:window下一个特殊的属性 window.name

10.页面加载事件
11.定时器
12.location对象

location对象是window对象下的一个属性,时候的时候可以省略window对象

这篇关于给想学前端的小白整理了一下学习路线的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/671482

相关文章

Vue和React受控组件的区别小结

《Vue和React受控组件的区别小结》本文主要介绍了Vue和React受控组件的区别小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录背景React 的实现vue3 的实现写法一:直接修改事件参数写法二:通过ref引用 DOMVu

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

C#使用Spire.Doc for .NET实现HTML转Word的高效方案

《C#使用Spire.Docfor.NET实现HTML转Word的高效方案》在Web开发中,HTML内容的生成与处理是高频需求,然而,当用户需要将HTML页面或动态生成的HTML字符串转换为Wor... 目录引言一、html转Word的典型场景与挑战二、用 Spire.Doc 实现 HTML 转 Word1

Vue3绑定props默认值问题

《Vue3绑定props默认值问题》使用Vue3的defineProps配合TypeScript的interface定义props类型,并通过withDefaults设置默认值,使组件能安全访问传入的... 目录前言步骤步骤1:使用 defineProps 定义 Props步骤2:设置默认值总结前言使用T

Unity新手入门学习殿堂级知识详细讲解(图文)

《Unity新手入门学习殿堂级知识详细讲解(图文)》Unity是一款跨平台游戏引擎,支持2D/3D及VR/AR开发,核心功能模块包括图形、音频、物理等,通过可视化编辑器与脚本扩展实现开发,项目结构含A... 目录入门概述什么是 UnityUnity引擎基础认知编辑器核心操作Unity 编辑器项目模式分类工程

Python学习笔记之getattr和hasattr用法示例详解

《Python学习笔记之getattr和hasattr用法示例详解》在Python中,hasattr()、getattr()和setattr()是一组内置函数,用于对对象的属性进行操作和查询,这篇文章... 目录1.getattr用法详解1.1 基本作用1.2 示例1.3 原理2.hasattr用法详解2.

MyBatis的xml中字符串类型判空与非字符串类型判空处理方式(最新整理)

《MyBatis的xml中字符串类型判空与非字符串类型判空处理方式(最新整理)》本文给大家介绍MyBatis的xml中字符串类型判空与非字符串类型判空处理方式,本文给大家介绍的非常详细,对大家的学习或... 目录完整 Hutool 写法版本对比优化为什么status变成Long?为什么 price 没事?怎

基于Python Playwright进行前端性能测试的脚本实现

《基于PythonPlaywright进行前端性能测试的脚本实现》在当今Web应用开发中,性能优化是提升用户体验的关键因素之一,本文将介绍如何使用Playwright构建一个自动化性能测试工具,希望... 目录引言工具概述整体架构核心实现解析1. 浏览器初始化2. 性能数据收集3. 资源分析4. 关键性能指

Python按照24个实用大方向精选的上千种工具库汇总整理

《Python按照24个实用大方向精选的上千种工具库汇总整理》本文整理了Python生态中近千个库,涵盖数据处理、图像处理、网络开发、Web框架、人工智能、科学计算、GUI工具、测试框架、环境管理等多... 目录1、数据处理文本处理特殊文本处理html/XML 解析文件处理配置文件处理文档相关日志管理日期和

Python38个游戏开发库整理汇总

《Python38个游戏开发库整理汇总》文章介绍了多种Python游戏开发库,涵盖2D/3D游戏开发、多人游戏框架及视觉小说引擎,适合不同需求的开发者入门,强调跨平台支持与易用性,并鼓励读者交流反馈以... 目录PyGameCocos2dPySoyPyOgrepygletPanda3DBlenderFife