从辅助项目到完成的应用
Pankaj PatelUnsplash拍摄的照片

将想法转变为最终项目到完成的应用程序

每个开发人员都应尝试花一些时间进行辅助项目,以提高自己的开发技能或满足他的创造力需求。 从事全职工作可能很难,但是附带项目的好处在于您可以按自己的进度进行工作。 第一步是找到您想要进行的构想。 它可以是任何东西,但如果它与您的自身利益很接近,那么拖延将大有助益。
另外,请记住在开发过程中尝试和尝试新技术,因为它不仅可以帮助您推进职业生涯,还可以使其有趣直至结束。

当您有了最初的想法时,下一个艰难的步骤便是开始实际进行工作。 即使您实际上开始了该过程(对于大多数想法而言,您也不会这样做),您很有可能很快就会放弃该项目。 但是,会有一些值得追求的想法,可以尝试完成这些想法并从中获得乐趣。 这些想法之一是CookList应用程序。

日常使用的想法

我当时正在寻找一个副项目进行研究,但是我开始做的任何事情都因失去兴趣或纯粹的懒惰而很快被放弃。 我的某些想法过于复杂或需要大量工作(不容易单独完成)。 我试图找到一些与我的日常工作相关的东西。 我对音乐的最大兴趣之一是,因此,我试图找到与之相关的东西。 我也是Spotify的常规用户,因此,当我在线搜索并发现他们有一个可以处理其数据的API时,我立即开始对其进行研究,以得出应用计划。

从辅助项目到完成的应用
照片由Aaron BurdenUnsplash拍摄
不要害怕实际写下您的想法,这会有所帮助。

在对Spotify的出色且真正有据可查的API进行了一些研究之后,我想到了一个想法的根源,即开发一个可帮助用户根据喜欢的艺术家创建播放列表并发现新音乐的应用程序。 之后,我所做的就是在网上寻找类似的项目,以汲取灵感并找到新的东西。 有些应用程序确实与我最初设想的非常接近,而另一些最终提供了一些高质量的想法。 值得注意的是,最重要的是:

1. Music-Map是一个网络应用程序,可根据用户喜欢的乐队来查找用户可能会喜欢的乐队。 它是更大的发现系统Gnod或全球发现网络的一部分。
2. Everynoise是一个很棒的项目,它跟踪和分析来自Spotify的数据以生成所有音乐流派的散点图。
3. 播放列表是一个非常著名的应用程序,它基于用户将提供的单个艺术家/组在Spotify上生成播放列表。 您还可以搜索和收听其他人的播放列表。
4. Musicroamer是一个Web应用程序,可可视化您喜欢的艺术家之间的关系,并使用last.fm中的数据生成一个图表,该图表从用户将提供的单个组/艺术家开始。

以上所有项目都给了我启发,并帮助我微调了想法,创造出类似但又独特的东西。 这种想法的主要区别在于,用户将创建一个艺术家列表,该列表从他将提供的艺术家开始,然后是与该艺术家及其后续选择有关的艺术家。 此列表将用作播放列表的“配方”,因为他和其他用户随后将能够使用这些艺术家的随机曲目创建播放列表。 此外,关于艺术家精选以及播放列表的曲目的信息将相应地可视化。 这样,构建CookList的旅程就开始了(明白吗?因为它会创建“食谱”……哈)。

应用程式开发

接下来,您必须选择要使用的堆栈。 在前端部分,我在选择React(我只在一些教程/小项目中玩了一点)或Angular(这是我工作的主要框架)之间争论,最终我选择了Angular,因为我想签出Teradata的Covalent UI平台。 在后端部分,我试用了Spring-Boot应用程序的想法,但最终还是使用了NodeJS和Express Framework,因为它更适合于应用程序的需求。 至于数据库,我选择了MongoDB的安全选择。

我开始实施我的后端服务,以创建简单的端点,后来我知道这些端点将转变为实际的应用程序功能。 在这里可以说的另一个有用之处是,您不必从头开始制作所有内容。 搜索并重用其他人创建的内容,并尝试在其上进行构建。 当时, thelinmichael为Spotify的API提供了一个非常不错的NodeJS包装器,这是一个很大的帮助。 使用该代码,我开始创建用于搜索艺术家的端点,然后获取相关艺术家,然后获取特定艺术家的曲目等。一旦在端点中编写了非常基本的逻辑,我就知道可以开始实现简单的随附UI。

应用程序的UI部分是常规的Angular 6应用程序,但是正如我所说,我想将Covalent UI Platform与它一起使用。 该应用程序的第一个迭代仅基于Covalent的UI样式构建,但结果并不完全符合我的喜好。 虽然可以方便地使用Covalent平台的所有强大组件,但是它的美感太像仪表板而不是应用程序。 尽管我坚持了最初的决定一段时间,但最终,我删除了Covalent的大部分内容,然后将漂亮的HTML5 + CSS3主题从html5up转换为Angular代码。 此外,我希望能够创建一些可视化效果,以丰富我可以从Spotify端点获取的数据。 为此,我选择了功能强大的Echarts库,利用该库可以为应用程序构建漂亮的图表。

从辅助项目到完成的应用
Artem Sapegin摄Unsplash
咖啡,开发商的真正力量

开发继续完成了该想法的核心功能。 所需步骤可总结如下:

  1. 用户应该能够输入和搜索艺术家
  2. 搜索到的艺术家的相关艺术家将可供选择
  3. 随后的每个选择都会触发对相关艺术家的新请求(用新的/唯一的艺术家填充初始列表)
  4. 从选定的艺术家创建流行歌曲池,并随机选择其中的一部分。
  5. 如果用户想将生成的播放列表保存到他的Spotify中,请通过登录到Spotify并获取所需的访问令牌来对其进行授权。
  6. 在用户个人资料上创建播放列表,然后添加所需的曲目。
  7. 将创建的配方和生成的播放列表保存在MongoDB上。

经过最初的发展之后,其他想法也出现了,例如:

  1. 响应缓存( node-cache是一个非常强大的库)。
  2. 在MongoDB上为创建的播放列表存储曲目的功能,以便用户无需登录即可查看配方的图形。
  3. 存储和重新使用用户的刷新令牌,而不是每次都需要登录
  4. 基于体裁的标签过滤。

利用Unsplash的 API(以及他们自己的unsplash-js库)下载随机图像以设置为播放列表的封面。

应用部署

当以上所有步骤完成后,我对结果感到非常满意,我决定冻结新功能并继续部署应用程序。 我在网上搜索了有关服务NodeJS应用程序的选项,尽管在开发过程中我尝试了Heroku,但最终我还是选择了Google Cloud,它提供了一个不错的免费试用版本,您可以在首次购买时花费300美元一年,至少对于我想进行的测试来说绰绰有余。 最重要的是,由于我以前在AWS基础设施方面的经验,我也想检查Google Cloud,因为我对Google AppEngine的经验有限。 从那时起,我开始研究关于Docker和Kubernetes的知识,而我对这些知识知之甚少。过了一会儿,我可以构建应用程序的Docker映像,将其上传到Google的Container Registry,并通过Kubernetes使用gcloud cli工具将其部署到集群中。 。

从辅助项目到完成的应用
Guillaume BolducUnsplash拍摄的照片
不是那种容器

最后一步是使应用程序真正公开。 因此,我去了GoDaddy ,购买了一个全新的.app域,经过一番挣扎(.app域强制使用https,这是我最初不知道的结果,并导致了一些奇怪的情况) CookList已启动并开始运行,任何人都可以看到和使用。

未来的改进

此项目中可以内置更多的想法和功能。 对于21世纪的Web应用程序,最明显和最缺少的一个功能是诸如Facebook共享之类的社交集成。除此之外,核心机制的下一个重要功能是能够(根据用户请求并带有特定选项标志)进行混合沿着您未选择的艺术家/团体的曲目,但您很可能会喜欢。 另一个功能是能够找到相关的食谱(基于您选择的艺术家),并且能够像现在基于流派一样过滤艺术家的食谱。 某种其他形式的可视化或使用轨道特征数据的另一种方法也可能是一个好主意。 最后但并非最不重要的一点是,此应用程序也可以成为移动应用程序,既可以使用NativeScript之类的框架,也可以通过从头开始为Android和iPhone构建它。

总结

从辅助项目到完成的应用
Namroud Gorguis在《 Unsplash》上的照片
唯一的真实播放列表

根据Github的提交历史,所有这些工作花了我近2个月的时间,但是大部分时间我在工作日的工作量有限,因为我的大部分提交都在周末进行。 在那段时间里,我学会了使用新的UI平台,进一步发展了在NodeJS和MongoDB上的技能,熟悉了自己,并学会了将Docker和Kubernetes的基本功能与Google Cloud Infrastructure一起使用。 最重要的是,最后,我的工作被实现为一个工作应用程序,对此我感到非常高兴,我看到自己又回到了它,并根据我的想法或用户的要求实施了更多事情。
因此,我强烈建议大家也这样做。 选择您的下一个项目,由您自己或与朋友一起启动,开发功能,学习新事物,最重要的是,乐在其中。 如果上述所有内容都存在,那么您将从过程中受益匪浅,如果您到达终点线,那么您还将获得一些有用的东西,任何人都可以看到。

From: https://hackernoon.com/from-side-project-to-finished-app-2cd19de1d658

相关文章: