首页 > 编程语言 >使用 Amplication 缩短 Node.js 应用程序的上线时间

使用 Amplication 缩短 Node.js 应用程序的上线时间

时间:2022-09-20 11:36:00浏览次数:155  
标签:Node Amplication 应用程序 js API UI GraphQL 我们

使用 Amplication 缩短 Node.js 应用程序的上线时间

Amplication Stack

使用任何技术开发任何应用程序都是一个复杂的过程。我们必须考虑很多事情,比如架构、使用哪些技术、哪些模块、如何正确维护它、我们需要使用哪些帮助库或第三方,等等。

在这里,我们将特别关注 Node.js 应用程序。正如我们现在所知,Node.js 使用单线程、异步和非阻塞架构,并且由于这些特性,它提供了很多灵活性、选项和库,我们可以开箱即用地开发任何应用程序我们需要的。另一个好处是它可以用于应用程序、前端和后端开发生命周期的所有步骤。

有了上面所说的一切,我们可以想象我们包含前端和后端的大量选项/工具/库和框架。其中一些工具/框架是 Express.js , 巢穴 , Fastify , 套接字.IO , 反应 , Vue.js , 管理JS , 类型ORM , 续集 , 棱镜 , EJS , 修女 ,并且列表可以继续。

有了所有这些可用选项,要选择最适合我们需求的选项非常困难和复杂。此外,即使我们已经选择了我们需要的框架和库堆栈,我们也必须在这个堆栈之上开发我们的应用程序,这不是花在开发我们的业务上而是实际开发应用程序以提供功能的时间我们的业务。

这是非常关键的,尤其是在一个旨在快速增长的初创公司中。

尽管上面提到的所有工具和框架都大大加快了我们的开发过程,但进一步减少这个时间很重要,这样我们就可以为我们的业务需求提供更多服务。

这是哪里 扩增 进入我们的帮助。 Amplication 消除了选择我们的堆栈的负担,它为我们提供了一个预定义的堆栈,其中包含许多可以随时使用并适应我们需求的样板代码。

什么是扩增?

Amplication 是一个开源工具,用于在几分钟内通过用户界面实现我们应用程序的前端和后端,包括 REST API 和 GraphQL。工程师需要做的是设计应用程序从 UI 工作所需的数据模型,并且我们应用程序的所有代码都是自动生成的,功能齐全,并具有集成的管理 UI。

扩增还为我们提供了 Dockerfile 对于管理 UI 和后端服务器,我们已经可以使用它们在我们选择的任何云提供商中部署我们的应用程序。

关于使用的堆栈,前端使用以下库:

如果我们选择在项目设置中生成 GraphQL API,则在 React Admin UI 上呈现的所有内容都是使用 GraphQL 从服务器获取的,我们将在本文后面看到。如果没有,它将使用 REST API。

对于后端,堆栈如下:

正如我们所见,所有使用的工具都非常流行,并且在 Node.js 社区中得到了很好的维护。

值得一提的是,所有代码都是在 TypeScript 中生成的,并且是完全可定制的,以防我们想要实现 Amplication 可能还不支持的其他功能。

使用扩增

我们可以在云中或通过克隆 存储库 并在本地运行。在这里,我们将展示如何使用云版本。

首先,我们需要使用我们的 GitHub 帐户登录。

Login Page

登录后,我们将看到以下页面,我们可以在其中选择是否要为后端生成 REST API 和 GraphQL API 以及为前端生成 Admin UI。我们还可以选择从头开始一个项目或使用已经预配置的订单管理项目。

在我们的例子中,对于这个演示,我将选择订单管理项目,我们将同时生成 GraphQL 和 REST API 以及 Admin UI。

如果我们禁用 GraphQL,如前所述,管理 UI 将使用 REST API 生成,我们无法再切换启用/禁用。如果我们也禁用 REST API,管理 UI 也将被禁用,并且在启用 GraphQL 之前我们无法再次启用它。

Project settings

单击创建按钮后,我们将看到以下 UI。我不会在这里深入探讨,因为您可以在下面的视频中看到演示,但我会做一个简短的介绍,在这个 UI 上,我们可以看到将要使用的工具,实体部分我们可以去管理我们的实体,我们可以去管理我们的用户将拥有的角色的角色部分,与非常重要的 GitHub 部分同步,我们需要连接到存储我们的代码的存储库以及查看代码部分,一旦我们在 GitHub 上进行了第一次提交,我们就可以在其中看到我们的代码。

Project Overview

现在是时候了,让我们通过演示视频展示 Amplication 的实际应用。

Amplication in action

运行我们的APP

现在我们已经实现了我们的应用程序,并通过 Amplication UI 完全配置了我们需要的所有功能,是时候运行它并查看它的实际效果了。

如视频所示,我们在存储库中创建了两个文件夹,一个名为 管理员界面 这将为我们的 UI 和另一个称为 服务器 它将运行我们的 GraphQL 和 REST API。

首先,我们需要运行我们的服务器,以便我们的 API 可供 UI 使用。有几种方法可以运行服 npm 运行撰写:向上 命令。这应该会启动我们的服务器,并使我们能够在此 URL 中看到 REST API 的 Swagger UI 文档 http://localhost:3000/api/ 和此 URL 中的 GraphQL Playground http://localhost:3000/graphql .

注意:请确保执行迁移,因为应该运行迁移的容器可能不会始终工作,具体取决于您的本地环境设置。

现在服务器正在运行,我们可以导航到 管理员界面 目录并运行 npm 运行开始 命令启动我们的前端,一旦它运行,我们可以在这个 URL 中访问它 http://localhost:3001/ 如果它没有在我们的浏览器中自动打开。

我们可以使用我们的默认凭据登录,即用户名 行政 和密码 行政 ,并开始管理您的数据。

你也可以参考这个 文件 来自 Amplication 本身关于如何运行应用程序的信息。

这是管理 UI 和服务器的快速演示。

Admin UI in action

希望您喜欢这篇文章并发现 Amplication 和我一样有用

标签:Node,Amplication,应用程序,js,API,UI,GraphQL,我们
From: https://www.cnblogs.com/amboke/p/16710468.html

相关文章

  • 前端Nodejs-Day34
    Node.js:基于ChromeV8引擎的Javascript运行环境浏览器中js的运行环境:前端运行环境Nodejs中js的运行环境:后端运行环境(无法调用DOM和BOM等浏览器内置API)  ......
  • Three-js入门3-插件stats和dat-GUI.md
    title:Three.js入门3-插件stats和dat.GUIcopyright:truepermalink:8top:0date:2019-01-2702:42:55tags:['three']categories:techpassword:翻译自官方文......
  • JS使用策略模式优化条件选择结构
    这段代码是采用if-else的方式判断多个不同的条件。functionpermission(role){if(role==="operations"){getOperationPermission()}elseif(role=......
  • SpringBoot Xml转Json对象
    一、导入需要的依赖<dependency><groupId>maven</groupId><artifactId>dom4j</artifactId><version>1.7-20060614</version></dependency>二、xml......
  • FastJson 的一些配置
    主要提到:关闭循环引用的配置"$ref":"$.data[0].detail.wmsInboundorder.details[1]"如下:importcom.alibaba.fastjson.serializer.SerializeConfig;importcom.alib......
  • node.js 使用教程-3.gulp-file-include 详细教程
    前言gulp-file-include是gulp插件,它提供了一个include方法让我们可以像后端模板那样把公共部分的页面导入进来,实现html复用。环境准备gulp-file-include是gulp的......
  • Java:Json与List对象的相互转换
    谷歌的Gson.jar://list转换为jsonGsongson=newGson();List<Person>persons=newArrayList<Person>();Stringstr=gson.toJson(persons);//json转换为listGs......
  • Delphi中TWebBrowser中注入Js
    最近帮朋友做一个软件,其中要自动化某网页中的操作,最简的操作是调用自己写的代码。代码如下:procedureTForm1.Button2Click(Sender:TObject);var i:integer; h:IHTML......
  • ASP.NET Core 读取配置文件JSON 数据、数组
    配置访问接口publicIConfiguration_Config;public类名(IConfigurationConfig){_Config=Config;}配置文件数据示例{"AllowedHosts":"*","......
  • js(function)
    1.调用函数vara=3;varb=4;functionprint(a,b){returna*b}varx=function(a,b){returna+b};//函数存储在变量中,不需要函数名称,通常通过变量名来......