Vue Single Page Application with ASP.NET Core — No Node Js

In this post, we will explore how to build single page application using Vue JS and ASP.Net core. I promise there won’t be any Node JS installation and running npm scripts to make your project folder bulky.

First of all, download and install the extension from the Visual Studio market place. The installation process is straight forward.

ASP.Net Core SPA with Vue Js - Visual Studio Marketplace

Now open Visual Studion 2019 or 2022, and search for the extension

Select the template and click next. Enter project name details and click Create

You will see the project is created and few example pages are already in place. Just build and run the project to see the examples in action.

The home page is displayed with Hello World in blue color

Click on the Projects link to see the list of projects which are loaded via API calls. Also clicking on the one the project view link will show the details. This all are happening without any postback and view are rendered using the routes defined in the router.js file.

In next blog I will give a better view on how to use the template by extending the example adding some more pages and login feature which will give a better usecase for using Vuex.Store to store session data.

Use it and if have any issue please raise here: https://github.com/deepakkumar1984/ASP.NET-Core-with-Vue-JS

Have fun!!!