/aqua

:bulb: A website and user system starter

Primary LanguageJavaScriptMIT LicenseMIT

No longer maintained

Boilerplates can be a huge time sink to maintain and I've decieded to archive this project.

I started the work for upgrading to hapi v17 and using async/await instead of callbacks, that work can be found in the hapi-17-async-await branch.

Thanks for your interest in my projects.


Aqua

A website and user system starter.

Build Status

Features

  • Universal front-end website
    • Basic web pages ready to customize
    • Contact page with form to email
    • Account sign-up page
    • Login pages including forgot and reset password
  • My account area
    • Stub dashboard ready to customize
    • Settings screen to update contact info and login credentials
  • Admin back office
    • Stub dashboard ready to customize
    • Manage accounts, admins, groups and users
    • Use groups (like departments) for shared permissions
    • Granular permissions override group permissions

Live demo

url username password
https://getaqua.herokuapp.com/ root root

Technology

Server side, Aqua is built with the hapi framework. We're using MongoDB as a data store.

The front-end is built with React. We use Redux as our state container. Client side routing is done with React Router. We're using Gulp for the build system.

We use bcrypt for hashing secrets. If you have issues during installation related to bcrypt then refer to this wiki page.

API only

If you don't use React and/or would rather bring your own front-end, checkout Frame. It's just the HTTP API parts of Aqua.

Installation

$ git clone git@github.com:jedireza/aqua.git
$ cd aqua
$ npm install

Configuration

Simply edit config.js. The configuration uses confidence which makes it easy to manage configuration settings across environments. Don't store secrets in this file or commit them to your repository.

Instead, access secrets via environment variables. We use dotenv to help make setting local environment variables easy (not to be used in production).

Simply copy .env-sample to .env and edit as needed. Don't commit .env to your repository.

First time setup

WARNING: This will clear all data in the following MongoDB collections if they exist: accounts, adminGroups, admins, authAttempts, sessions, statuses, and users.

$ npm run first-time-setup

# > aqua@0.0.0 first-time-setup /home/jedireza/projects/aqua
# > node first-time-setup.js

# MongoDB URL: (mongodb://localhost:27017/aqua)
# Root user email: jedireza@gmail.com
# Root user password:
# Setup complete.

Running the app

$ npm start

# > aqua@0.0.0 start /Users/jedireza/projects/aqua
# > gulp react && gulp

# [23:41:44] Using gulpfile ~/projects/aqua/gulpfile.js
# ...

Now you should be able to point your browser to http://127.0.0.1:8000/ and see the welcome page.

nodemon watches for changes in server code and restarts the app automatically. gulp and webpack watch the front-end files and re-build those automatically too.

We also pass the --inspect flag to Node so you have a debugger available. Watch the output of $ npm start and look for the debugging URL and open it in Chrome. It looks something like this:

chrome-devtools://devtools/remote/serve_file/@62cd277117e6f8ec53e31b1be58290a6f7ab42ef/inspector.html?experiments=true&v8only=true&ws=localhost:9229/node

Running in production

$ node server.js

Unlike $ npm start this doesn't watch for file changes. Also be sure to set these environment variables in your production environment:

  • NODE_ENV=production - This is important for many different optimizations, both server-side and with the front-end build files.
  • NPM_CONFIG_PRODUCTION=false - This tells $ npm install to not skip installing devDependencies, which we need to build the front-end files.

Have a question?

Any issues or questions (no matter how basic), open an issue. Please take the initiative to read relevant documentation and be proactive with debugging.

Want to contribute?

Contributions are welcome. If you're changing something non-trivial, you may want to submit an issue before creating a large pull request.

Running tests

Lab is part of the hapi ecosystem and what we use to write all of our tests.

$ npm test

# > aqua@0.0.0 test /Users/jedireza/projects/aqua
# > lab -t 100 -S -T ./test/lab/transform -L --lint-options '{"extensions":[".js",".jsx"]}' ./test/lab/client-before.js ./test/client/ ./test/lab/client-after.js ./test/server/ ./test/lab/server-after.js ./test/misc/

#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ..................................................
#  ...............

# 865 tests complete
# Test duration: 6382 ms
# No global variable leaks detected
# Coverage: 100.00%
# Linting results: No issues

Targeted tests

If you'd like to run a specific test or subset of tests you can use the test-client and test-server scripts included in the package.json file.

You specificy the path(s) via the TEST_TARGET environment variable like:

$ TEST_TARGET=test/server/web/main.js npm run test-server

# or

$ TEST_TARGET=test/client/actions/api.js npm run test-client

License

MIT

Don't forget

What you build with Aqua is more important than Aqua.