No description, website, or topics provided.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
client
config
scripts/cloudantInit
server
shared
.cfignore
.editorconfig
.eslintrc
.gitignore
README.md
manifest.yml
package-lock.json
package.json

README.md

Hangovers Database

welcome to Sage.

Useful Links

Arrangement Info

the Song

  • Song Title
  • Abbreviation
  • Original Artist(s)
  • Year Released
  • Genre

the Arrangement Itself

  • Arranger(s)
  • Key
  • When Arranged
  • Type (handwritten original, copy of handwritten, copy of electronic, electronic)
  • Syllables (y/n)

Performances, etc

  • Active
  • Semester(s) Performed
  • Concert(s) Featured In
  • Album(s) Appeared On
  • Soloist(s)

Files and such

  • PDF (link to file)
  • Finale (link to file)
  • Recording (link to file)
  • Youtube (link to the tube)
  • Spotify Link for original song
  • Spotify Link for hangovers version

Understanding, Configuring, and Building

There are a few pre-configured npm scripts.

Install Dependencies

Before you do anything else, you'll need to:

npm i
cd client
npm i

Build (and run) the Production Bundle

To build a minifed JS bundle and minified CSS bundle uner the build directory, this is the script for you. It also will copy any resources (such as index.html and the favicon) placed in the public directory and place them in build.

npm run build

Then to run the server and serve that directory, you'll spin up "production mode" (no hot reloading). This simply spins up the server under server/app.js, serves what's in the build directory, maintains the endpoints, and interfaces with the database.

npm start

Run in developer mode

This is where the magic happens. This introduces the webpack dev and hot middleware (the correct environment variables are set via npm better run), which rebuilds the bundle on css or js changes and injects it into the browser using magic. No reloading necessary! Also through the powers of redux there's time travel so you can edit code on the fly and go forwards and backwards with your actions.

npm run dev

Initialize and Seed the Database

This makes sure the database exists and adds the "starter" docs: albums, concerts, hangovers, semesters, arrangement types, album formats, qualities, and a design doc to view each type on its own.

npm run init

Test

There currently are no tests. heh...

npm run test

Lint

npm run lint

Generate the TOC

To generate the table of contents at the top of this README, ya just gotta:

npm run toc

A Note About Clientside Code Structure

To handle the discrepancies between running the client code in "dev mode" or "production mode", there are two helpers provided - boilerplate/Root.js and boilerplate/configureStore.js. These modules conditionally load the .dev or .prod extension of their respective file depending on the environment variables when webpack is running. The only difference in the respective versions are loading the necessary tooling for the dev/debugging redux awesomeness. In dev mode, the DevTools react component loads and renders which provides a visual history of all the actions and allows you to go forwards and backwards in time. It also logs all the state changes.

Hooking up to Cloudant and Backblaze Backend

Cloudant docs here.

To hook up to cloudant and backblaze, simply fill out the environment variables listed in config/.env.example in a new file config/.env (git ignored for obvious reasons).

Deploying to Bluemix

First, make sure you've installed the Cloud Foundry CLI. Then:

cf login
cf target -o jdkaufma@us.ibm.com -s hangovers
npm run build
cf push sage

This'll look at manifest.yml and deploy this puppy. Make sure the environment variables used in .env are set in your Bluemix runtime.

Using Build pipeline

Again, the build pipeline is here. It's hooked up to the master branch of this repo. So pushing'll trigger a build and deploy.

Because these are on a server somewhere else, here are the build and deploy scripts, so at least they're like sort of in source control, ya know?

Build Stage

#!/bin/bash
node_version=v8.9.4
install_name=node-v8.9.4-linux-x64
if [ ! -e $install_name.tar.gz ]; then
    wget "http://nodejs.org/dist/$node_version/$install_name.tar.gz"
    echo 'Untarring'
    tar xf $install_name.tar.gz
fi
NODE_6_INSTALL_DIR=`pwd`/$install_name/bin
PATH=$NODE_6_INSTALL_DIR:$PATH
node -v

echo 'Updating npm'
npm i npm@latest -g

npm i
cd client
npm i
cd ..
npm run build

Deploy Stage

Make sure to select the target, org, space, and app. Then the actual script is:

#!/bin/bash
cf push "${CF_APP}"