test

Author: ryoldash

reactjs/.gitignore

@@ -0,0 +1,21 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

reactjs/README.md

@@ -0,0 +1,17 @@
+# ASP.NET Boilerplate ReactJS Template
+
+The React.js integration for ABP Boilerplate framework. This template is built on React+Mobx+Typescript. SOLID, SoC principles are used.
+
+# Architecture
+
+This framework is designed by utilizing MVC design pattern and layered architecture as follows:
+
+- All Backend communications are done by service layer.
+- For every Container Component there exists one Store and one Model.
+- Store has state of application so it consumes service See "Defining data stores". All service functions will be called in store not in Component. Component executes Store actions when state is needed.
+- Presentational Component can use store directly by injecting the store or Props from Container Component can be passed in it.
+- Container or Presentational Component can invoke store actions and automatic rendering of component will be done by Mobx.
+
+InversifyJS IoC container is used to ensure dependency inversion. All of services has one interface and one implementation, so mocks can be used easily when writing tests.
+
+![](_screenshots/architecture.jpg)

reactjs/_screenshots/architecture.jpg

@@ -0,0 +1,34 @@
+const tsImportPluginFactory = require('ts-import-plugin')
+const {
+    getLoader
+} = require("react-app-rewired");
+const rewireLess = require('react-app-rewire-less');
+
+module.exports = function override(config, env) {
+    const tsLoader = getLoader(
+        config.module.rules,
+        rule =>
+        rule.loader &&
+        typeof rule.loader === 'string' &&
+        rule.loader.includes('ts-loader')
+    );
+
+    tsLoader.options = {
+        getCustomTransformers: () => ({
+            before: [tsImportPluginFactory({
+                libraryDirectory: 'es',
+                libraryName: 'antd',
+                style: 'css',
+            })]
+        })
+    };
+
+    config = rewireLess.withLoaderOptions({
+        javascriptEnabled: true,
+        modifyVars: {
+            "@primary-color": "#1DA57A"
+        },
+    })(config, env);
+
+    return config;
+}

reactjs/config-overrides.js

@@ -0,0 +1,7 @@
+declare module '*.svg'
+declare module '*.png'
+declare module '*.jpg'
+declare module '*.jpeg'
+declare module '*.gif'
+declare module '*.bmp'
+declare module '*.tiff'