Update documentation

Add necessary dir structure and files for v3 release
Rendez · Jan 7, 2016 · 8afd08c · 8afd08c
1 parent 4580154
commit 8afd08c
Show file tree

Hide file tree

Showing 18 changed files with 112 additions and 87 deletions.
diff --git a/README.md b/README.md
@@ -133,30 +133,6 @@ The name and icon to be displayed are set in the `app/manifest.json` file. Chang
 
 Delete [`manifest.json`](app/manifest.json) and remove the `<link rel="manifest" href="manifest.json">` tag from the [`index.html`](app/index.html).
 
-## Gotchas
-
-These are some things to be aware of when using this boilerplate.
-
-### Images in the HTML file(s)
-
-Adding images to the HTML is a bit of a pain right now as webpack only goes through the JavaScript file. Add the image to your HTML file how you always would:
-
-```HTML
-<!-- Normal Image -->
-<img src="img/yourimg.png" />
-<!-- Meta tags -->
-<meta property="og:image" content="img/yourimg.png" />
-<!-- ... -->
-```
-
-If you simply do this, webpack will not transfer the images to the build folder. To get webpack to transfer them, you have to import them with the file loader in your JavaScript somewhere, e.g.:
-
-```JavaScript
-import 'file?name=[name].[ext]!../img/yourimg.png';
-```
-
-Then webpack will correctly transfer the image to the build folder.
-
 ## License
 
 This project is licensed under the MIT license, Copyright (c) 2015 Maximilian Stoiber. For more information see `LICENSE.md`.
diff --git a/docs/CSS.md b/docs/CSS.md
diff --git a/docs/JS.md b/docs/JS.md
diff --git a/docs/README.md b/docs/README.md
@@ -1,11 +1,3 @@
 # Documentation
 
-* [`commands.md`](COMMANDS.md): The commands you can run in the command line.
-
-* [`css.md`](CSS.md): PostCSS plugins used, folder structure of the css folder.
-
-* [`files.md`](FILES.md): The files in the root folder and what they're used for.
-
-* [`js.md`](JS.md): The JavaScript folder structure explained.
-
-* [`unit-testing.md`](unit-testing.md): A deeper look into unit testing.
+**Add ToC of the documentation here as soon as it's finished**
diff --git a/docs/css/css-modules.md b/docs/css/css-modules.md
@@ -0,0 +1,5 @@
+# CSS Modules
+
+## Why?
+
+## How?
diff --git a/docs/css/postcss.md b/docs/css/postcss.md
@@ -0,0 +1,25 @@
+# PostCSS
+
+## Why?
+
+## How?
+
+## Which plugins?
+
+This boilerplate includes a few plugins by default:
+
+* `postcss-import`: Inlines `@import`ed stylesheets to create one big stylesheet.
+
+* `postcss-simple-vars`: Makes it possible to use `$variables in your CSS.
+
+* `postcss-focus`: Adds a `:focus` selector to every `:hover`.
+
+* `autoprefixer-core`: Prefixes your CSS automatically, supporting the last two versions of all major browsers and IE 8 and up.
+
+* `cssnano`: Optimizes your CSS file. For a full list of optimizations check [the offical website](http://cssnano.co/optimisations/).
+
+* `postcss-reporter`: Makes warnings by the above plugins visible in the console.
+
+For a full, searchable catalog of plugins go to [postcss.parts](http://postcss.parts).
+
+## How to remove?
diff --git a/docs/COMMANDS.md → docs/general/commands.md b/docs/COMMANDS.md → docs/general/commands.md
diff --git a/docs/general/faq.md b/docs/general/faq.md
@@ -0,0 +1,3 @@
+# Frequently Asked Questions
+
+## Hot-reloading doesn't work?!
diff --git a/docs/FILES.md → docs/general/files.md b/docs/FILES.md → docs/general/files.md
diff --git a/docs/general/gotchas.md b/docs/general/gotchas.md
@@ -0,0 +1,23 @@
+# Gotchas
+
+These are some things to be aware of when using this boilerplate.
+
+## Images in the HTML file(s)
+
+Adding images to the HTML is a bit of a pain right now as webpack only goes through the JavaScript file. Add the image to your HTML file how you always would:
+
+```HTML
+<!-- Normal Image -->
+<img src="img/yourimg.png" />
+<!-- Meta tags -->
+<meta property="og:image" content="img/yourimg.png" />
+<!-- ... -->
+```
+
+If you simply do this, webpack will not transfer the images to the build folder. To get webpack to transfer them, you have to import them with the file loader in your JavaScript somewhere, e.g.:
+
+```JavaScript
+import 'file?name=[name].[ext]!../img/yourimg.png';
+```
+
+Then webpack will correctly transfer the image to the build folder.
diff --git a/docs/general/offline-first.md b/docs/general/offline-first.md
@@ -0,0 +1,13 @@
+# Offline first
+
+## AppCache
+
+### Remove AppCache
+
+## ServiceWorker
+
+### Remove ServiceWorker
+
+## Add to homescreen
+
+### Remove add to homescreen functionality
diff --git a/docs/general/prerequisites.md b/docs/general/prerequisites.md
@@ -0,0 +1,9 @@
+# Prerequisites
+
+## Node
+
+### `npm`
+
+## git
+
+## Windows
diff --git a/docs/js/es6.md b/docs/js/es6.md
@@ -0,0 +1 @@
+# ES6
diff --git a/docs/js/react/README.md b/docs/js/react/README.md
@@ -0,0 +1,23 @@
+# React
+
+## Components and containers
+
+OLD VERSION:
+
+> # `JS`
+
+> ## Folder Structure
+
+> The folder structure of the JS files reflects how [Redux](https://github.com/gaearon/redux) works. If you are not familiar with Redux check out the [official documentation](https://gaearon.github.io/redux/).
+
+> * `actions`: Actions get dispatched with this/these utility module(s)
+
+> * `components`: The main JS folder. All your React components should be in this folder, for big projects they might be grouped into seperate subfolders. E.g. a navigation component `Nav.react.js`
+
+>     * `/pages`: Actual pages (routes) users can visit.
+
+> * `constants`: Action constants are defined in this/these utility module(s)
+
+> * `reducers`: Reducers manage the state of an app, basically a simplified implementation of Stores in Flux. For an introduction to reducers, watch [this talk](https://www.youtube.com/watch?v=xsSnOQynTHs) by @gaearon.
+
+> * `app.js`: The entry point of the application. Mostly setup and boilerplate code. Routes are configured in the JSX here!
diff --git a/docs/js/react/redux.md b/docs/js/react/redux.md
@@ -0,0 +1,3 @@
+# Redux
+
+## `redux-thunk`
diff --git a/docs/testing/browser-testing.md b/docs/testing/browser-testing.md
@@ -0,0 +1,3 @@
+# Browser testing
+
+## `npm run serve`
diff --git a/docs/testing/component-testing.md b/docs/testing/component-testing.md
@@ -0,0 +1,3 @@
+# Component testing
+
+## enzyme
diff --git a/docs/unit-testing.md → docs/testing/unit-testing.md b/docs/unit-testing.md → docs/testing/unit-testing.md
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		# Frequently Asked Questions

		## Hot-reloading doesn't work?!