???

This is a simple starter app to build a server and client rendered application.

It uses:

• server:
  • express for handling requests
  • connect-flash for sending messages to the user after they submit a form
  • body-parser for handling POST requests
  • express-session for managing user sessions
  • passport for authentication
  • passport-github2 for logging in through github
  • passport-local for logging in through email and password
  • socket-io for real time communication
• database stuff:
  • sqlite3 for storing data
  • knex for easily communicating with sqlite
• html stuff:
  • react for generating a dynamic HTML structure
  • react-dom for converting React to DOM elements
  • react-helmet for managing the page's title and body from React
  • react-router for managing urls
  • react-router-dom for managing urls on the browser side
• css stuff
  • typestyle for writing CSS as JS
  • csstips helpers for typestyle
  • csx helpers for typestyle
  • node-sass allows to read Sass files and convert them to CSS
• build stuff (webpack)
  • css:
    • style-loader allows webpack to load CSS files and insert them in the page
    • autoprefixer allows webpack to automatically add vendor prefixes
    • sass-loader allowes webpack to automatically load and run SASS files
    • extract-text-webpack-plugin allows webpack to extract the CSS and put it in an independant CSS file (used in production mode only)
  • other:
    • razzle zero-conf webpack setup
    • ignore-loader allows to ignore certain files (needed for the server to ignore SASS files and such)
    • webpack-visualizer-plugin creates an HTML file that shows how heavy our JS/CSS is

Quickstart

fork/clone the repo, then, inside the folder,

install the necessary packages

yarn install

Run the app

yarn start

It's possible that you may have to interrupt the first build (ctrl-c), and run yarn start again.
This only happens on the first build.

Structure

There's README.md in each directory that explains its purpose