<commit_before># Community site SPA based on ReactJS 
[![Build Status](https://travis-ci.org/WRidder/react-spa.svg?branch=master)](https://travis-ci.org/WRidder/react-spa)

A real-time single page application based on React and (Re)flux to discover best practices regarding a multitude of use cases. Contains a simple server with in-memory database in *./server*.

### Installation
1. Run *$ npm install* in the base directory
2. Run *$ bower install* in the base directory
3. Run *$ npm install* in the ./server directory
4. Start the server in ./server using *$ node server.js*. Should open a port on 8080.
5. Run *$ gulp* in the base directory, this will open a browser with the application on http://localhost:3000/

### Current state
* Discovery
* > **Proof of concept** <
* Refactoring
* Stabilizing

### Goal
Create a more advanced example (w.r.t. your average TODO app) of creating a SPA using ReactJS. Initially as a personal exercise to go *through the mud* once while hoping to share new insights gained during the process and discuss various approaches. 

This will be by no means a production ready application. Objectives and goals are subject to change.

#### Primary objectives
* Find sensible approaches to using reactjs with (re)flux
* Scalable solutions (both in size and regarding developers)
* Isomorphic application
* Tests (unit, integration and functional) for all essential components
* Build methods
* Realtime connections
* File/folder layout

#### Secondary objectives
* Load modules on demand
* SEO 
* Accessibility

### Application design
#### Features
* User login and registration
* Forum-like discussions
* Realtime connections
* Stackoverflow-like questions
* Chat
* Updates

#### Roles
* Guest
  * Can view public pages
  * Can login
  * Can create account
* User
  * Can view restricted pages
  * Can create questions, discussions and comments. 
  * Can delete own comments
* Moderator
  * Can delete comments, discssions and comments from other users
* Administrator

#### Layout
**Home page**
```
+---------------------------------------------------------------------------+
| Logo                                                 Account   Updates(5) |
| +----------+ +-----------+ +-------------+  +-------------+ +-----------+ |
| | Home     | | Questions | | Discussions |  | About       | | Chat      | |
| +----------+ +-----------+ +-------------+  +-------------+ +-----------+ |
|                                                                           |
+---------------------------------------------------------------------------+
|  Homepage                                                                 |
|                                                                           |
|                            List of updates                                |
|                                                                           |
+---------------------------------------------------------------------------+
|(c) notice                                                                 |
+---------------------------------------------------------------------------+
```
### Libraries
* [ReactJS](https://facebook.github.io/react/)
* [Reflux](https://github.com/spoike/refluxjs)
* [React-router](https://github.com/rackt/react-router/)
* [ImmutableJS](https://github.com/facebook/immutable-js)
* [Material-ui](https://github.com/callemall/material-ui)
* [SocketIO](http://socket.io/)

### Best practices
* [SMACCS](https://smacss.com/)

### Foundations
* [React starter kit](https://github.com/kriasoft/react-starter-kit)

### Resources
#### Blogs
* [krawaller.se](http://blog.krawaller.se/)
* [spoike.ghost.io](http://spoike.ghost.io/)

#### Discussions
* [Google ReactJS group](https://groups.google.com/forum/#!forum/reactjs)
* [ReactJS subreddit](https://www.reddit.com/r/reactjs/search?q=reactjs&sort=relevance&restrict_sr=on&t=all)

#### Books
* [Developing a React.js Edge](http://shop.oreilly.com/product/9781939902122.do)
<commit_msg>Readme update<commit_after># Community site SPA based on ReactJS 
[![Build Status](https://travis-ci.org/WRidder/react-spa.svg?branch=master)](https://travis-ci.org/WRidder/react-spa)

A real-time single page application based on React and (Re)flux to discover best practices regarding a multitude of use cases. Contains a simple server with in-memory database in *./server*.

### Installation
1. Run *$ npm install* in the base and in the ./server directory
2. Run *$ bower install* in the base directory
3. Start the server in ./server using *$ node server.js*. Should open a port on 8080.
4. Run *$ gulp* in the base directory. This will watch for file changes and build when necessary.
5. Navigate your browser to http://localhost:8080; will reload on client changes.

### Current state
* Discovery
* > **Proof of concept** <
* Refactoring
* Stabilizing

### Goal
Create a more advanced example (w.r.t. your average TODO app) of creating a SPA using ReactJS. Initially as a personal exercise to go *through the mud* once while hoping to share new insights gained during the process and discuss various approaches. 

This will be by no means a production ready application. Objectives and goals are subject to change.

#### Primary objectives
* Find sensible approaches to using reactjs with (re)flux
* Scalable solutions (both in size and regarding developers)
* Isomorphic application
* Tests (unit, integration and functional) for all essential components
* Build methods
* Realtime connections
* File/folder layout

#### Secondary objectives
* Load modules on demand
* SEO 
* Accessibility

### Application design
#### Features
* User login and registration
* Forum-like discussions
* Realtime connections
* Stackoverflow-like questions
* Chat
* Updates

#### Roles
* Guest
  * Can view public pages
  * Can login
  * Can create account
* User
  * Can view restricted pages
  * Can create questions, discussions and comments. 
  * Can delete own comments
* Moderator
  * Can delete comments, discssions and comments from other users
* Administrator

#### Layout
**Home page**
```
+---------------------------------------------------------------------------+
| Logo                                                 Account   Updates(5) |
| +----------+ +-----------+ +-------------+  +-------------+ +-----------+ |
| | Home     | | Questions | | Discussions |  | About       | | Chat      | |
| +----------+ +-----------+ +-------------+  +-------------+ +-----------+ |
|                                                                           |
+---------------------------------------------------------------------------+
|  Homepage                                                                 |
|                                                                           |
|                            List of updates                                |
|                                                                           |
+---------------------------------------------------------------------------+
|(c) notice                                                                 |
+---------------------------------------------------------------------------+
```
### Libraries
* [ReactJS](https://facebook.github.io/react/)
* [Reflux](https://github.com/spoike/refluxjs)
* [React-router](https://github.com/rackt/react-router/)
* [ImmutableJS](https://github.com/facebook/immutable-js)
* [Material-ui](https://github.com/callemall/material-ui)
* [SocketIO](http://socket.io/)

### Best practices
* [SMACCS](https://smacss.com/)

### Foundations
* [React starter kit](https://github.com/kriasoft/react-starter-kit)

### Resources
#### Blogs
* [krawaller.se](http://blog.krawaller.se/)
* [spoike.ghost.io](http://spoike.ghost.io/)

#### Discussions
* [Google ReactJS group](https://groups.google.com/forum/#!forum/reactjs)
* [ReactJS subreddit](https://www.reddit.com/r/reactjs/search?q=reactjs&sort=relevance&restrict_sr=on&t=all)

#### Books
* [Developing a React.js Edge](http://shop.oreilly.com/product/9781939902122.do)

### Changelog
[22-nov-14] Initial version
[24-nov-14] Sessions (login/logout/profile); html5 puhsState; single server

{'fraction_non_alphanumeric': 0.21016533986527863, 'fraction_numerical': 0.00771586037966932, 'mean_word_length': 1.7504210171775008, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 22, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 32, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1128799', 'n_tokens_mistral': 2074, 'n_tokens_neox': 2009, 'n_words': 625}