Entity Framework for Angular (kind of)

When you just want to learn how to create Angular apps, creating an HTTP REST backend, with authentication and authorisation, and wrapping your URLs into an HttpClient can, sometimes feel like baggage - Still it's necessary to learn Angular. I've therefor created a scaffolder for this process in Magic, that allows you to literally click a button to create your backend, wrapping your database with CRUD operations, for then to click another button, and get a zip file containing an Angular project - Which wraps every single CRUD operation towards every single database table in your backend, into an automatically generated Angular HttpClient Service layer for you. If you download version 8.3.1 of Magic, you will find a new template, not producing any UX at all, only HTTP methods.

After having setup Magic, literally the process of wrapping an existing database, is no more than 5 seconds in total. If you run it towards for instance the Sakila database published by Oracle, Magic will generate an HttpClient service layer resembling the following for you automatically.

xxxxxxxxxx

  /**

   * HTTP CRUD service methods for your 'actor' entities.

   */

  get actor() : ICrudEntity {

    return {

      delete: (filter: any) => {

        return this.httpClient.delete<DeleteResponse>(

          environment.apiUrl +

          'magic/modules/sakila/actor' +

          this.getQueryArgs(filter));

      },

      read: (filter: any) => {

        return this.httpClient.get<any[]>(

          environment.apiUrl +

          'magic/modules/sakila/actor' +

          this.getQueryArgs(filter));

      },

      count: (filter: any) => {

        return this.httpClient.get<CountResponse>(

          environment.apiUrl +

          'magic/modules/sakila/actor-count' +

          this.getQueryArgs(filter));

      },

      create: (args: any) => {

        return this.httpClient.post<CreateResponse>(

          environment.apiUrl +

          'magic/modules/sakila/actor',

          args);

      },

      update: (args: any) => {

        return this.httpClient.put<UpdateResponse>(

          environment.apiUrl +

          'magic/modules/sakila/actor',

          args);

      }

    }

  }

The above syntax groups all related service methods for you, that belongs to the same "CRUD method group", allowing you to almost use the equivalent of "fluid syntax" to retrieve data from your backend. Everything perfectly secured, using JWT token may I add. Complete with an authentication and authorisation service too.

Admittedly, I could do a slightly better job at documenting the scaffolded result - And I could improve things in regards to typing, since endpoint methods now simply takes an "any" object, and you'll manually have to play around with your Endpoints menu item to figure out how to apply filtering, etc - But since I'm eager to show this to you, I figure you'll probably bear over with me.

Anyways, find and download Magic below. I'll probably create more templates like this. Suggestions ...?

• Download Magic