如何创建Shopify App插件?或许只需要7天

创建Shopify没有我们想象中的困难。静下心来阅读这篇文章,让你对Shopify改观!

自从成为顾问以来,我遇到了各种 奇怪的开发请求来自客户。其中,最有趣的一个顾客想要一个定制一个100% 兼容 Windows和Windows XP的模板。并且他们有提出200美元的预算。

谢天谢地,好在这不是针对我的。

并不是每个客户请求都是奇怪的。有些请求对我们来说听起来很确实很不现实,但是这确实也是根深在顾客心中的痛苦。

或许,他们的团队有着独一无二的工作方式。又或许他们疯狂的想法会为他们带来巨大的便捷与价值。我们不应该忽视那些听起像是在“无理取闹”的请求,特别是当客户明显是深思熟虑过后提出的想法。

我听说其他Shopify用户谈论他们收到的奇葩请求,客户想要制作定制的Shopify商店。某些人听起来可能觉得这是个疯狂的需求,但对我来说这就像今天要加班一样再普通不过了。

今天,我写这篇文章,向您展示创建自定义Shopify商店并不是那么的困难。事实上,它甚至可能是您客户的最佳选择。

为何要制作Shopify App?

通常,客户想要通过App来试图自定义主题,通常会去App Store中去下载甚至10个App来达成目的,但并不是每次都能如愿进行。

要么他们需要的功能超出主题功能时,App Store应用程序只提供通用解决方案,但这很可能并不是他们心中的最佳方案

如果您所做的只是创建Shopify主题, 当我们遇到一个请求感到困难时,其原因之一是因为我平时开发处于们自己的舒适区。那么您将要解决客户问题、达成客户要求都会给你带来紧张和困难。

对于后端开发人员,前端开发人员以及其他已获得专业知识的人来说,情况也是如此。

我们的自然反应是找到我们以往使用的工具来解决客户的问题。有时我们甚至都不知道有更好的工具。

开发App不会很难吗?

的确不难看到有团队用几个月甚至几年的时间 开发一款App、但是一个月甚至几天的案例也有数不胜数,既然你点进来了、既然你看到这了我相信你会有做下去的决心,下面我将介绍我制作的第一个公共Shopify应用程序  Dripify的过程。 (参考文章 https://dzone.com/articles/how-to-build-a-shopify-app-in-one-week

我从0开发Dripify的过程

虽然Dripify是App Store中的公共应用程序,但过程也可用于为构建私有应用程序。使用这个公共应用程序作为一个例子的好处是,我可以对流程中的每个步骤开放给你们参考。

当我开始使用Dripify时,之前我曾经使用过客户端应用程序,因此我对Shopify的API有所了解。不同之处在于所有这些应用程序都是现有的应用程序,我正在改进或修复一个可用的代码库。

创建Dripify,我不得不从头开始。我必须创建并拥有它的每个部分,从身份验证到支付到用户界面。

最重要的是,我为自己设定了计划。我将为Dripify的开发投入一个工作周,并推出它,功能齐全,并在周五下午之前发让商家安装。

规划阶段

在我计划的开发周前几天,我坐下来准确地确定应用程序该做什么。我创建了一个  Trail Map,这只是我对软件开发路线图的奇特名称。在其中,我回答了以下每个问题:

  • 这个应用程序的目的是什么?
  • 将包括哪些功能?
  • 这些功能需要多长时间才能构建,以及日程安排是什么样的?

用我的Trail Map回答这些问题至关重要。虽然这用了五天的时间,但是我现在做的任何事情都可以减少开发时间,这将是有益的。

1.确定此应用程序的目的

这个应用程序的目的是什么,最重要的问题,以及你应该在其他任何事情之前考虑的问题?你为什么要建造它?它如何帮助商家或您的客户?

你问问你的客户。

您需要确保通过后续问题探讨他们的回答。您希望尝试发现其请求的根本原因,并与应用程序背后的业务原因联系起来。您的客户端对话可能如下所示:

客户:我们想要一个为这些产品添加自定义折扣的应用。 
你: 为什么那些产品? 
客户:这些是我们需要关闭的。 
你:你为什么要关闭那些产品? 
客户:他们卖得不好,我们需要仓库空间来换新产品线。 
你:一旦你有一个自定义折扣应用程序,你将如何推广它们或关注它们? 
客户:嗯……它们会更便宜所以人们会买它们。 
您:即使有自定义折扣,这些产品仍然不会在您的产品目录中被发现。为什么不进行一些定制定价的闪购活动,我们会在一天内大力推广每一个?这样你就可以在几天内卖掉你的库存。

有时候,就像上面这个例子中一样,当你发现潜在的原因时,你可能会发现他们想要的东西与他们需要的完全不同。这种需求成为应用程序的目的。

如果该应用程序不适用于客户端,而您正在构建它以在Shopify App Store上公开销售,则需要进行一些市场调查以发现相同的需求和需求。您可能需要与几十个商家交谈或收集他们过去曾写过的问题的笔记。

无论来源如何,都要完善目标,直到找到易于理解的东西。对于Dripify:

“这个项目的目标是建立一个Shopify应用程序的MVP版本,允许Shopify商店轻松设置他们的Drip帐户。”

此目的成为您将用于开发的过滤器。您只想处理直接支持该功能的功能或允许您构建这些功能的功能。任何事物和其他一切都应该被搁置或延迟。

2.创建功能列表

在确定了应用程序的用途之后,您需要集体讨论要构建的功能。在这个阶段,使用您可以写下您拥有的每个想法。不要限制自己或担心你的日程安排。你想要尽可能多的想法,而不是关注它们的质量。

一旦你有一个功能列表并完成头脑风暴,就该进行评估了。将每个想法与您的应用目的进行比较,并且仅保留实现该目的的想法。

记住,你想要一些小而简约的东西。您可以随后返回并在构建第一个版本后展开应用程序的功能列表。

对于客户,我喜欢将其构建为最小的第一阶段。第一个版本不会很完美,但它会让客户现在更快地使用它。每次我这样做,客户都意识到他们的许多“必备”功能被推到第二阶段,实际上并不需要。

3.使用其他人的工具

随着Trail Map的完成,我准备开始开发了。

星期一早上,我启动了我的开发环境,打开了一个空白的代码文件,并开始尽快打字…

实际上,没有。我没有。

有了这样一个受约束的时间表,我不想从头开始写完所有内容。相反,我开始寻找一些现成的工具和库来加快速度。

Shopify本身提供了许多集成库,自从我在Ruby on Rails中开发以来,我就能够利用他们出色的`shopify_app`库。该库与Ruby on Rails集成,为您提供应用程序框架,并为您处理了大量集成。

在开始开发之前,即使在规划阶段,也要尝试将一些工具和资源集中在一起,以进一步减少工作量。尽量不要计划使用未知库的开发工作流程。

发展阶段

1.设置App身份验证 

有了一些现成的工具,我已经准备好开始开发了。

所有应用程序开发人员需要做的第一件事是与Shopify的身份验证和授权系统集成。shopify_app库有助于此,但仍需要进行相当多的配置和测试。

Shopify使用两种方法进行身份验证/授权:

  • OAuth,或
  • 私有App API密钥和密码

OAuth被所有公共App Store应用程序使用,并为商家提供安全可靠的方式来使用Shopify授权您的应用程序,而无需向您的应用程序提供其商店的用户名和密码。

另一方面,每个商店都能够创建私有应用程序,其中包括API密钥和密码。这些应用程序使用的API​​账号和密码可以访问它们来自的商店。

由于Dripify将成为一个公共应用程序,我不得不使用更复杂的OAuth。即使有shopify_app帮助,以及Shopify提供的所有文档,获得正确的身份验证工作也可能是件苦差事。

但是,不要放弃让身份验证工作。尽管这是实际开发的第一步,但它是最困难的一步。一旦你弄明白,其余的开发都会很简单 (相对来说:)) 。

如果您遇到困难,请在Shopify论坛上搜索并在那里提问。通常,只需要一个简单的修复就可以解决身份验证问题。

2.不要创建私人应用程序

如果您正在为客户构建应用程序,您可能很想创建一个私有应用程序。您可以跳过OAuth,您的应用就可以立即进行身份验证。

但是我并不建议这么做。虽然它很容易设置,但您的应用程序将受到限制:

  • 您无法将其嵌入Shopify管理面板中。
  • 要与多个商店共享应用程序,您必须自己创建所有代码或托管应用程序的多个副本。
  • 该应用程序具有对商店的完全读写访问权限,这可能是一个重大风险。

我建议您使用OAuth,创建一个类似于公共App Store应用的应用,但不要列出它。我称这些不公开的应用程序。

然后您的客户端可以像其他应用程序一样安装应用程序。

为了获得额外的保护,在应用安装过程中您可以检查商店URL,如果它不是您客户的URL之一,则可以拒绝安装过程。对于shopify_app,将类似下面的代码放入sessions_controller.rb:


class SessionsController < ApplicationController
  include ShopifyApp::SessionsController
  before_filter :check_allowed_shops, only: :new
  private
  # Checks that the shop attempting to login (starting OAuth flow) is allowed
  def check_allowed_shops
    if params[:shop].present?
      if allowed_shops.include?(params[:shop].gsub(".myshopify.com",""))
        return true # Allowed
      else
        redirect_to login_path
        return false
      end
    end
  end
  # Domains of shops to allow.
  #
  # The myshopify.com subdomain without the myshopify.com part
  def allowed_shops
    ["shop1","shop2","shop3"]
  end
end

虽然考虑使用哪种身份验证模式很重要,但不要过于担心。您可以稍后在OAuth和私人应用身份验证之间切换。您需要迁移数据并进行一些配置更改才能使其正常工作。

3.OAuth工作

使用OAuth时,您想要获得的一个配置是范围。范围是Shopify用于允许您访问特定API的范围。

如果您没有选择正确的范围,稍后在尝试访问它们时会遇到问题。弄清楚API不起作用的原因并不见得容易,特别是当您忘记在几天(或几周)之前添加范围时。

有了Dripify,我知道我只需要访问两个示波器就可以为我的客户安装Drip。一个用于读取主题模板的范围,另一个用于读取这些模板。

一旦我的OAuth配置设置完成并正常工作,我就可以开始研究实际的应用功能了。

4.谁需要用户帐户?

在Trail Map中,我计划添加用户帐户以及为商店管理它们的方法。这样,商家可以让团队中的任何人访问Dripify。

在使用OAuth之后,我意识到这个功能根本不会为商家增加价值。

OAuth阻止了未经授权的用户访问该应用。商店用户必须能够访问Shopify管理员才能访问该应用,这意味着他们已经拥有Shopify中的有效帐户。由于我并不真正关心哪个用户将Drip片段安装到商店,因此无需将不同的用户帐户分开。

最后,我完全删除了用户功能。这不仅节省了我大约半天的开发时间,还减少了商家在应用程序中必须进行的管理。现在,应用程序的用户界面可以专注于安装Drip片段。

专业提示: 即使开发已经开始,如果能够提供更好的应用程序,请更改您的计划。更多地关注去除功能而不是添加新功能。

5.Drip API集成

有了这个重新关注的焦点,我知道我需要简化代码片段安装。幸运的是,安装Drip是一个简单的过程

我可以要求商家登录Drip,找到他们的帐户ID,然后让他们将其复制到Dripify中。这会奏效,这会让我的工作变得简单。

但是有很多可能会出错。此外,要求商家登录其他网站并手动复制数据并很友好的。请记住,此应用程序的目的是让用户“轻松设置他们的Drip帐户”。

我决定坚持我的计划并尝试自动完成。

与Shopify一样,Drip也使用OAuth来允许应用访问帐户的信息。这意味着我可以设置Drip的OAuth,并可以访问商家所需的内容。

但是有一些问题。

6.创建API的麻烦

首先,由于我已经在Shopify中使用了OAuth,我需要整合两者以便它们可以共存。像OAuth这样复杂的东西,这是一个技术挑战。

幸运的是,用于OAuth的库“shopify_app”允许配置多个OAuth提供程序,因此我可以在同一个应用程序中同时使用Shopify和Drip。有几个地方他们交叉,我必须仔细跟踪每一个,但在大多数情况下,他们融合很好。

第二个问题是Drip的OAuth是新开发的,以至于我没有可以下载和使用的现有库 – 我必须自己编写。

编写一个新的低级库并不是我真正想做的事情。当发生类似的技术问题时,存在重大进度影响的风险。此代码没有直接为我的用户增加价值,它只支持更高级别的功能。

值得庆幸的是,我可以使用其他OAuth集成的许多示例来获取灵感。通过其中一个集成,我只能更改少量代码,并开始使用Drip。

我现在成功连接到Drip。

不过,我的兴奋只持续了几分钟。

与Drip集成的全部内容是为商家自动获取帐户ID。当时,Drip的API非常新,他们没有任何API方法来获取该帐户信息。

拒绝被卡住,我联系了Drip的联合创始人并询问我能做些什么。几个小时后,他回复了我可以使用的全新帐户API。成功!

毕竟,我能够通过Drip对我的商家进行身份验证,并获取我需要的帐户数据。

即使我烧了很多时间,我仍然有一个后备选项:最糟糕的情况,我可以要求商家登录Drip并为我复制他们的帐户ID。这是行不通的的,它会伤害应用程序。

专业提示: 当你在使用应用程序时,不要在问题出现时被问题所蒙蔽。尝试给自己一个后备选项,解决方法或其他一些方法来解决问题。通常有多种方法可以进行任何开发。

7.降低风险特征的风险

通过Drip身份验证和手头的帐户信息,剩下的就是将其添加到代码段并将代码段安装到主题。

这导致应用程序的第二个风险部分。

由于Drip需要安装到每个页面,这意味着我必须将片段放入`layout.liquid`文件中。该文件几乎被Shopify商店中的每个页面使用。

这意味着为了自动安装Drip,应用程序必须自动更新模板文件,而不会破坏网站上的所有内容。

谈到这一点,我知道我可以做三件事来降低风险:

  1. 在更改任何内容之前,应用程序将制作模板的备份副本,以防需要还原。
  2. 围绕此替换代码的一系列单元测试将确保它可以与许多不同的主题一起使用。
  3. 围绕其他故障情况进行一些手动测试可以让我找到并处理任何其他问题。

最后,经过数十次自动和手动测试后,我确信片段安装会起作用。我发现的唯一失败案例是代码段多次安装,除了在网页上添加一些额外字节之外没有任何影响。

通过围绕这一高风险功能进行自动化测试,我可以确保它将来继续发挥作用。

一周够了吗?

随着代码片段安装工作,我在星期四下午2:44完成了开发。这给了我一整天的时间来测试生产版本并进行另一次详尽的代码审查。

从头到尾,Dripify的第一个版本需要25.5小时来开发和部署。这包括所有开发,自动化测试,手动测试,设置生产服务器以及正式启动它。

虽然我没有把它作为开发周的一部分,但是在接下来的几周内又花了六个小时的时间来准备并将Dripify带入App Store。其中大部分用于撰写销售副本,营销材料,并与Shopify的应用团队合作以获得Dripify批准。

经验教训在一周内创建Shopify应用程序

在整个故事中我有一些重要的观点,但我想现在回顾一下,让课程更清晰。

Shopify App开发只是另一项可学习的技能 – 如果您有开发经验或访问它,构建Shopify应用程序并不是那么困难。Shopify应用程序开发有其难点,就像任何软件开发项目一样,但它并不是一项你需要学习的全新技能。如果您可以开发Web应用程序并使用REST API,则可以构建Shopify应用程序。

构建一个小型,专注的Shopify应用程序可能只需要很少的时间  – 如果您的客户需要构建自定义应用程序,并且您能够与他们密切合作,这也是如此。根据他们的需要,你甚至可能发现你可以用比Dripify更少的时间创造他们需要的东西。我之前在两小时内创建并测试了一个简单的私人Shopify应用程序。

深入了解商家实际需要的东西 – 无论您是为客户建立还是为App Store构建,都要花时间去发现商家真正需要的东西。不只是表面层面的需求,而是实际的业务需求。你可以做得更好,你的应用程序获得成功的机会就越大。

创建一个计划,然后尽可能地削减 – 一旦你发现了需求,花时间计划你将如何实现它们。将功能列表与估计值放在一起。尝试尽可能地删除或减少它们,同时仍然解决应用程序将构建的核心问题。

给自己选择计划中有风险的部分,这样你就不会陷入困境 –  对于计划中任何有风险或高度不确定的部分,如果你的计划不完全符合,那就集体思考如何改变事物的一些想法。知道如果需要你可以回退到这些将使你灵活地处理将要出现的开发问题。

如果你能更好地为用户服务,不要害怕改变你的计划  以类似的方式,准备完全抛弃你的计划的一部分,这些部分不会让你更接近应用程序的最终目的。这可能意味着像我一样删除功能,或者可能更改核心工作流程以使用户更容易。

记住你的目的

最重要的是,始终牢记最终用户。Shopify应用程序是出于某种目的而构建的,通常以某种方式使商家受益。如果你可以对他们有同情心,并且总是通过他们的视角看你的应用程序,那么它会更好。

1

评论0

没有账号? 注册  忘记密码?