Updates/1.3.0

.gitignore

@@ -14,6 +14,7 @@ GitHubGit
 MVC/packages/*
 MVC/MVC/bin/*
 MVC/MVC/obj/*
+MVC/MVC/node_modules/*
 KenticoAdmin/packages/*
 KenticoAdmin/CMS/bin/*
 KenticoAdmin/CMS/obj/*
@@ -38,4 +39,14 @@ MVC/MVC.Models/bin
 MVC/MVC.Models/obj
 XperienceModels/bin
 XperienceModels/obj
-!README.md
+!README.md
+
+# Ignore files that automatically build from source using npm gulp
+MVC/MVC/wwwroot/css/bundles/**/*
+MVC/MVC/wwwroot/js/bundles/**/*
+MVC/MVC/wwwroot/css/Custom.css
+MVC/MVC/wwwroot/css/EditMode.css
+MVC/MVC/wwwroot/js/scripts/Custom.js*
+MVC/MVC/wwwroot/js/scripts/HeaderCustom.js*
+MVC/MVC/wwwroot/js/scripts/helpers.js*
+MVC/MVC/wwwroot/js/scripts/samplereact.js*

KenticoAdmin/CMS/App_Data/Install/Hotfix.txt

@@ -1 +1 @@
-57
+64

MVC/MVC.Libraries/MVC.Libraries.csproj

@@ -8,7 +8,7 @@
   <ItemGroup>
     <PackageReference Include="AutoMapper" Version="10.1.1" />
     <PackageReference Include="AutoMapper.Extensions.Microsoft.DependencyInjection" Version="8.1.1" />
-    <PackageReference Include="Kentico.Xperience.AspNetCore.WebApp" Version="13.0.62" />
+    <PackageReference Include="Kentico.Xperience.AspNetCore.WebApp" Version="13.0.64" />
     <PackageReference Include="MVCCaching.Base.Core" Version="2.1.1" />
     <PackageReference Include="MVCCaching.Kentico.Core" Version="13.0.2" />
     <PackageReference Include="Newtonsoft.Json" Version="13.0.1" />

MVC/MVC/.npmrc

@@ -0,0 +1 @@
+scripts-prepend-node-path=true

MVC/MVC/App_Start/StartupConfig.cs

@@ -38,6 +38,8 @@
 using Generic.Repositories.Implementation;
 using System.Collections.Generic;
 using XperienceCommunity.WidgetFilter;
+using Microsoft.Extensions.FileProviders;
+using System.IO;
 
 namespace Generic.App_Start
 {
@@ -296,6 +298,27 @@ public static void RegisterDotNetCoreConfigurationsAndKentico(IApplicationBuilde
 
             app.UseStaticFiles();
 
+            // While IIS and IIS Express automatically handle StaticFiles from the root, default Kestrel doesn't, so safer to 
+            // add this for any Site Media Libraries if you ever plan on linking directly to the file.  /getmedia linkes are not
+            // impacted. 
+            //
+            // Also, if you ever need to bypass the IIS/IIS Express default StaticFile handling, you can add a web.config in the media folder 
+            // with the below:
+            // <?xml version="1.0"?>
+            // <configuration>
+            //     <system.webServer>
+            //         <handlers>
+            //             <add name="ForceStaticFileHandlingToNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Either" requireAccess="Read" />
+            //         </handlers>
+            //     </system.webServer>
+            // </configuration>
+            app.UseStaticFiles(new StaticFileOptions()
+            {
+                FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "Baseline")),
+                RequestPath = "/Baseline"
+            });
+
+
             app.UseKentico();
 
             app.UseCookiePolicy();

MVC/MVC/wwwroot/css/Custom.less → MVC/MVC/FrontEndDev/less/Custom.less

@@ -7,7 +7,6 @@
     }
 }
 
-
 .active > a {
     font-weight: bold;
 }
@@ -22,4 +21,4 @@ img.Logo {
 
 .validation-summary-valid {
     display: none;
-}
+}

MVC/MVC/FrontEndDev/react/sampleapp/app.tsx

@@ -0,0 +1,21 @@
+import * as ReactDOM from 'react-dom';
+import * as React from 'react';
+import {HelloWorld} from './components/HelloWorld'
+
+
+// declare my helper in the window interface
+declare global {
+    interface Window {
+        ReactMethods: ReactMethods
+    }
+}
+export class ReactMethods {
+    static SampleApp(containerID : string): void {
+        ReactDOM.render(
+            <HelloWorld CustomMessage="Testing etc" />
+            , document.getElementById(containerID));
+    }
+}
+
+// Can access your methods with window.ReactMethods.SampleApp("MyContainer")
+window.ReactMethods = ReactMethods;

MVC/MVC/FrontEndDev/react/sampleapp/components/HelloWorld.tsx

@@ -0,0 +1,33 @@
+import * as React from "react";
+import ReactDOM = require("react-dom");
+
+export class HelloWorld extends React.Component<IHelloWorldProps, IHelloWorldState> {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            DisplayedMessage: false
+        }
+    }
+    componentDidMount() {
+    }
+    componentDidUpdate() {
+    }
+    render() {
+        return <div>
+            Hello world!
+            {this.state.DisplayedMessage && 
+                <p>{this.props.CustomMessage}</p>
+            }
+            {!this.state.DisplayedMessage &&
+                <button type="button" onClick={this.DisplayMessageClick}>Show Message</button>
+            }
+            </div>
+    }
+
+    DisplayMessageClick = () => {
+        this.setState({
+            DisplayedMessage: true
+        });
+    }
+}

MVC/MVC/FrontEndDev/react/sampleapp/interfaces/IHelloWorldProps.ts

@@ -0,0 +1,3 @@
+interface IHelloWorldProps {
+    CustomMessage? : string;
+}

MVC/MVC/FrontEndDev/react/sampleapp/interfaces/IHelloWorldState.ts

@@ -0,0 +1,3 @@
+interface IHelloWorldState {
+    DisplayedMessage : boolean;
+}

MVC/MVC/FrontEndDev/react/sampleapp/webpack.config.js

@@ -0,0 +1,40 @@
+const path = require('path');
+const isDevelopment = (process.env.NODE_ENV !== undefined && process.env.NODE_ENV.toLowerCase() === "development" ? true : false);
+
+module.exports = {
+    entry: "/FrontEndDev/react/sampleapp/app.tsx",
+    mode: isDevelopment ? "development" : "production",
+    output: {
+        filename: "samplereact.js",
+        path: path.resolve(__dirname, "../../../wwwroot/js/scripts")
+    },
+    // Enable sourcemaps for debugging webpack's output. 
+    devtool: "source-map",
+    resolve: {
+        // Add '.ts' and '.tsx' as resolvable extensions. 
+        extensions: [".ts", ".tsx", ".js"]
+    },
+     module: {
+        rules: [
+            {
+                test: /\.ts(x?)$/,
+                exclude: /node_modules/,
+                use: [
+                    {
+                        loader: "ts-loader"
+                    }
+                ]
+            },
+
+            // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'. 
+            {
+                enforce: "pre",
+                test: /\.js$/,
+                loader: "source-map-loader"
+            }
+        ]
+    },
+    optimization: {
+        minimize: false
+    }
+} 

MVC/MVC/FrontEndDev/typescript/Custom/custom.ts

@@ -0,0 +1,13 @@
+/* Content here */
+export function testCustom(): Test {
+    var testing: Test = { message: "Hello World" };
+    return testing;
+}
+
+interface Test {
+    message: string;
+}
+
+document.addEventListener("ready", function () {
+    var test = testCustom();
+});

MVC/MVC/FrontEndDev/typescript/Custom/webpack.config.js

@@ -0,0 +1,40 @@
+const path = require('path');
+const isDevelopment = (process.env.NODE_ENV !== undefined && process.env.NODE_ENV.toLowerCase() === "development" ? true : false);
+
+module.exports = {
+    entry: "/FrontEndDev/typescript/Custom/custom.ts",
+    mode: isDevelopment ? "development" : "production",
+    output: {
+        filename: "Custom.js",
+        path: path.resolve(__dirname, "../../../wwwroot/js/scripts")
+    },
+    // Enable sourcemaps for debugging webpack's output. 
+    devtool: "source-map",
+    resolve: {
+        // Add '.ts' and '.tsx' as resolvable extensions. 
+        extensions: [".ts", ".tsx", ".js"]
+    },
+    module: {
+        rules: [
+            {
+                test: /\.ts(x?)$/,
+                exclude: /node_modules/,
+                use: [
+                    {
+                        loader: "ts-loader"
+                    }
+                ]
+            },
+
+            // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'. 
+            {
+                enforce: "pre",
+                test: /\.js$/,
+                loader: "source-map-loader"
+            }
+        ]
+    },
+    optimization: {
+        minimize: false
+    }
+}