查看: 36|回复: 1

[其他] 聊聊如何高效的学习开发(前端)

[复制链接]
1天累计签到
1天连续签到
初来乍到

4580

主题

11

回帖

4万

积分

总版主

名望
0 点
星币
9190 枚
星辰
0 颗
好评
2 点
发表于 3 小时前 | 显示全部楼层 |阅读模式

注册登录后全站资源免费查看下载

您需要 登录 才可以下载或查看,没有账号?立即注册

×


首先简单阐述一下,在读这篇文章之前,你需要知道的是1.这是我迄今为止自己的学习方案,并不代表适合所有文
2.可能存在错误,欢迎指正。
那么ok,先来聊聊怎么学习
1.前言
首先要知道的就是,你需要对你所学习的东西感兴趣,而不是为了应付。
就好像我的专业是电商,但是我并不喜欢,单纯为了应付,所以我对电商的概括就是 开网店
所有的东西的学习都是需要感兴趣,才是最重要的一点,如果你对某一样技能不感兴趣
但是又好奇的想学,那么你就会出现很多很多很多的,就例如我之前对前端这一块不感兴趣的时候
在网上找的教学视/频借口就多了,例如这个老师声音不行,例如讲的太枯燥,例如我不会英语。
2.学习方法和路线
就从我自己感兴趣的前端开始
先讲讲前端路线
第一步 那么你先要学会的是html5 html5的标签大概有几百个,但是常用的标签很少很少,真的很少,
就例如我常用的:div button input a img 其他标签用的都很少,
那么问题来了,学会这几个就行吗?
不行 你需要对其他的标签有一个了解,不然你都不知道有什么作用,记不记得住,无所谓,野生开发者像我,面向搜索引擎CV编程


第二步那就是CSS
CSS我个人理解,最为重要的是布局其次就是定位,布局很重要 flex布局真的算是重点了,值得反复学习,其余的常用的就是 宽 和高 颜色 字体大小这一类,然后在深入探究学习其他的属性,难吗?不难!


第三步那就是非常枯燥的JavaScript
他确实枯燥,我看了200多集视/频学DOM基础。
需要英语水平高吗?理论上来讲,如果你的英语能力强的话,学习这个会比较轻松!
如果你能坚持看完JavaScript基础,那么其实到最后,你敲代码会很有意思,讲究的是逻辑性!
第四步,学习jQuery


这是一个JavaScript的库
学习它之前,你需要学习JavaScript的基础语法和规范。
学习完了jQuery你就会知道,原来写JavaScript代码也能这么优美~


然后 可以学习1-2个css框架
这边推荐两个。一个是MDUI 和 TailwindCSS
可以先学习MDUi 再去学习TailwindCSS 就可以发现两者的区别。
后面再去学习Javascript框架,例如对中文友好的Vue(很强大)
路线讲完了,那么讲讲怎么学习吧


我先说说我用什么工具:


1.Vscode 插件多 代码提示很强大,对中文友好
其他暂不细讲


如何学习?
我个人推荐是:


哔哩哔哩 看教程视/频,不要乱看
最好是几百集起步的那种。因为能帮你从浅到深!
这边推荐UP主
「黑马前端(原来叫黑马程序员pink老师,因为太火了私号公用了)」


看文档!!看文档!!看文档!!
文档永远都是最重要的!W3C的文档的标准,规范,写的都非常清楚!
不论是CSS的文档还是Javascript的文档


做笔记,这边可不是说单纯截图放到备忘录里
我个人的建议的 买个笔记本 厚点的,买两支笔
不懂就抄写来


然后就是买书,其实前端来讲,买书的很少,建议学习后端例如PHP的时候买(我买了)


然后就重要的就是 思路/原理/逻辑
举例:
例如JavaScript的例子 点击 按钮 把 “你好” 显示在屏幕上
我们先用原生代码写一下:

  • <button>点我</button>
    <p></p>
    <script>
    var btn = document.querySelector('button');
    var p = document.querySelector('p');
    btn.addEventListener('click',function(){
    p.innerText = '你好';
    })
    </script>

复制代码
看不懂吧?
没关系,我们用中文来讲
button。也就是按钮
p 一个标签
JavaScript部分
定义 btn 为 获取到的button 按钮亓素
定义 p 为获取到的 P 亓素


事件处理 当 btn 被点击的时候 触发事件 p.text值 变为 你好
很简单,逻辑很重要!可以拿着这些代码去试试。
思路 逻辑 原理 都有了,结合所学习的知识,就能做出来!
跟天赋有关系吗?借口罢了
跟会英文有关系吗?借口罢了
跟时间有关系吗?挤挤总会有的,借口罢了
没电脑可以学吗?也不是不可以吧。。。。
只要觉得这玩意对你有兴趣,学就行了
然后还有的就是,千万别光看不做
云学习 大可不必了
聊聊我 我没学习一个新标签 都会自己跟着做一下
每学习一个新css属性 都会自己跟着做一下
每学习一个新的JavaScript语法,都会跟着做
例如我发的几个演示
然后就是总结
学完html 那么你就用纯html 做个小demo出来
学完css。那就用 html + css 做个demo出来
学完JavaScript 就三者结合做出一个項目
自己学的怎么样 自己做了才知道 不做 永远都是学不会。
先讲到这 有空再更新
默认签名:偏爱是我家,发展靠大家! 社区反馈邮箱Mail To:[email protected]
回复

使用道具 举报

1天累计签到
1天连续签到
初来乍到

2

主题

1万

回帖

1万

积分

偏爱AI机器人

名望
0 点
星币
3131 枚
星辰
0 颗
好评
0 点
发表于 3 小时前 | 显示全部楼层
路线本身没啥毛病,html → css → js → 框架 这个顺序是对的,尤其你说“别光看不做”那句,比讲十个工具都管用。补几个你漏了但挺要命的点。

1、查文档首选 MDN,不是 W3C。前端日常遇到不确定的属性、方法,直接搜“MDN + 属性名”,中文版也有,例子能直接跑。W3C 那套更适合看规范定义。

2、JavaScript 别停在 var 和基础语法。ES6 之后的 let/const、箭头函数、解构、模板字符串、Promise、async/await、import/export 要专门过一遍,现在实际項目里写的基本全是这套,不补这块,学到框架会卡住。

3、jQuery 可以学,但摆正位置——它的价值主要在“看懂老項目”,新項目基本走 Vue 了,别在这上面耗太久。

4、练手别攒着。不用等一章学完,每学一块就去仿一个小页面:仿个登录框、仿个商品列表,做完用 F12 的开发者工具对着原网站比差距,比看视/频快得多。

5、工具链补上:Git 基本命令(clone、commit、push、开分支)、浏览器 F12 的调试面板(断点、看请求)、npm 和 Vite。这几样不会,代码写得再好也拼不成一个能跑的項目。

英语你说得对,不是门槛,但常见的报错得能读个大意,几十个高频词混个脸熟就够了。

这帖对新手挺有用,等你的后续更新。

以上内容由论坛 AI 助手自动生成,仅供参考。
默认签名:偏爱是我家,发展靠大家! 社区反馈邮箱Mail To:[email protected]
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关注公众号
Archiver|手机版|偏爱技术社区-偏爱技术吧-源码-科学刀-我爱辅助-娱乐网--教开服-游戏源码

相关侵权、举报、投诉及建议等,请发 E-mail:[email protected]

Powered by Discuz! X5.0 © 2001-2026 Discuz! Team.

在本版发帖
关注公众号
返回顶部