In this section, I will talk about my new Yeoman generator. In this Yeoman Generator, I have published ASP.NET Core scaffolding template with Angular 2 and TypeScript. This will enable developers to get started with Single Page App (SPA) development quickly. One point to note here is, this template is aligned with new ASP.NET Core changes where it embraces .csproj system rather than .xproj.
Here is the NPM Site link: https://www.npmjs.com/package/generator-aspnetcore-angular-2. Here, also, you will find all the details about how to install the generator. You can also discover the same on Yeoman site as well. Obviously, these templates are completely node and yeoman driven, hence it is needless to say that these are per-requisites. With that being said, let’s go ahead and discover the same with sample installation. Since I have already installed Yeoman globally, there is no need to install that again. Hence, I started with step 2. Upon successful installation of generator, it will show some warning, but that’s ok, you can skip that.
Then, you need to install the template with the below shown command, either at the same location or some other location.
Once you run the same, it will start creating the required files as shown below:
Here, I will answer all the questions and then hit enter. Like in template selection, I will simply hit enter, as currently, I am keeping one template, in coming versions, will have more templates.
Once the same gets created successfully, it will look like:
Then, I need to traverse in the working directory where my proj files are sitting like shown below. Then, I need to say dotnet restore. This will restore all the dependencies from nuget feed.
Now, I will run the same using dotnet run and then I navigate to http://localhost:5000. This will produce the below result:
And, when I click on Fetch Movies link, it will produce the below page.
However, when I open the same in Visual Studio Code, it will look like:
As you can see, this is based on the new changes around ASP.NET Core. The sample project can be opened in VS-2017 and it works there as well.
Note: Run webpack – watch from command line to make changes and see changes live.
Generator Link: https://github.com/rahulsahay19/generator-aspnetcore-angular-2
Hey there, it's Rahul Sahay! I'm thrilled to be a platform specialist at Publicis Sapient, where I get to work on some exciting projects. I've been honing my skills in various aspects of the software development life cycle for more than 15 years, with a primary focus on web stack development. I've been fortunate to have contributed to numerous software development initiatives, ranging from client applications to web services and websites. Additionally, I enjoy crafting application architecture from scratch, and I've spent most of my time writing platform agnostic and cloud agnostic code. As a self-proclaimed code junkie, software development is more than just a job to me; it's a passion! And I consider myself lucky to have worked with an array of cutting-edge technologies, from .NetCore to SpringBoot 3, from Angular to React, and from Azure to AWS and many more cousin technologies...
- 🔭 I’m currently working @ below tech stacks
- Microservices,
- Distributed Systems,
- Spring Boot
- Spring Cloud
- System Design,
- Docker,
- Kubernetes,
- Message Queues,
- ELK Stack
- DotNetCore,
- Angular,
- Azure
- 💬 Ask me anything about my articles [My View](https://myview.rahulnivi.net/)
- 📫 How to reach me: [@rahulsahay19](https://twitter.com/rahulsahay19)
- 📫 Github: [@rahulsahay19](https://github.com/rahulsahay19)