14 |
15 |
--------------------------------------------------------------------------------
/templates/vue/server/.vscode/launch.json:
--------------------------------------------------------------------------------
1 | {
2 | "version": "0.2.0",
3 | "configurations": [
4 | {
5 | // Use IntelliSense to find out which attributes exist for C# debugging
6 | // Use hover for the description of the existing attributes
7 | // For further information visit https://github.com/OmniSharp/omnisharp-vscode/blob/master/debugger-launchjson.md
8 | "name": ".NET Core Launch (web)",
9 | "type": "coreclr",
10 | "request": "launch",
11 | "preLaunchTask": "build",
12 | // If you have changed target frameworks, make sure to update the program path.
13 | "program": "${workspaceFolder}/bin/Debug/net7.0/Contoso.dll",
14 | "args": [],
15 | "cwd": "${workspaceFolder}",
16 | "stopAtEntry": false,
17 | // Enable launching a web browser when ASP.NET Core starts. For more information: https://aka.ms/VSCode-CS-LaunchJson-WebBrowser
18 | "serverReadyAction": {
19 | "action": "openExternally",
20 | "pattern": "\\bNow listening on:\\s+(https?://\\S+)"
21 | },
22 | "env": {
23 | "ASPNETCORE_ENVIRONMENT": "Development"
24 | },
25 | "sourceFileMap": {
26 | "/Views": "${workspaceFolder}/Views"
27 | }
28 | },
29 | {
30 | "name": ".NET Core Attach",
31 | "type": "coreclr",
32 | "request": "attach"
33 | }
34 | ]
35 | }
--------------------------------------------------------------------------------
/templates/vue/app/src/stores/content.js:
--------------------------------------------------------------------------------
1 | import { defineStore } from 'pinia'
2 |
3 | export const useContentStore = defineStore('content', {
4 | state(){
5 | return {
6 | documents: {},
7 | document: null,
8 | }
9 | },
10 | getters:{
11 | dummyDocument(){
12 | return {
13 | title: "Lorem Ipsum",
14 | html: "Velit tempor ea laboris velit anim ad exercitation do qui veniam. In anim laborum qui duis ullamco sit reprehenderit adipisicing ullamco reprehenderit dolore dolore. Duis veniam ullamco commodo reprehenderit laboris sit. Et incididunt ea magna excepteur ullamco dolore culpa in. Deserunt minim voluptate culpa Lorem nulla in velit.",
15 | image: `https://dummyimage.com/540x460`,
16 | link: "#"
17 | }
18 | }
19 | },
20 | actions:{
21 | async getDocuments(path){
22 | const endpoint = location.hostname.indexOf("localhost") >=0 ? "http://localhost:8000/api/content" : "/api/content"
23 | try{
24 | this.documents.length = 0;
25 | const url = `${endpoint}/${path}`;
26 | //TODO: Change this for production
27 | const res = await fetch(url);
28 | const docs = await res.json();
29 | //keep things reactive
30 | docs.forEach(d => {
31 | this.documents[d.slug.toLowerCase()] = d;
32 | });
33 | }catch(err){
34 | console.error(err);
35 | }
36 |
37 | }
38 | }
39 | });
40 |
--------------------------------------------------------------------------------
/templates/vue/app/README.md:
--------------------------------------------------------------------------------
1 | # The ASP.NET/Vue Client Application
2 |
3 | This template should help get you started developing with Vue 3, Vite and ASP.NET. You can run this application in isolation (from the API) using `npm run dev` in this directory.
4 |
5 | You can run it alongside the API if you run `npm run dev` in the root.
6 |
7 | ## Recommended IDE Setup
8 |
9 | [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
10 |
11 | ## Customize configuration
12 |
13 | See [Vite Configuration Reference](https://vitejs.dev/config/).
14 |
15 | ## Project Setup
16 |
17 | ```sh
18 | npm install
19 | ```
20 |
21 | ### Compile and Hot-Reload for Development
22 |
23 | ```sh
24 | npm run dev
25 | ```
26 |
27 | ## Build and Deployment
28 |
29 | The ASP.NET Minimal API project has build settings configured to build your client app for production when you run `dotnet publish` or `dotnet build`. This client app will be compiled and the output in `/dist` will be copied over to `wwwroot` of the API.
30 |
31 | Deployment scripts are setup for you in `/Deployment` and come preconfigured for Azure deployment or Docker deployment.
32 |
33 | ## Questions? Issues?
34 |
35 | Please visit the GitHub repo if you have any questions or concerns. As always, we would love an Issue report if you've found a bug or, better yet, a PR with a fix!
36 |
37 | Issue first, please, so we can be sure the PR will fit.
--------------------------------------------------------------------------------
/templates/vue/app/src/components/Blocks/Features.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
6 |
7 |
10 |
15 |