---
layout: post
parent: Web Development
nav_order: 1
title: "Creating a reactive SPA simply within an ASP.Net Core web app with Vue.js"
date: 2021-07-12 21:42:57 +0100
categories: vue dotnet core asp
---
# {{page.title}}
_{{page.date}}_
In this post, I will cover how you can quickly and easily use Vue.js to make a reactive 'SPA' within ASP.Net Core. This is a slightly dirty way to do things, but for rapid prototyping or a simple project it does the job just fine without any unnecessary complications. By 'SPA' I mean a Single Page Application, except without any navigation as that's handled by the underlying ASP.Net Core application, as is the API called by Vue.js methods.
In the `` tags of your Razor page/view, you'll need to include a reference to Vue.js, for example via a CDN.
``
At the bottom of your Razor page/view, you'll need to include a `
```
To hook this into the DOM, just add the element identifier to an element, for example `` will bind a div to this Vue instance.
This is a very simple, quick and dirty example, but hopefully it gives you an idea of the kind of things you can quickly and easily achieve using Vue.js in this way. While this example uses ASP.Net Core, you could easily plug this into any other website, so long as it's using HTML, CSS and JavaScript, and there is an API to make requests to.