Starting with VueJS
diff --git a/erpnext/public/js/education/web-academy.js b/erpnext/public/js/education/web-academy.js
index 1bf325b..f37b8f0 100644
--- a/erpnext/public/js/education/web-academy.js
+++ b/erpnext/public/js/education/web-academy.js
@@ -8,9 +8,9 @@
 Vue.use(VueRouter)
 
 const routes = [
-	{path: '', component: AcademyHome},
-	{path: '/Program/:code', component: AcademyProgramPage, props: true},
-	{path: '/Course', component: AcademyCoursePage},
+	{name: 'home', path: '', component: AcademyHome},
+	{name: 'program', path: '/Program/:code', component: AcademyProgramPage, props: true},
+	{name: 'content', path: '/Program/:code/:course/:type/:content', component: AcademyCoursePage, props: true},
 ];
 
 const router = new VueRouter({
@@ -18,7 +18,7 @@
 });
 
 frappe.ready(() => {
-	new Vue({
+	window.v = new Vue({
 		el: "#web-academy",
 		router: router,
 		template: "<academy-root/>",