为Azure创建Spring Boot和Angular应用程序(1/7)

在这一系列博客文章中,我们将向Azure部署完整的应用程序,并学习如何以节省成本的方式有效地设置许多组件。

我们将讨论Spring Boot和Angular,以及Azure Pipelines和Azure Web Apps的部署自动化,Azure Insights的监视以及性能调整。 而且我们不会为金钱而害羞:我们将讨论预算和成本,并尝试拥有一种非常便宜的设置,可以在需要时进行扩展。

以下是本系列的各个部分:

  • Creating a Spring Boot and Angular application for Azure (1/7)
  • Creating and configuring Azure Web App and MySQL to host a Spring Boot application (2/7)
  • Using Azure Pipelines to build, test and deploy a Spring Boot and Angular application (3/7)
  • Using Azure Application Insights with Spring Boot (4/7)
  • Using Azure Application Insights with Angular (5/7)
  • Configuring Azure CDN to boost Angular performance (6/7)
  • Configuring Azure Redis Cache to boost Spring Boot performance (7/7)

Generating the application

As the creator and lead developer of JHipster, I'm going to use JHipster to generate a "full stack" application using both Spring Boot and Angular. Please note that this series of posts is not linked to JHispter: what we will do here should work in a generic way for all Spring Boot and Angular applications. We only use JHipster to speed up the development process, and also because it generates a non-trivial application for us, so we are not showcasing a simple "Hello, world" application, but one that is close to what you would expect in a real-life scenario.

You can either install JHipster by going to https://www.jhipster.tech/, or use JHipster Online to generate a full-stack application graphically. For this series of posts, we will use the latest release available at this moment, v6.0.1. We have chosen here a few interesting options for Azure:

  • We use MySQL, more specifically Azure Database for MySQL, as it is a very inexpensive option with Azure.
  • We do not use any Hibernate 2nd level cache. With Hibernate, if you want to be able to scale you will need to have a distributed cache, which is a bit complex to set up, so we will disable this for the moment. We will see on part 7 of this series how to use Azure Redis Cache to achieve this.
  • We have configured end-to-end tests with Protractor, so we will be able to test our complete application easily

The generated application has been pushed on https://github.com/jdubois/spring-on-azure, and you can see the initial commit corresponding to this part here.

Adding some business logic to the application

Now that a basic application has been created, we are going to add some business logic to it, in order to have a more "real-life" product. For this, JHipster proposes its "JHispter Domain Language", and we are going to use one of the provided samples, the "Bug Tracker". This will generate an application that looks a bit like the GitHub bug tracker: it's only generated code, and if you really want a working application, you will still need to code some business logic, but for this series of blog posts this gives us a complete application to play with.

Those entities can either be created using the JHipster command line, or graphically using JHipster Online, which will even be able to do a pull request to your GitHub project with those changes.

The commit corresponding to those new entities is available here.

Testing and running the application locally

现在我们已经准备好完整的应用程序,可以运行它的测试以查看一切是否正常。 你可以跑MVNW测试运行Java测试,以及npm运行测试运行前端测试。

We can now run the application locally by typing mvnw -Pdev,webpack spring-boot:run, and opening our browser at http://localhost:8080/.

Lastly, let's run end-to-end tests with Protractor by running in another console npm run e2e. This will launch a browser that will run integration tests on http://localhost:8080/, proving that the whole application works well.

Below is a screenshot of the final application: in the next post of this series, we will create an Azure infrastructure so we can deploy it to production.

为Azure创建Spring Boot和Angular应用程序(1/7)_第1张图片

from: https://dev.to//azure/creating-a-spring-boot-and-angular-application-for-azure-1-7-2mb8

你可能感兴趣的:(javascript,数据库,c/c++,ViewUI)