diff --git a/.gitignore b/.gitignore index c50f40f..f8767cc 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ -/Properties/launchSettings.json +launchSettings.json ## Ignore Visual Studio temporary files, build results, and ## files generated by popular Visual Studio add-ons. diff --git a/ASP.NET Core Basics/ASP.NET Core Basics.sln b/ASP.NET Core Basics/ASP.NET Core Basics.sln index 3e665d4..55af4da 100644 --- a/ASP.NET Core Basics/ASP.NET Core Basics.sln +++ b/ASP.NET Core Basics/ASP.NET Core Basics.sln @@ -1,7 +1,6 @@ - Microsoft Visual Studio Solution File, Format Version 12.00 # Visual Studio 15 -VisualStudioVersion = 15.0.27004.2002 +VisualStudioVersion = 15.0.27004.2005 MinimumVisualStudioVersion = 10.0.40219.1 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "src", "src", "{6446DEF2-D423-47E2-85CC-691A52915EC2}" EndProject @@ -15,28 +14,78 @@ Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Angular", "src\Angular\Angu EndProject Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "React", "src\React\React.csproj", "{56EC1AA3-0060-4349-921F-59AAB8A93129}" EndProject +Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Vue", "src\Vue\Vue.csproj", "{9C278842-E287-488D-B76B-D3096AF553D4}" +EndProject Global GlobalSection(SolutionConfigurationPlatforms) = preSolution Debug|Any CPU = Debug|Any CPU + Debug|x64 = Debug|x64 + Debug|x86 = Debug|x86 Release|Any CPU = Release|Any CPU + Release|x64 = Release|x64 + Release|x86 = Release|x86 EndGlobalSection GlobalSection(ProjectConfigurationPlatforms) = postSolution {A1208011-947A-475C-9011-E2657FAB5A31}.Debug|Any CPU.ActiveCfg = Debug|Any CPU {A1208011-947A-475C-9011-E2657FAB5A31}.Debug|Any CPU.Build.0 = Debug|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Debug|x64.ActiveCfg = Debug|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Debug|x64.Build.0 = Debug|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Debug|x86.ActiveCfg = Debug|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Debug|x86.Build.0 = Debug|Any CPU {A1208011-947A-475C-9011-E2657FAB5A31}.Release|Any CPU.ActiveCfg = Release|Any CPU {A1208011-947A-475C-9011-E2657FAB5A31}.Release|Any CPU.Build.0 = Release|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Release|x64.ActiveCfg = Release|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Release|x64.Build.0 = Release|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Release|x86.ActiveCfg = Release|Any CPU + {A1208011-947A-475C-9011-E2657FAB5A31}.Release|x86.Build.0 = Release|Any CPU {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Debug|Any CPU.ActiveCfg = Debug|Any CPU {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Debug|Any CPU.Build.0 = Debug|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Debug|x64.ActiveCfg = Debug|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Debug|x64.Build.0 = Debug|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Debug|x86.ActiveCfg = Debug|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Debug|x86.Build.0 = Debug|Any CPU {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Release|Any CPU.ActiveCfg = Release|Any CPU {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Release|Any CPU.Build.0 = Release|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Release|x64.ActiveCfg = Release|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Release|x64.Build.0 = Release|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Release|x86.ActiveCfg = Release|Any CPU + {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA}.Release|x86.Build.0 = Release|Any CPU {F27EF346-050A-4AC6-BCAA-D2446246240C}.Debug|Any CPU.ActiveCfg = Debug|Any CPU {F27EF346-050A-4AC6-BCAA-D2446246240C}.Debug|Any CPU.Build.0 = Debug|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Debug|x64.ActiveCfg = Debug|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Debug|x64.Build.0 = Debug|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Debug|x86.ActiveCfg = Debug|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Debug|x86.Build.0 = Debug|Any CPU {F27EF346-050A-4AC6-BCAA-D2446246240C}.Release|Any CPU.ActiveCfg = Release|Any CPU {F27EF346-050A-4AC6-BCAA-D2446246240C}.Release|Any CPU.Build.0 = Release|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Release|x64.ActiveCfg = Release|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Release|x64.Build.0 = Release|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Release|x86.ActiveCfg = Release|Any CPU + {F27EF346-050A-4AC6-BCAA-D2446246240C}.Release|x86.Build.0 = Release|Any CPU {56EC1AA3-0060-4349-921F-59AAB8A93129}.Debug|Any CPU.ActiveCfg = Debug|Any CPU {56EC1AA3-0060-4349-921F-59AAB8A93129}.Debug|Any CPU.Build.0 = Debug|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Debug|x64.ActiveCfg = Debug|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Debug|x64.Build.0 = Debug|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Debug|x86.ActiveCfg = Debug|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Debug|x86.Build.0 = Debug|Any CPU {56EC1AA3-0060-4349-921F-59AAB8A93129}.Release|Any CPU.ActiveCfg = Release|Any CPU {56EC1AA3-0060-4349-921F-59AAB8A93129}.Release|Any CPU.Build.0 = Release|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Release|x64.ActiveCfg = Release|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Release|x64.Build.0 = Release|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Release|x86.ActiveCfg = Release|Any CPU + {56EC1AA3-0060-4349-921F-59AAB8A93129}.Release|x86.Build.0 = Release|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Debug|Any CPU.ActiveCfg = Debug|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Debug|Any CPU.Build.0 = Debug|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Debug|x64.ActiveCfg = Debug|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Debug|x64.Build.0 = Debug|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Debug|x86.ActiveCfg = Debug|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Debug|x86.Build.0 = Debug|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Release|Any CPU.ActiveCfg = Release|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Release|Any CPU.Build.0 = Release|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Release|x64.ActiveCfg = Release|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Release|x64.Build.0 = Release|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Release|x86.ActiveCfg = Release|Any CPU + {9C278842-E287-488D-B76B-D3096AF553D4}.Release|x86.Build.0 = Release|Any CPU EndGlobalSection GlobalSection(SolutionProperties) = preSolution HideSolutionNode = FALSE @@ -46,6 +95,7 @@ Global {EB45A937-E3EF-4B0F-A674-92B44BEA3FDA} = {6446DEF2-D423-47E2-85CC-691A52915EC2} {F27EF346-050A-4AC6-BCAA-D2446246240C} = {6446DEF2-D423-47E2-85CC-691A52915EC2} {56EC1AA3-0060-4349-921F-59AAB8A93129} = {6446DEF2-D423-47E2-85CC-691A52915EC2} + {9C278842-E287-488D-B76B-D3096AF553D4} = {6446DEF2-D423-47E2-85CC-691A52915EC2} EndGlobalSection GlobalSection(ExtensibilityGlobals) = postSolution SolutionGuid = {810FF428-282C-444B-9C2A-660B9AAE9D8F} diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/boot.ts b/ASP.NET Core Basics/src/Vue/ClientApp/boot.ts new file mode 100644 index 0000000..fb643d4 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/boot.ts @@ -0,0 +1,18 @@ +import './css/site.css'; +import 'bootstrap'; +import Vue from 'vue'; +import VueRouter from 'vue-router'; +Vue.use(VueRouter); + +const routes = [ + { path: '/', component: require('./components/home/home.vue.html') }, + { path: '/counter', component: require('./components/counter/counter.vue.html') }, + { path: '/fetchdata', component: require('./components/fetchdata/fetchdata.vue.html') }, + { path: '/contactlist', component: require('./components/contacts/contactlist.vue.html') } +]; + +new Vue({ + el: '#app-root', + router: new VueRouter({ mode: 'history', routes: routes }), + render: h => h(require('./components/app/app.vue.html')) +}); diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/app/app.ts b/ASP.NET Core Basics/src/Vue/ClientApp/components/app/app.ts new file mode 100644 index 0000000..f580f76 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/app/app.ts @@ -0,0 +1,10 @@ +import Vue from 'vue'; +import { Component } from 'vue-property-decorator'; + +@Component({ + components: { + MenuComponent: require('../navmenu/navmenu.vue.html') + } +}) +export default class AppComponent extends Vue { +} diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/app/app.vue.html b/ASP.NET Core Basics/src/Vue/ClientApp/components/app/app.vue.html new file mode 100644 index 0000000..6a108b8 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/app/app.vue.html @@ -0,0 +1,14 @@ + + + diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/contacts/contactlist.ts b/ASP.NET Core Basics/src/Vue/ClientApp/components/contacts/contactlist.ts new file mode 100644 index 0000000..c62d533 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/contacts/contactlist.ts @@ -0,0 +1,26 @@ +import Vue from 'vue'; +import { Component } from 'vue-property-decorator'; + +@Component +export default class ContactListComponent extends Vue { + contacts: Contact[] = []; + + mounted() { + fetch('http://localhost:13322/api/contactsApi/') + .then(response => response.json() as Promise) + .then(data => { + this.contacts = data; + }); + } +} + +interface Contact { + id: number; + name: string; + address: string; + city: string; + state: string; + postalCode: string; + phone: string; + email: string; +} \ No newline at end of file diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/contacts/contactlist.vue.html b/ASP.NET Core Basics/src/Vue/ClientApp/components/contacts/contactlist.vue.html new file mode 100644 index 0000000..7ee6e31 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/contacts/contactlist.vue.html @@ -0,0 +1,23 @@ + + + diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/counter/counter.ts b/ASP.NET Core Basics/src/Vue/ClientApp/components/counter/counter.ts new file mode 100644 index 0000000..e48ef79 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/counter/counter.ts @@ -0,0 +1,11 @@ +import Vue from 'vue'; +import { Component } from 'vue-property-decorator'; + +@Component +export default class CounterComponent extends Vue { + currentcount: number = 0; + + incrementCounter() { + this.currentcount++; + } +} diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/counter/counter.vue.html b/ASP.NET Core Basics/src/Vue/ClientApp/components/counter/counter.vue.html new file mode 100644 index 0000000..570d1a2 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/counter/counter.vue.html @@ -0,0 +1,13 @@ + + + diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/fetchdata/fetchdata.ts b/ASP.NET Core Basics/src/Vue/ClientApp/components/fetchdata/fetchdata.ts new file mode 100644 index 0000000..c6108f9 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/fetchdata/fetchdata.ts @@ -0,0 +1,22 @@ +import Vue from 'vue'; +import { Component } from 'vue-property-decorator'; + +interface WeatherForecast { + dateFormatted: string; + temperatureC: number; + temperatureF: number; + summary: string; +} + +@Component +export default class FetchDataComponent extends Vue { + forecasts: WeatherForecast[] = []; + + mounted() { + fetch('api/SampleData/WeatherForecasts') + .then(response => response.json() as Promise) + .then(data => { + this.forecasts = data; + }); + } +} diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/fetchdata/fetchdata.vue.html b/ASP.NET Core Basics/src/Vue/ClientApp/components/fetchdata/fetchdata.vue.html new file mode 100644 index 0000000..1b64774 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/fetchdata/fetchdata.vue.html @@ -0,0 +1,30 @@ + + + diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/home/home.vue.html b/ASP.NET Core Basics/src/Vue/ClientApp/components/home/home.vue.html new file mode 100644 index 0000000..d418e70 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/home/home.vue.html @@ -0,0 +1,19 @@ + \ No newline at end of file diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/navmenu/navmenu.css b/ASP.NET Core Basics/src/Vue/ClientApp/components/navmenu/navmenu.css new file mode 100644 index 0000000..b7404b4 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/navmenu/navmenu.css @@ -0,0 +1,59 @@ +.main-nav li .glyphicon { + margin-right: 10px; +} + +/* Highlighting rules for nav menu items */ +.main-nav li a.router-link-active, +.main-nav li a.router-link-active:hover, +.main-nav li a.router-link-active:focus { + background-color: #4189C7; + color: white; +} + +/* Keep the nav menu independent of scrolling and on top of other items */ +.main-nav { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 1; +} + +@media (min-width: 768px) { + /* On small screens, convert the nav menu to a vertical sidebar */ + .main-nav { + height: 100%; + width: calc(25% - 20px); + } + .main-nav .navbar { + border-radius: 0px; + border-width: 0px; + height: 100%; + } + .main-nav .navbar-header { + float: none; + } + .main-nav .navbar-collapse { + border-top: 1px solid #444; + padding: 0px; + } + .main-nav .navbar ul { + float: none; + } + .main-nav .navbar li { + float: none; + font-size: 15px; + margin: 6px; + } + .main-nav .navbar li a { + padding: 10px 16px; + border-radius: 4px; + } + .main-nav .navbar a { + /* If a menu item's text is too long, truncate it */ + width: 100%; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +} diff --git a/ASP.NET Core Basics/src/Vue/ClientApp/components/navmenu/navmenu.vue.html b/ASP.NET Core Basics/src/Vue/ClientApp/components/navmenu/navmenu.vue.html new file mode 100644 index 0000000..4a8a963 --- /dev/null +++ b/ASP.NET Core Basics/src/Vue/ClientApp/components/navmenu/navmenu.vue.html @@ -0,0 +1,42 @@ + + +