Reformatting About this Module for GitHub

docs/en/about-this-module.md

@@ -1,18 +1,18 @@
-#About this module#
+# About this module
 
-##Introduction##
+## Introduction
 
 This is a simple module that works similar to ModelAdmin, but instead of editing all records for a given DataObject, it displays a Detailsf form for one single record - equivalent to SiteConfig. It was build primarily for the purpose of finding out how React works in the SilverStripe 4 CMS. 
 
 At the time of writing, only the `Campaigns` and `Files` sections have actually been converted to React. GridField hadn't been converted yet, so it can't be used for related records just yet, for now making the module less usable then it might have been - or will be.
 
 
-##1. Setup##
+## 1. Setup
 
 The module has been setup close to the SilverStripe way of doing things:
 
 
-###Folder structure for React###
+### Folder structure for React
 
 For frontend development the React source lives in `client\src` and the resulting bundles are found in `client\dist`. For backend applications, the client folder structure is placed within an `admin` folder, as shown below.
 
@@ -23,12 +23,12 @@ SilverStripe by default generates separate css files for its modules, instead of
 **Note**: although at this point the module doesn't need extra styling, the style files are kept in as example.
 
 
-###package.json###
+### package.json
 
 The list of Node dependencies in package.json may seem arbitrary - it's up to the developer to define what they actually need to include.
 
 
-###@SilverStripewebpack-config###
+### @SilverStripewebpack-config
 
 SilverStripe has developed a npm module @SilverStripe/webpack-config. It takes away the hassle of connecting to SilverStripe modules, and does some other configuration, leaving you with a relatively simple webpack configuration for the module. You don't have to use it, but it is sort of comfortable. 
 
@@ -47,12 +47,12 @@ When `development` is set, @silverstripe will generate map files for use with Re
 When `production` is set, @SilverStripe/webpack-config sets up and enforces ESlint to check and format the  code. 
 
 
-###webpack.config: backend or frontend###
+### webpack.config: backend or frontend
 
 When @SilverStripe/webpack-config is used, the resulting webpack.config.js can be fairly simple. The current config is aimed at backend development, but it is easy to change it to frontend by changin `PATHS.ADMIN` to `PATH.MODULE`. 
 
 
-##2. How this module works##
+## 2. How this module works
 The main README.MD file explains how to use the module. This section is about how it functions internally. There are two things to this module:
 
 * Building an Admin React module (the primary goal)
@@ -61,14 +61,14 @@ The main README.MD file explains how to use the module. This section is about ho
 There are two php classes to this module: `DetailsAdmin` and `DetailsAdminPermissions`. The first abstract class is the actual module, the second is a helper class,
 
 
-###DetailsAdminPermissions.php###
+### DetailsAdminPermissions.php
 
 As `DetailsAdmin` is an abstract class, just like ModelAdmin, it can't implement PermissionProvider so someone else needs to do that for them. In the case of ModelAdmin that helper is LeftAndMain, in this case `DetailsAdminPermissions` does the work.
 
 ***Note:** DetaisAdmin is an abstract class because it is just a base class: only its extensions should appear in the CMS Menu, not the base class itself!*
 
 
-###DetailsAdmin.php###
+### DetailsAdmin.php
 
 This Admin Section base class has the following methods:
 
@@ -112,9 +112,9 @@ Make the form respond to validation errors with form schema if requested via rea
 
 *Note that, although we're preparing a regular SilverStripe form, it will need React to display it. If you want the forms to be generated without React as well, use editForm() and getEditForm() instead and SilverStripe will automatically build it. But it seems kind of superfluous to build the same for twice...*
 
-##3. React##
+## 3. React
 
-###Initial state###
+### Initial state
 
 In `DetailsAdmin::getClientConfig()` we define an array of data we will need for the React module to function and merge it with the existing array. The complete array for all sections will be injected into the page in de global `window.ss.config` variable, and automatically read into the Redux `initial state`. SilverStripe will handle that for us.
 
@@ -143,7 +143,7 @@ In `DetailsAdmin::getClientConfig()` we define an array of data we will need for
 ***Note**: this solution to get the module to work can/will be improved upon, but for now...*
 
 
-###ConfigHelpers###
+### ConfigHelpers
 
 **Config** is a SilverStripe React module used to read the (window.ss) data from file. We import and use it in the React 'root' file `src/bundles/bundle.js` to get to the config of all DetailsAdmin sections.
 
@@ -155,7 +155,7 @@ In `DetailsAdmin::getClientConfig()` we define an array of data we will need for
 * **ConfigHelpers.getCurrentSection()**: `Bummer, this doesn't do anything yet, and we actually need it!`
 
 
-###Registering the current DetailsAdmin###
+### Registering the current DetailsAdmin
 *admin/client/src/bundles/bundle.js*
 
 To register the current DetailsAdmin (there can be more then one for separate DataObjects), we need to know the current section name. And that isn't possible out of the box. DetailsAdmin::getClientConfig() will just add the information about each section to *window.SilverStripe.config.sections.[sectionname]>*. But we can't add anything else that way.
@@ -193,13 +193,13 @@ Now we can register the current DetailsAdmin section like this (where DetailsAdm
 *At this point we need not change state at any point, so we can skip the reducer for now, and I'm not yet sure how to 'share' a single reducer between multiple sections, so that's for later.*
 
 
-### The React DetailsAdmin Component###
+### The React DetailsAdmin Component
 *admin/client/src/containers/DetailsAdmin.js*
 
 The code above imports the React `DetailsAdmin module`, that is responsible for displaying and handling the form. Tis isn't all that difficult - the challenge is to display the right form for any current section - as we do not know what specific DetailsAdmin section we're in (ConfigHelpers.getCurrentSection() not working). Anyway, first: the setup.
 
 
-####Imports####
+#### Imports
 	import React, { Component } from 'react';
 	import PropTypes from 'prop-types';
 	import { connect } from 'react-redux';
@@ -210,7 +210,7 @@ The code above imports the React `DetailsAdmin module`, that is responsible for
 `Toolbar` and `FormBuilderLoader` are SilcverStripe React components, that are accessible because of the externalsin @silverstripe/webpack-config. Check `node-modules/@silverstripe/webpack-config/js/externals.js` for available components and how to access them.
 
 
-####Mapping state to props####
+#### Mapping state to props
 The config settings from window.SilverStripe are automatically placed in state. `mapDispatchToProps` isn't used yet but for some reason still needs to be there. `mapStateToProps` just sets (parts of) the state to be a prop in the DetailsAdmin component.
 
     function mapDispatchToProps() {
@@ -229,7 +229,7 @@ The config settings from window.SilverStripe are automatically placed in state.
     }
 
 
-####Defaults and proptypes####
+#### Defaults and proptypes
 
     DetailsAdmin.propTypes = {
       sectionConfig: PropTypes.object,
@@ -240,7 +240,7 @@ The config settings from window.SilverStripe are automatically placed in state.
     };
 
 
-####Rendering DetailAdmin####
+#### Rendering DetailAdmin
 
 This is really very simple, and it could just as easily have been a functional component at this point. But as it is bound to be extended at some point, it is setup as a class for now. The SilverStripe FormBuilderLoader is reponsible for building the form, so we don't have to bother at all here.