首页 > 自考资讯 > 自考知识

web前端怎么入门,web前端零基础视频教学

头条共创 2024-07-05

好东西即将到来,所以准备好迎接它们吧!

首先,一般来说,你需要学习的是:

HTML+CSSjs 框架Vue/React 其他在我们详细介绍之前,我想提醒所有初学者:在开始下一项之前,永远不要想着掌握一项。请不要!否则,从前端内容的庞大程度来看,进入的日子还很遥远。

每个人都知道80/20 规则。如果您是初学者,第一步是建立一个坚实的框架并学习要点和常用内容。那么先上路吧,通过项目来完善自己,优化自己的知识体系。

我推荐一些“前端社区”。

掘金:https://juejin.im/MDN 网页文档:https://developer.mozilla.org/zh-CN/Sifei:https://segmentfault.com/Github:(代码托管社区) 接下来仁友君讲解一下前端各部分要掌握什么。我们希望您会发现这些信息有用,例如具体内容、学习方法和推荐资源。

1、HTML+CSS的学习

要学的内容:

了解HTML 语法和格式、常用标签及其功能、嵌套标签以及如何使用调试工具,以便您可以使用这些工具来调试HTML、CSS 和JS。 CSS中介绍的方法、CSS常用选择器、盒模型(content、padding、margin、border)、CSS布局(浮动、定位)、display显示类型

学习方法:

主要看书,辅以视频。

由于HTML+CSS相对简单,建议您直接阅读文档或书籍,因为视频学习会花费太多时间。如果问题再次出现,请寻求视频帮助。

资源推荐:

文档资源:

https://www.w3school.com.cn/index.html (请阅读文档。不建议从头学习。当做字典查查不错)

书:

《Head First HTML与CSS》

2fa5a3e60fa0459494c25b96fd764da9~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=cJh8kZFRyW4GgkZIaYVaiBG5uz8%3D 一本清晰了解页面编程概念的前端书籍,适合初学者。但它很厚!这么厚!强烈推荐给自律性好、有耐心、有时间的朋友。

如果你想快速完成这部分的研究,达到创建最基本的页面的量化效果,人友君有一本简单易用、实例丰富、非常有趣的入门书值得学习。仅有200 多页,非常薄,全彩印刷,一目了然(可以放在包里通勤时阅读的类型)。

《从零开始:HTML5+CSS3快速入门教程》

8a6c7440d7d2420e90b9bbdd191c7327~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=WkVUPjAiasFABNWfYR0r3GQ47bU%3D 作者:郝金亭石晓燕

从零开始HTML5+CSS3快速入门教程59.8 购买本书从零开始,全面讲解了使用HTML5和CSS3进行网页开发的整个过程,帮助读者学习静态页面开发的核心知识点和相应的编程能力。

对初学者非常有帮助的是,每一章都有一个页面,可以作为该章内容的预览,也可以作为测试的概述。所以这本书是可以量化的。这句话我想重复N遍!作为学生完成入学考试后,还有什么比可以量化的学习方法更让人安心的呢?这意味着您可以在我开始学习之前了解我正在学习的内容,并在我完成后测试我学习的有效性。

本章的任务如下。

0b5a8f67e6ba4516ba0dbfdb89b1cb56~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=XeobIpCMIhaA0l6S8OW2pSqpvGI%3D b1cbd336962d4915841dd8c28d0a827f~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=0Sc0%2FohG91a1wra2K7BD%2BY9LPZA%3D 特别是初学者对于自己想学什么很模糊。这种可量化的学习也是将一个大目标分解为无数个小目标,其中每一步都是可预测的,而且并不困难。这样的模型将更容易学习并且更容易坚持。

另一个小案例如下所示:

e1e028526eb74a539ba6f6c5daf268f0~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=xkZc1JSWFr8lqPo15zlUl%2B%2BkqR4%3D 更复杂的页面将如下所示:这大概就是学习这本书的结果。

46ec1ca2054641e9ace4cc4db09a7348~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=69azt95blsw1ohtpsFCmegvLi7w%3D 215cf3a20a6f4f42ab8ca46e555a7756~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=IeE8HlFt6pShrPrtvNcNfAIkPTw%3D有目的地学习,学习时就不会那么困惑。

阅读和学习肯定会节省你的时间,但你可能会有这样的问题:如果我在学习过程中遇到问题怎么办?如果我的代码因为bug而停止了怎么办?这本书也探讨了这个问题。我们建立了QQ群(544028317),直接提供全书的支持视频和资料,以便老师及时解答问题。这种方法直接解决了自学的问题。暂时不打算买书的朋友还是可以去买纱的。

该组包括:

全书源码视频教程教育PPT编程教材老师问答这本书可以说是初学者的福音。我强烈推荐这本书供初学者入门。

这一阶段建议学习时长:建议在两周内完成。

30109113b72144ebba2ec95574fca737~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=WBg9pWpCVaf%2FH4zxyiJaXhAnqQE%3D

2、js的学习

要学的内容:

js执行序列、基本编程基础(变量、操作、流程控制、数组、函数调用、自定义函数、对象)、json、js dom操作、js事件机制(委托、绑定、决策、监控、冒泡)、冒泡预防、兼容性)、了解ajax xmlhttprequest以及如何创建它(多浏览器兼容性)、跨域、了解其工作原理、http协议

学习方式:

建议通过观看视频学习和阅读书籍来填补您的知识盲点。

HTML+CSS其实只是一种标签语言,而JS才是真正编程的开始,开始考验你的逻辑能力。对于有其他语言基础的人来说,JS并不难,可以通过看书来学习。零基础知识的初学者此时可能会觉得编程很困难。

推荐资源:

视频资源:

来自硅谷的最新全套JavaScript基础教程:https://www.bilibili.com/video/bv1YW411T7GX/?spm_id_from=333.788.b_636f6d6d656e74.10

就我个人而言,我非常喜欢李力超的教学风格。让编程课有相声的感觉,有效减少枯燥的学习。

MOOC:https://www.imooc.com/(提供许多免费课程)

书:

《从零开始:HTML5+CSS3快速入门教程》

对于初学者来说,这本书没有任何障碍。只要按照书上的例子,一步步写代码就可以了。

了解如何操纵和控制浏览器元素并实现简单的页面效果。

421d5d6d2c7849c793b108675558d424~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=XhJsTbAADl4gbHahzhlILW%2B1JiU%3D [英语] Jeremy Keith [加拿大] 作者:Jeffrey Sambells

JavaScript DOM 编程的艺术(第二版)作者:Turing 38.6 购买《JavaScript DOM 编程艺术》

推荐小红书,公认的学习js最好的书。在学习前端的过程中,每读一遍都会有新的发现,是一本让你在工作之余想反复阅读的好书。写的很清晰,所以也适合刚开始学习JS的朋友。

2b4f75dafd0b44e381586a0f939acb53~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=iqKc6PdXTKXuiSSXaCQ3hupwC%2FY%3D[美国] 作者:Nicholas C. Zakas

《大风犀牛书》(《JavsScript高级程序设计(第三版)》)不建议初学者直接学习。本书类似于字典,可以让你根据需要查找相关内容。

JavaScript高级编程第3版JS入门大师书JavaScript权威指南包69.8 购买

这一阶段建议学习时长:

1个月这部分需要大量练习。建议初学者熟悉每个案例并反复练习。这非常有效。

b9685ce0a3c44aa0a45f993ca617ed9b~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=VgqPmxX8Hgq1H0mGwYR7h%2FYw0As%3D

3、框架学习

要学的内容:

目前主流框架:Vue/React

了解MVC 模式。目前最流行的框架是Vue/React。选择这两者之一并适应它。了解数据流和组件使用。

学习方式:

选择您想要完成的项目目标。我们建议您先观看视频,然后参考官网根据您的项目需求使用组件。

如果你想轻松上手,我们推荐Vue。学习路径平缓,社区丰富,官方文档也非常简单明了。

建议学习时长:两周

随着前端的发展,针对市场需求,各种框架相继出现。不过,你需要明白的是,框架解决一个需求,打好HTML+CSS+JS的基础才是基础。

我不建议学习Jquery 只是为了以防万一你真的需要它。 Jquery 已经过时了。

85131c31753f4bf9ac4bde7088cab95a~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1720792037&x-signature=cwGtOE9WGE4r5BjtryTL6OujYWg%3D

4、其他:

Node.js 请先了解。

我暂时不会详细解释Webpack,所以直接使用它即可。

Git 很容易使用。

————

前端是对所有编程类别的精彩介绍,但它还有更多内容。最重要的是自学过程中要有良好的自控力,出现问题时及时调整。最好有一位专业的朋友或老师可以回答您每一步的问题并参与设计您的学习路径。如果没有,你也可以加入更多的交流群进行交流咨询(搜索“HTML”、“Vue”等关键词,你会看到有很多交流群)。

祝大家都有一个美好的未来。

版权声明:本文由今日头条转载,如有侵犯您的版权,请联系本站编辑删除。

猜你喜欢