|
1 |
| -# Boilermaker |
| 1 | +##Project-Hactive! |
2 | 2 |
|
3 |
| -*Good things come in pairs* |
| 3 | +What: A cyberpunk dialogue-driven adventure game that challenges players to code |
4 | 4 |
|
5 |
| -Looking to mix up a backend with express/sequelize and a frontend with react/redux? That's `boilermaker`! |
6 |
| - |
7 |
| -Follow along with the workshop to make your own! This canonical version can serve as a reference, or a starting point all on its own. |
8 |
| - |
9 |
| -## Setup |
10 |
| - |
11 |
| -To use this boilerplate, you'll need to take the following steps: |
12 |
| - |
13 |
| -* Don't fork or clone this repo! Instead, create a new, empty directory on your machine and `git init` (or create an empty repo on Github and clone it to your local machine) |
14 |
| -* Run the following commands: |
15 |
| - |
16 |
| -``` |
17 |
| -git remote add boilermaker https://github.com/FullstackAcademy/boilermaker.git |
18 |
| -git fetch boilermaker |
19 |
| -git merge boilermaker/master |
20 |
| -``` |
21 |
| - |
22 |
| -Why did we do that? Because every once in a while, `boilermaker` may be updated with additional features or bug fixes, and you can easily get those changes from now on by entering: |
23 |
| - |
24 |
| -``` |
25 |
| -git fetch boilermaker |
26 |
| -git merge boilermaker/master |
27 |
| -``` |
28 |
| - |
29 |
| -## Customize |
30 |
| - |
31 |
| -Now that you've got the code, follow these steps to get acclimated: |
32 |
| - |
33 |
| -* Update project name and description in `package.json` file |
34 |
| -* `npm install`, or `yarn install` - whatever you're into |
35 |
| -* Create two postgres databases: `boilermaker` and `boilermaker-test` (you can substitute these with the name of your own application - just be sure to go through and change the `package.json` and `server/db/db.js` to refer to the new names) |
36 |
| - * By default, running `npm test` will use `boilermaker-test`, while regular development uses `boilermaker` |
37 |
| -* Create a file called `secrets.js` in the project root |
38 |
| - * This file is `.gitignore`'d, and will *only* be required in your *development* environment |
39 |
| - * Its purpose is to attach the secret env variables that you'll use while developing |
40 |
| - * However, it's **very** important that you **not** push it to Github! Otherwise, *prying eyes* will find your secret API keys! |
41 |
| - * It might look like this: |
42 |
| - |
43 |
| - ``` |
44 |
| - process.env.GOOGLE_CLIENT_ID = 'hush hush' |
45 |
| - process.env.GOOGLE_CLIENT_SECRET = 'pretty secret' |
46 |
| - process.env.GOOGLE_CALLBACK = '/auth/google/callback' |
47 |
| - ``` |
48 |
| - |
49 |
| -* To use OAuth with Google, complete the step above with a real client ID and client secret from Google |
50 |
| - * You can get them here: https://console.developers.google.com/apis/credentials |
51 |
| -* Finally, complete the section below to set up your linter |
52 |
| - |
53 |
| -## Linting |
54 |
| - |
55 |
| -Linters are fundamental to any project - they ensure that your code has a consistent style, which is critical to writing readable code. |
56 |
| - |
57 |
| -Boilermaker comes with a working linter (ESLint, with `eslint-config-fullstack`) "out of the box." However, everyone has their own style, so we recommend that you and your team work out yours and stick to it. Any linter rule that you object to can be "turned off" in `.eslintrc.json`. You may also choose an entirely different config if you don't like ours: |
58 |
| - |
59 |
| -* [Standard style guide](https://standardjs.com/) |
60 |
| -* [Airbnb style guide](https://github.com/airbnb/javascript) |
61 |
| -* [Google style guide](https://google.github.io/styleguide/jsguide.html) |
62 |
| - |
63 |
| -## Start |
64 |
| - |
65 |
| -`npm run start-dev` will make great things happen! |
66 |
| - |
67 |
| -If you want to run the server and/or webpack separately, you can also `npm run start-server` and `npm run build-client`. |
68 |
| - |
69 |
| -From there, just follow your bliss. |
70 |
| - |
71 |
| -## Deployment |
72 |
| - |
73 |
| -Ready to go world wide? Here's a guide to deployment! |
74 |
| - |
75 |
| -### Prep |
76 |
| -1. Set up the [Heroku command line tools](https://devcenter.heroku.com/articles/heroku-cli) |
77 |
| -2. `heroku login` |
78 |
| -3. Add a git remote for heroku: |
79 |
| - - **If you're creating a new app...** |
80 |
| - 1. `heroku create` or `heroku create your-app-name` if you have a name in mind. |
81 |
| - 2. `heroku addons:create heroku-postgresql:hobby-dev` to add ("provision") a postgres database to your heroku dyno |
82 |
| - |
83 |
| - - **If you already have a Heroku app...** |
84 |
| - 1. `heroku git:remote your-app-name` You'll need to be a collaborator on the app. |
85 |
| - |
86 |
| -### When you're ready to deploy |
87 |
| - |
88 |
| -1. Make sure that all your work is fully committed and pushed to your master branch on Github. |
89 |
| -2. If you currently have an existing branch called "deploy", delete it now (`git branch -d deploy`). We're going to use a dummy branch with the name "deploy" (see below), so if you have one lying around, the script below will error |
90 |
| -3. `npm run deploy` - this will cause the following commands to happen in order: |
91 |
| - - `git checkout -b deploy`: checks out a new branch called "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. |
92 |
| - - `webpack -p`: webpack will run in "production mode" |
93 |
| - - `git add -f public/bundle.js public/bundle.js.map`: "force" add the otherwise gitignored build files |
94 |
| - - `git commit --allow-empty -m 'Deploying'`: create a commit, even if nothing changed |
95 |
| - - `git push --force heroku deploy:master`: push your local "deploy" branch to the "master" branch on heroku |
96 |
| - - `git checkout master`: return to your master branch |
97 |
| - - `git branch -D deploy`: remove the deploy branch |
98 |
| - |
99 |
| -Now, you should be deployed! |
100 |
| - |
101 |
| -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! |
0 commit comments