Project Tye with .Net Core and Angular

Hi Friends,

In this section, we are going to talk about project tye. This is new project from Microsoft team to ease the development and deployment with docker and kubernetes. Having said that, let’s get started.

   

Tye is a developer tool that makes developing, testing, and deploying microservices and distributed applications easier. Project Tye includes a local orchestrator to make developing microservices easier and the ability to deploy microservices to Kubernetes with minimal configuration. Having said that let’s get started.

The very first thing which you will be needing is sample app for the same. You can download it from https://github.com/dotnet/tye/tree/master/samples/apps-with-core-angular. Here, you can find wiki page as well explaining the setup process. This is pretty straight forward though.

Installation:-

In order to install the utility, you need to say –> dotnet tool install -g Microsoft.Tye --version "0.2.0-alpha.20258.3"

For latest release, you can check the documentation page @ https://github.com/dotnet/tye/blob/master/docs/getting_started.md

Project Structure:-

Project structure looks like as shown below.

This is pretty straight forward structure where in we have angular app as Frontend app and dotnet app as backend. API project is just serving a list of movies and angular app is consuming that.

Movies.Shared looks like

Similarly, MoviesAPI looks like

Similarly, angular project looks like

One point to note here that API project is exposing at endpoint 5001. Hence, angular is making the service call at this port. And the same has been maintained in environment.ts like shown below.

This was all about Project setup. Now, let’s go ahead and look at the tye.yaml file here.   This is pretty simple and self explanatory. If you have been writing distributed apps earlier or doing docker, then you must have understood that, this is very similar docker-compose file with multiple services underneath. Here I have two services. One is API and and the other one is App. In case of API, which is dotnet project, you don’t need to write Dockerfile explicitly, MSBuild will take care internally. In case of angular app, I have specified the dockerFile and exposed the port as well. Below I have pasted the dockerfile for angular project.

Note:- Tye dynamically allocates port to services as well. But, I have explicitly mapped here. In future examples, we will see how to make use of dynamic ports as well. But for now, this is fine.

Tye init, build and run:-

In order to initialize any project with tye, you need to do tye init at the root of the project. This will drop tye.yaml at the root of the project. But this won’t have configuration for any non dotnet project. You need to write it explicitly.

After that tye.yaml file will be created and it will look like

As I said, this will have only .Net dependencies not others. Hence for that we need to refer to our previous example like shown below.

Next, we need to do tye build . (.) represents current directory. Upon successful build it will look like

Finally, we can run using tye run command as shown below.

Then, you can navigate to http://127.0.0.1:8000/. This will be your dashboard listing all services.

Here, You can click on the individual services and inspect logs as well like shown below.

However, If you go to https://localhost:5001/api/movies, it will come like

Similarly, If I go to http://localhost:4400/movies/, it will come like

Therefore, we now have projects running locally using tye. At this stage, If I do docker images, I can see both these images.

At the same time, when I do docker ps, it will come like

This is just a verification that our apps are hosted within container and its running fine. In the next segment, will delve further. Till then stay tuned and happy coding.

Thanks,
Rahul Sahay
Happy Coding

1,335 total views, 5 views today