关于我自学前端三大件然后写了个项目这件事。
介绍详见这篇文章
起因
我从2015年开始，时不时地会使用网易云音乐的歌词图片功能分享一些歌词，然后传到空间的某个相册里。时间久了，也便成了一个习惯。
最早的网易云很朴素，没有那么多乱七八糟的跟音乐无关的功能。歌词海报亦如是。淡淡的米色背景，固定高度的封面图片，这应该就是网易云最早的歌词海报样式了。
2015年12月网易云音乐迎来一次更新，替换了歌词海报的样式。方形的大尺寸专辑封面成为了这一版本的标志。背景的米色也换成了白色。
2016年10月左右，网易云的更新带来了新的歌词海报功能。增加了数个新的海报样式外，同时也再次修改了默认的样式。给海报加了内容边距。
后来发现还有一个叫做“宝丽来相纸”的样式。导出的图片尺寸是正方形，背景由专辑封面撑满。中间是类似相纸的内容区，加之为背景添加了模糊后，美观的同时易读性也得到了很好的保障。从2019年4月开始，我上传至相册的歌词海报就一直使用宝丽来相纸这个样式了。
然后，2019年11月网易云又双叒叕更改了歌词海报的样式。在没加什么新东西的基础上，还把宝丽来相纸的模糊效果去掉了，替换成了灰黑色的半透明背景！虽然专辑封面是都能被看见了，但是歌词文字的易读性一落千丈，经常会与背景产生干扰。
于是，我每次想要生成歌词海报，都要先保存专辑封面，然后用Snapseed给专辑封面加一层模糊效果，之后再在网易云歌词海报中把默认图片替换掉……这也太麻烦了！而且，原来的宝丽来相纸是让相纸区域的背景模糊，我这样做会让全部的背景都模糊，感觉没有之前的好看。
之后，我又将网易云退回了修改这个样式之前的老版本。
后来我开始使用Apple Music。当时虽然没有分享歌词图片的功能，但是它的歌词界面本身就很好看！不愧是果子。所以我又开始截图AM的歌词界面，作为新的歌词海报样式。
Spotify和AM后来都支持选中歌词分享图片的功能，并且样式都还算好看。但是这两家音乐平台都有个大问题，生成的歌词图片不能保存至本地，只能分享到社交平台。两家平台又不打大陆市场，所以能分享的社交平台只有Twitter、Instagram这样的。
原来能用的改了样式后我不喜欢，新发现的平台又不易于使用。
最后,去年11月左右的时候，我决定自己写一个歌词海报生成器。
开工吧
一月放寒假回家后，我开始着手考虑这个东西。
话虽这么说……我根本不会写这个啊！
所以我让我的学计算机专业的朋友同学帮我写一个（不是）
这显然不是一个正确的做法，因为并不是每个人都像我一样日日摸鱼。而且我也不知道写这个要用什么、工作量怎么样，即使我想支付报酬，也并不现实。
所以我找了我另一个学计算机专业的朋友FFFeather同学帮我写（好屑啊这个桜庭夜）
他欣然接受了我的请求，看起来他和我一样天天摸鱼。但是他表示自己不会设计样式，设计出来的话可能会是像这样，所以让我设计一个网页的样式。
话虽这么说……我根本不会写样式啊！
虽然好像听过html和css这样的东西，嗯……这些是什么意思来着？高中时的计算机考试题库里好像有这些名词。总之我并不知道写一个网页样式需要什么东西，于是我选择使用Photoshop做一个出来（认真）
FFeather建议我去看一些bootstrap的内容，但是我选择先看HTML和CSS基础，因为我根本不明白Bootstrap是什么东西。
然后我开始写css样式。
最让我费心和开心的就是写这个类AM歌词界面的歌词选择区域的样式。不知道有没有容易的方式实现，但是我写的真的很麻烦。
花了大概一星期的时间把样式写了个七七八八出来。期间经历了不会用Bootstrap所以先随便写，然后发现手机不适配，所以又回头去套Bootstrap然后把样式改的乱七八糟。
嘛，总之费了些功夫，从零开始学HTML和CSS，把样式搞了出来。里面所有内容都是固定的，没有额外功能，就像是拿CSS画了一幅画一样。
之后的功能准备让FFeather同学来帮我实现。
算了，在家也是闲着，虽然我记得我立的“写文章吹无职转生”的flag还没拔，但是我准备先完成这个歌词海报生成器。没错我真的记得这个flag，我真的会拔啦。对了，我还记得当年立的“写《朝花夕誓》观后感”的flag，到现在也没拔，看了下时间，已经一年多了。
再从零开始学习JavaScript，再之后接触到了JQuery，嘿嘿，JQuery真好用。
期间整了一个网易云音乐API，虽然完全不知道什么原理，但是能返回数据能用就可以了吧！
让我想想，给网页加功能的时候解决了什么问题。
-
搜索返回结果的歌曲与其专辑封面不匹配
-
生成海报高度自适应内容
-
海报的歌曲信息位置不正确
-
重新调整了一下样式结构
-
获取歌词
-
加了点动效
-
保存图片
-
GitHub连不上（未解决XD）
无法保存模糊滤镜的样式，是受截图依赖html2canvas功能限制。我自己也不会写这个功能，所以有解决的办法请大佬们告诉我吧。
搜索框上面的图片是FFeather同学加的，执行搜索的时候会跳一下，并在控制台输出一个颜文字，真的很可爱。
前日生成了一张海报，发到空间里去。大佬看到后说日文字体不行，经过他推荐后新增加了MS-Mincho这个字体。
本来想照搬网易云原宝丽来相纸的样式，但是Spotify和AM的样式我还挺喜欢的，于是就设计了一个结合两家的海报样式。最初设计的歌词海报并没有底部的信息栏，但是最后决定换成了模仿AM歌词图片，感觉还算好看。
终于做完了后，FFeather同学叫我给项目起一个名字。我本来想说「LyricsPoster」这个直观的名字就很好，但是他坚持说要起一个高端的名字。相信我，我真的是中二一下随口一说，一分钟都没有考虑，就起了「TAiONS」这个名字。哈？你问我为什么“i”是小写？废话，那当然是看起来很中二才这样设计的啊。
用了大概20天的时间，在寒假里把这个东西做出来了。
结语
起初还设想了一些功能，比如说随机一首歌曲、随机生成样式、自定义歌词、更多的可替换样式……这些功能最后都因为麻烦和不会写，被我放弃了。说到底TAiONS只是一个写出来为了满足我个人兴趣的工具，并没有考虑到太多的东西。如果以后还有兴趣和时间的的话，或者我又想到了什么新的东西，届时在做考虑吧。
从零开始学习这些东西，然后有一个项目作为目标，一步步实现功能和样式，最后做出来结果，倒是个很有趣的过程。
我对代码和程序也抱有兴趣。回想起来高考填志愿的时候，曾选择了计算机和外语作为我的主要志愿，但是最后碍于我尴尬的分数，都未能如愿以偿。
然后大二的时候报了日语作为辅修，然后现在又折腾出一个TAiONS……兴趣的驱动力真是强大啊。
所以说这两样东西带来了、又代表了什么东西吗？我想并没有，只不过都作为在学习我不怎么想学习的专业的过程中，一些令人舒一口气的安慰罢了。
但是所谓学习本身就是这样一个东西。我高一的英语老师说过这么一段话，
学习快乐吗？我认为快乐学习都是假的。学习本身就是一件非常枯燥的事情。只有枯燥的学习，才能在你得到结果后，带来如沐甘雨的感受。
我喜欢的两个频道，影视飓风与王骁Albert，他们的slogan是“无限进步”与“变得更强”，虽然是很普通的、也不是什么成语的词汇，但却感觉是一种很充满理想和烂漫的事情。
或许我的英语老师她并不是这样说的，但是我也相信“学习的过程就是一件枯燥的事情”。它给我带来的东西是有快乐，但也有很多比快乐更难以描述的精神上的满足。这可能包含了我的自我安慰，但也一定包含了许多真正的、不同于快乐的意义吧。
这就是关于我从零开始学习前端三大件最后写了个歌词海报生成器这件事。
过去一个月有点忙，居然现在才看到这个，好强！
这个项目用到的技术如果放在我当初大学的HTML5课上，大概已经可以作为一次课程结课项目了。初学的话能做到这种完成度相当了不起。
话说，我在用的时候遇到了一个feature (?)。在搜索结果里，有某些歌（例如绊爱的Hello World（别问我为啥会搜这个名字））点标题和点封面之后蹦出的歌词居然是两种不同语言的版本，好奇是怎么实现的
不管怎样，确实兴趣是最好的老师，通过做这种做小项目的方式入门前端开发和设计挺不错的，小V就是我的第一个个人项目（当然当初不长现在这样）。
嘛，如果想要实现什么功能或者设计的话，尽管跟我说，我很高兴能够帮一把。毕竟当初我前端也是自己一步一踩坑过来的，我很清楚前端那堆坑有多烦
被大佬称赞了！开心！
没错，这就是个feature。网易云音乐歌词的API里有歌词和翻译歌词(如果有翻译可用），所以很容易实现。另外我还把原歌词加在了翻译歌词下面，以便能同时选择原歌词与翻译歌词。本来是想要像APP里面那样，一句原歌词一句翻译歌词的呈现方式，但是看了下api返回的内容觉得无法实现
兴趣的驱动力确实不容小觑。Velas电波站的设计我特别喜欢！我觉得自己设计和实现一个网站实在是一个再酷不过的事情。
目前歌词海报生成器经过几次小修小改，目前已经没有更多想要的功能啦（毕竟只是自用的嘛）总之，谢谢Zeee~
是大佬！ui好好看
谢谢(*°∀°)=3
提前祝桜庭夜新年快乐~~
也祝你新年快乐哦~
大佬太强了，没能怎么帮上忙感觉很抱歉，其实我才是天天摸鱼的那个吧！好吧希望我也能有这么强的行动力。提前预祝新年快乐！
过年了就要好好摸鱼！新年快乐~
不错
好强的行动力！我自学的已经全部忘掉了！
嘿嘿，以后就能拜托你写主题了！
诶……写主题应该不是我这些半吊子功夫就能做的事情