综上所得,我确定的任务和目标是:快速学习前端知识并在一个月内开发上线一款figma插件
Learn to develop a Figma plugin By using svlete
在 Figma 教程中发现几个不错的教程,不是长篇大论完全覆盖,而是以大纲为主,点到为止。考虑到自己的核心目标并不是成为一名专业的前端开发人员,仅仅是为了掌握这个能力来完成一些简单的项目,对里面的内容进行简单的学习,不像之前那样深入学习所有内容模块。
这个思想转变很关键,以前不是先明确要达成的结果,而是先学,大而全的学,但最后没有实际结果,学了和没学差不太多。毕竟大部分的知识不会重复使用,而只要不是重复使用的内容,就会被忘记。
在学习过程中,有一个很关键的点是在本地跑起来。这在后面的项目开发中也是,框架很多,可以用各种各样的方式跑起来,但哪个能最简单不出错就真的纯看运气了。
在开始学习前,找熟悉的开发朋友推荐了教程,最后选定为https://www.theodinproject.com/paths/foundations/courses/foundations,这个教程非常的棒,由浅入深,不仅仅有HTML+CSS+JS的内容,还含有如何使用Chrome进行调试,Github版本控制这些知识点
由于之前学过一段时间的HTML+CSS,所以很快上手,就没有细读这一部分的内容,简单的看完就过了,主要的时间都花在布局和JS上了
过程中极力使得当前的学习有用化,所以在学完HTML+CSS后,就开始跟着Figma官方的视频教程开始搭建页面https://www.youtube.com/watch?v=p-z566ILvxc&list=PLXDU_eVOJTx5YBAszyuOTyxlgIxkQVyii&index=5
中途遇到了不少的问题,包括无法引入https://github.com/thomas-lowry/figma-plugin-ds,花了不少的时间找答案,最后在视频的下面看到了官方的回复
<aside> 💡 一个小技巧,在哪里遇到问题就在哪里找答案,毒蛇出没之处,七步之内必有解药!
</aside>
在使用HTML+CSS搭建完页面后,发现有些状态无法快速获得,又想换成基于React的这款开源库https://yuanqing.github.io/create-figma-plugin/
看了官方教程https://react.dev/的案例,跟着试了一下,然后发现需要花费很长的时间才能很好的掌握,这与我的初衷不同,在咨询了朋友以后,毅然选择放弃,但也起码花了1天的时间学习里面的各种语法