The application allows you to name your event, search for a host location (using a location API like Foursquare), set the capacity of the event, the start and end times, and input a description of the event.
- Account creation, event creation and event display
- It is a joy to use on both desktop and mobile. On mobile, all forms are fully functional and react to touches naturally.
- The app is accessible (all forms are understandable while using a screen reader)
- The user experience is enhanced with prompts (labels, placeholders, error messages, etc) that appear in logical order and are phrased in friendly, human language.
- The inputs are kept to minimum to keep the end user happy and they are instantly validated (not later than on blur) keeping the user informed and avoiding submitting invalid information.
- Forms can be prefilled with existing user data.
- All input have appropriate types and are labeled (even if only for screen readers).
- The autofocus is applied to the first field above-the-fold.
- The required fields are kept to minimum
- The app includes a build process (using npm)
- Assets are minimized and concatenated as appropriate
- A solid starting point achieved with (https://github.com/mezod/boilerplate-koa-redux-react)
Copyright © 2016 Rafal Szczypka. This source code is licensed under the MIT license.
Project maintained by Rafal Szczypka
-
Clone repo
-
Install dependencies
npm install
-
Make build
npm run build
-
Run development server
npm run dev
Development server should be running at http://localhost:8080/
- Node - JS runtime environment
- npm - package manager
- Babel - ES6 transpiler
- Webpack - module bundler & task runner
- React - interfaces
- react-hot-loader - hot reloading for react
- react-router - react application router
- react-redux - react bindings for redux
- Immutable - data structures
- Redux - awesome flux architecture
- redux-thunk - thunk middleware for redux
- SASS - styles
- ESLint - linter
- react-geosuggest - A React autosuggest for the Google Maps Places API
- react-widgets - A React combobox and datepicker
- redux-form - works with React Redux to enable html form in React to use Redux to store all of its state
- Firebase - persisten storage
- A bunch of useful scripts
-
npm run build
Bundles the application
-
npm run dev
Starts webpack development server
-
npm run lint
Runs the linter
-
npm run deploy
Creates the production ready files
-
npm run clean
Removes the bundled code and the production ready files