da-dapps
由Blockstack支持的我们的分散式摘录应用程序开始整合在一起。 我们已经看到使用BlockstackJavaScript库Blockstack.js添加用户身份验证和基本持久性是多么容易。 本周,我们将添加命名片段的功能和保存多个片段的功能。 为了实现这一点,我们将不得不再次探究持久性,并展示一种稍微复杂一些的数据处理方式。
上周我们离开时,我们的应用程序直接打开了一个片段编辑工具,并将我们可能保存的所有工作加载到了snippet.json文件中,该文件已保存到Blockstack的分散式存储(也称为Gaia)中。 我们保存的文件是JSON对象的字符串化版本,如下所示:
{
"html": "<div class=\"message\">The rotat….",
"css": ".message { \n text-align: center;\n …",
"js": "const colors = ['red', 'blue', 'orange', …",
}
为了支持代码段的命名,我们将不得不稍微重构该对象。 我们可以简单地在其他字段旁边添加一个名称字段,但是随后将数据(例如HTML和CSS)和元数据(名称字段)混合在一起。 这并不是可能发生的最糟糕的事情,但是随着元数据包含描述,创建日期,上次编辑日期以及其他字段的增长,我们的对象在阅读时会变得有些棘手。 为了保持井井有条,我们将文件结构更改为包括名称字段和代码段字段,这将是具有当前属性的嵌套对象。
{
"name": "Rotating Color",
"snippet": {
"html": "<div class=\"message\">The rotat….",
"css": ".message { \n text-align: center;\n …",
"js": "const colors = ['red', 'blue', 'orange', …",
}
}
现在,我们要做的就是构建UI组件以显示和编辑代码段名称,然后就可以设置好了。
到目前为止,我们只需要处理一个片段,但是我们希望用户能够保存多个片段,并在选择一个片段进行编辑之前以列表形式查看它们的摘要。 我们拥有的一个数据建模选项是采用我们现有的代码片段JSON,并在其周围包装一个数组。 然后,我们可以将整个数组持久保存到一个snippets.json(请注意复数)文件,这将使以后在一个请求中轻松检索用户的所有代码段成为可能。 这种方法实现起来相对简单,但是有一些缺点。
首先,随着用户保存更多片段,该应用程序的加载时间将越来越长。 保存也将花费越来越长的时间,因为对任何代码段进行更改都将要求重写包括每个代码段在内的整个文件。 第二个缺点与下周将要进行的工作有关,这是使片段可共享。 下周我们将详细介绍,但基本要求是数据共享在文件级别进行。 如果要共享一个代码段,则必须将该代码段存储为单个文件。
由于所有代码段都位于不同的文件中,因此我们还需要所有代码段的索引,以便我们可以轻松向用户显示代码段列表,而不必全部检索它们。 该列表可能如下所示:
[
{
"name": "Rotating Colors",
"id": "7700d231-1d06-414c-84d1-ee96f10a2640"
},
{
"name": "Circle Designs",
"id": "a151d7f5-03ea-4c4f-acf2-683d2e3328d2"
}
]
然后,对于每个片段,我们将使用以列表中的ID命名的单独文件(例如,a151d7f5-03ea-4c4f-acf2-683d2e3328d2.json),以便我们加载它们并将其保存到正确的位置。 这种方法的一个考虑因素是,每当片段被重命名,创建或删除时,我们都必须更改两个文件。
下周,我们将介绍如何与该应用程序的其他用户共享数据,增加将片段摘要公开或私有的功能,以及启动我们的去中心化应用程序! 与往常一样,您会在GitHub上找到完整的代码来支持命名的代码片段和代码片段列表 。 有疑问或意见吗? 继续在Twitter上进行对话: @freethejazz 。
翻译自: https://www.infoworld.com/article/3376736/javascript-dapps-decentralized-lists-with-blockstack.html
da-dapps