Generate your first Xamarin application with JHipster.NET
Tags: csharp, dotnet, xamarin, opensource
Published: 2021-02-26 10:31:05

### Overview

**[JHipster](https://www.jhipster.tech/)** is a famous generator allowing you to generate modern applications. 

One of its official blueprints is called **[JHipster.NET](https://github.com/jhipster/jhipster-dotnetcore)**. It allows to override the back-end part in asp.net core (instead of Java spring boot). 

To take advantage of this blueprint, we will generate a modern application with a xamarin front-end. Meaning that both front-end and back-end will use C#.

### Why Xamarin ?

With a C#-shared codebase, developers can use Xamarin tools to write native Android, iOS, and Windows apps with native user interfaces and share code across multiple platforms, including Windows, macOS, and Linux.

Choosing Xamarin allows to make a modern cross platform application with next to zero code duplication and waste of time.

### Installation

You may find more information about how to generate your asp.net core application with JHipster.NET **[in this post](https://dev.to/nicolas63/generate-your-asp-net-core-application-with-jhipster-net-2f53)**.

To install JHipster generator, run this command :
```shell
npm install -g generator-jhipster
```

To install JHipster.NET blueprint, run the following command :
```shell
npm install -g generator-jhipster-dotnetcore
```
Move to any empy folder you want to, and generate your full-stack app by running this command :
```shell
jhipster -d --blueprints dotnetcore
```

If everything goes as expected, you should have few question to answer. For instance, first questions will ask you to choose a base name, and a C# namespace.

After few question, you will have to choose between one of the available fronts for your client. 

Please note that Xamarin front is only available in debug mode. That's why the `-d` flag is mandatory.

Make sure to __choose Xamarin :__

![front-choice](https://dev-to-uploads.s3.amazonaws.com/i/72sub5647yo14gz7o03m.png)

### Launch your back-end application

Before talking about how to use your Xamarin front-end, run the following command to launch your server and database :

```shell
dotnet run --verbosity normal --project ./src/YourAppName/YourAppName.csproj
```

Warning: Make sure to replace `YouAppName` with your actual real app name. 

Moreover, if you have any difficulty, your generated application should contains a README.md that may help you quite a bit.

### NuGet Requirements

Your generated Xamarin front-end application will require the following NuGet packages :

- [akavache](https://www.nuget.org/packages/akavache/) >= 7.1.1
- [MvvmCross.Forms](https://www.nuget.org/packages/MvvmCross.Forms/) >= 7.1.1
- [System.ComponentModel.Annotations](https://www.nuget.org/packages/System.ComponentModel.Annotations/) >= 5.0.0
- [System.Net.Http.Json](https://www.nuget.org/packages/System.Net.Http.Json/) >= 3.2.1
- [Xamarin.Forms](https://www.nuget.org/packages/Xamarin.Forms) >= 4.6.0
- [Xamarin.Essential](https://www.nuget.org/packages/Xamarin.Essentials/) >=1.5.3

### Generated structure

Any generated Xamarin application is structured as follows :
```
client
├── Namespace.Client.Xamarin.Core     - Your core application
│   ├── Models
│   │   ├── Entities                  - Generated models
│   ├── Services
│   │   ├── Entities                  - Generated services
│   ├── ViewModels
│   │   ├── Entities                  - Generated viewmodels
│   ├── Views
│   │   ├── Entities                  - Generated views
├── Namespace.Client.Xamarin.Android  - Your Android application
│   ├── Resources          
│   │   ├── drawable                  - Contains your images
│   │   ├── Layout                    - Contains your layouts
│   ├── Properties
├── Namespace.Client.Xamarin.iOS      - Your iOS application   
│   ├── Resources                     - Contains your images
│   ├── Properties
├── Namespace.Client.Xamarin.Shared   - Shared code
│   ├── Constants                     - Contains shared constants
```

### Entity generation

When creating a new entity in your database, your front-end is automatically updated to ensure a fully available management of all your entities.

#### Manual Entity Generation

To create an entity you can run the following command in your application folder: 
```shell
jhipster entity <entity-name>
```
You will have to answer few more questions in order to decide if you want to add some relationship with other entities and if you want to add more fields to it.

#### JDL Entity Generation

You can also automaticaly generate many entities tanks to a JDL with the following command :

```shell
jhipster import-jdl my_file.jdl
```

A JDL (JHipster Domain Language) is a JHipster-specific domain language where you can describe all your applications, deployments, entities and their relationships in a single file (or more than one) with a user-friendly syntax.

You can create your JDL online on __[JDL Studio](https://start.jhipster.tech/jdl-studio/)__.

### Conclusion

If you followed everything correctly, you should now have a modern Mvvm Xamarin Application with CRUD operations on all your entities.

Feel free to contribute to __[JHipster.NET's GitHub repository](https://github.com/jhipster/jhipster-dotnetcore)__ and don't forget to put a star if you liked it.