ASP.NET + Vue.js starter project

This project an architecture guidance for beginners, so use it as a baseline.

In order to install and launch the project, follow the instructions in GitHub repository.

Also, be sure to read about Front-End Tools used in the project and Access Control implementation details.

How it works

The project consists of two completely separate apps - .NET-based back-end app (WebSite project) and Vue 3 front-end app (located in src\WebSite\client-app).

The front-end app is served by Vite dev server.

The back-end app handles all browser requests for front-end resources and proxifies them to the Vite dev server.

Back-end and front-end apps are running completely independently during the development process.

TIP

You don't need to relaunch the back-end app if you're only making changes to the front-end code and vice-versa.

Vite dev server also tracks any changes to the front-end code and updates the browser automatically by using Hot-Module-Replacement (HMR) feature, so you don't need to relaunch the dev server if you're making changes to the front-end code.

Related projects

There are two of our own libraries that we utilize in the starter project.

DataTable Query Builder

This library automatically transforms AJAX requests from DataTables into LINQ queries, allowing you to implement server-side paging, filtering and sorting with just a few lines of code.

Be sure to read the documentation to understand how to use it.

datatables.net-vue

This library is a Vue wrapper around DataTables, which is a jQuery plugin.

There is no documentation yet, but usage examples in the project are self-explanatory.

dt-options is a prop that accepts DataTables options, so you can refer to official DataTables documentation for available options.