I'm a happy little skeleton who is totally on fire(base)!
You can clone me to use as a starter on your projects. I have React and Firebase, and some examples of how to put them together.
If you don't have it, I'll complain and tell you how to install it.
We recommend that you clone, not fork, this repo – unless your intention is to develop Firebones proper instead of using Firebones as the starting point for your own application.
Start by doing either of the following:
- Create a GitHub repo and clone it, or
git init
in an empty directory on your machine.
After you have a repo on your machine:
git remote add bones https://github.com/FullstackAcademy/firebones.git
git fetch bones
git merge bones/master
And then you'll have me! If I change – which I probably will – you can get the most recent version by doing this again:
git fetch bones
git merge bones/master
You'll want this globally:
npm install -g firebase-tools
If you just installed them, you'll need to log in:
firebase login
Short and sweet:
npm install
npm run dev
The dev
script runs webpack, firebase serve
, the linter, and the tests. You can run these
in separate terminals if you prefer:
npm run build-watch # webpack
firebase serve # Serve the app on port 5000
npm run test-watch # Watch tests
npm run lint-watch # Watch lint
By default, I'm pointed at the firebones firebase. That might be nice for exploring, but soon you'll want to create your own.
Go to the Firebase console and create a project. Go to Overview in that project's console, and click "Add Firebase to your web app".
Copy and paste the config from there into fire/index.js. You don't have to
copy the call to initializeApp
, I've already got that.
Then, in your code, you can import firebase like so:
import firebase from 'APP/fire'
The first time you deploy, you'll need to tell firebase which project to use:
firebase use --add
Then, and every time thereafter, just say,
firebase deploy
And I'll be deployed to Firebase hosting.
/app
has the React setup. main.jsx
is the entry point.
/fire
has the Firebase config.
/functions
is where your cloud functions live.
/demos
has some demos (currently just a little scratchpad).
/bin
has scripts. (Right now it has one script that creates a useful symlink.)
I use require
and module.exports
in .js
files.
I use import
and export
in .jsx
files, unless require
makes for cleaner code.
I use two spaces, no semi-colons, and generally prefer a less strict version of NPM's funny coding style. My lint config is in eslintrc.js.