-
Update project name and description in
package.jsonfile -
npm install, oryarn install- whatever you're into -
Create two postgres databases:
er2sqlander2sql-test(you can substitute these with the name of your own application - just be sure to go through and change thepackage.jsonandserver/db/db.jsto refer to the new names)- By default, running
npm testwill useer2sql-test, while regular development useser2sql
- By default, running
-
Create a file called
secrets.jsin the project root- This file is
.gitignore'd, and will only be required in your development environment - Its purpose is to attach the secret env variables that you'll use while developing
- However, it's very important that you not push it to Github! Otherwise, prying eyes will find your secret API keys!
- It might look like this:
process.env.GOOGLE_CLIENT_ID = 'hush hush'; process.env.GOOGLE_CLIENT_SECRET = 'pretty secret'; process.env.GOOGLE_CALLBACK = '/auth/google/callback'; - This file is
-
To use OAuth with Google, complete the step above with a real client ID and client secret from Google
- You can get them here: https://console.developers.google.com/apis/credentials
-
Finally, complete the section below to set up your linter
Linters are fundamental to any project - they ensure that your code has a consistent style, which is critical to writing readable code.
Everyone has their own style, so Boilermaker does not come prepackaged with a linter. However, we strongly recommend that you (and your team, if working in a group) decide on a style, and stick with it. Here's what you need to do:
npm install -g eslint- In the root of your project,
eslint --init - You will then be prompted to choose how you want to configure ESLint. We recommend selecting the
Use a popular style guide option. The existing Boilermaker code was written in accordance with theStandardstyle, but you may choose a different one if you don't like it. - This will add an
.eslintrc.js,.eslintrc.yaml, or.eslintrc.json(depending on which you choose) -.jsor.jsonwill usually work fine. You may also need to install an appropriate eslint plugin specific for your code editor.
npm run start-dev will make great things happen!
If you want to run the server and/or webpack separately, you can also npm run start-server and npm run build-client.
From there, just follow your bliss.
Ready to go world wide? Here's a guide to deployment!
- Set up the Heroku command line tools
heroku login- Add a git remote for heroku:
-
If you're creating a new app...
heroku createorheroku create your-app-nameif you have a name in mind.heroku addons:create heroku-postgresql:hobby-devto add ("provision") a postgres database to your heroku dyno
-
If you already have a Heroku app...
heroku git:remote your-app-nameYou'll need to be a collaborator on the app.
- Make sure that all your work is fully committed and pushed to your master branch on Github.
- Checkout a new branch called "deploy":
git checkout -b deploy. If you currently have an existing branch called "deploy", delete it now (git branch -d deploy). Note that the name "deploy" here isn't magical, but it needs to match the name of the branch we specify when we push to our heroku remote. npm run deploy- this will cause the following commands to happen in order:
webpack -p: webpack will run in "production mode"git add -f public/bundle.js public/bundle.js/map: "force" add the otherwise gitignored build filesgit commit --allow-empy -m 'Deploying': create a commit, even if nothing changedgit push heroku deploy:master: push your local "deploy" branch to the "master" branch on heroku
Now, you should be deployed! To clean up, remove your deploy branch:
git checkout master: return to your master branchgit branch -d deploy: remove the deploy branch
Why do all of these steps? The big reason is because we don't want our production server to be cluttered up with dev dependencies like webpack, but at the same time we don't want our development git-tracking to be cluttered with production build files like bundle.js! By doing these steps, we make sure our development and production environments both stay nice and clean!
(By the way, if performing these steps seems tedious and error-prone, try writing a shell script that will do them all for you!)