angular client tutorial

angular-client-generation/files/CustomerEntity.java

@@ -0,0 +1,60 @@
+package com.example.application.cobigenjavaexample.customermanagement.dataaccess.api;
+
+import java.sql.Timestamp;
+
+import javax.persistence.Entity;
+import javax.persistence.Table;
+
+@Entity
+@Table(name = "Customer")
+public class CustomerEntity {
+
+  private String firstname;
+
+  private String lastname;
+
+  private int age;
+
+  /**
+   * @return the firstname
+   */
+  public String getFirstname() {
+    return firstname;
+  }
+
+  /**
+   * @param firstname the firstname to set
+   */
+  public void setFirstname(String firstname) {
+    this.firstname = firstname;
+  }
+
+  /**
+   * @return the lastname
+   */
+  public String getLastname() {
+    return lastname;
+  }
+
+  /**
+   * @param lastname the lastname to set
+   */
+  public void setLastname(String lastname) {
+    this.lastname = lastname;
+  }
+
+  /**
+   * @return the age
+   */
+  public int getAge() {
+    return age;
+  }
+
+  /**
+   * @param age the age to set
+   */
+  public void setAge(int age) {
+    this.age = age;
+  }
+
+}

angular-client-generation/index.asciidoc

@@ -0,0 +1,81 @@
+= Generate Angular Client with devonfw
+== Angular client generation with CobiGen
+====
+With the CobiGen code generator you can easily generate components for your Angular application.
+The following tutorial provides an example for using the CobiGen cli.
+You can find more information on https://github.com/devonfw/cobigen/wiki/howto_angular-client-generation
+## Prerequisites
+* devonfw Ide
+
+## Learning goals.
+Here in this tutorial we will learn the following:
+* Create java project
+* CobiGen to generate the Angular source code out of the java files
+
+====
+
+[step]
+--
+restoreDevonfwIde(["java", "mvn", "vscode"])
+--
+
+For this tutorial an installation of the devonfw IDE is required first time you use it. The next step is to install the CobiGen CLI.
+[step]
+--
+installCobiGen()
+--
+
+CobiGen is build as an extensible framework for incremental code generation. It provides extension points for new input readers which allow reading new input types and converting them to an internally processed model.CobiGen uses the backend classes for generating your code used in the Angular application. So in the next steps you will create a java project, create a simple java class.
+[step]
+--
+createDevon4jProject("cobigenjavaexample")
+--
+
+This step is for building the java project.
+[step]
+== Build the java project
+--
+buildJava("cobigenjavaexample")
+--
+
+====
+CobiGen is integrated via plugin in the VS Code IDE. We will use it to generate code from one single java class based on existing templates.
+[step]
+--
+
+createFile("cobigenjavaexample/core/src/main/java/com/example/application/cobigenjavaexample/customermanagement/dataaccess/api/CustomerEntity.java", "files/CustomerEntity.java")
+cobiGenJava("cobigenjavaexample/core/src/main/java/com/example/application/cobigenjavaexample/customermanagement/dataaccess/api/CustomerEntity.java",[1,3,5,6,8])
+--
+The CobiGen code generator will generate code for Transfer object, REST service handling and data access and so on.
+
+For example, the following files are generated by CobiGen when using the specified templates:
+
+(5) TO's: Generates the related Transfer Objects.
+- `devonfw/workspaces/main/cobigenjavaexample/api/src/main/java/com/example/application/cobigenjavaexample/customermanagement/logic/api/to/CustomerEto.java`{{open}}
+- `devonfw/workspaces/main/cobigenjavaexample/api/src/main/java/com/example/application/cobigenjavaexample/customermanagement/logic/api/to/CustomerSearchCriteriaTo.java`{{open}}
+
+====
+====
+Now you can go through api module of your java project and use Cobigen again to generate your front end (angular code).
+[step]
+== Running CobiGen to generate to your Angular code
+--
+cobiGenJava("cobigenjavaexample/api/src/main/java/com/example/application/cobigenjavaexample/customermanagement/logic/api/to/CustomerEto.java",[1])
+--
+The angular code generation is done now and the generated code is stored in the workspace/main/devon4ng-applicaiton-template directory. Make sure the backend server url is configured in environments/environment.ts file.
+
+====
+
+The below commands are used, to run the angular front end.
+npm install
+ng serve
+
+[step]
+--
+runClientNg("devon4ng-application-template", { "startupTime": 200, "port": 4200, "path": "" })
+--
+====
+Conclusion: In this Tutorial we learned the following things.
+* How to create a java project.
+* How to generate the Angular source code using CobiGen.
+====