OurBigBook Web is a regular databased backed dynamic website. This is unlike the static websites generated by OurBigBook CLI:
- static websites are simpler and cheaper to run, but they are harder to setup for non-programmers
- static websites cannot have multiuser features such as likes, comments, and "view versions of this article by other users", which is are core functionality of the OurBigBook Project
The source for OurBigBook Web, source code is fully contained under the
web/directory of the OurBigBook Project source code. OurBigBook Web can be seen as a separate Node.js package which uses the OurBigBook Library as a dependency.
OurBigBook Web was originally forked from the following starter boilerplate: github.com/cirosantilli/node-express-sequelize-realworld-example-app. We are trying to keep tech synced as much as possible between both projects, since the boilerplate is useful as a tech demo to quickly try out new technologies in a more minimal setup, but it has started to lag a bit behind. The web stack of OurBigBook Web is described at: OurBigBook Web tech stack.
It is highly recommended that you use the exact same Node.js and NPM versions as given under package.json
engines.jsentry. The best way to do that is likely to use NVM as explained at: stackoverflow.com/questions/16898001/how-to-install-a-specific-version-of-node-on-ubuntu/47376491#47376491
First time setup:
cd ourbigbook && npm run link && npm run build-assets && cd web/ && npm install && ./bin/generate-demo-data.js --users 2 --articles-per-user 10 # Or short version: #./bin/generate-demo-data.js -u 2 -a 10
We also provide a shortcut for that setup as:
npm run build-assetsneeds to be re-run if any assets (e.g. CSS or Js file mentioned at overview of files in this repository) on the
./ourbigbook/toplevel are modified. No need to re-run it for changes under
web/.To develop files from outside
web/, also consider:as mentioned at:
npm run webpack-dev
- web/bin/generate-demo-data.js also creates the database and is not optional. If you want to start with an empty database instead of the demo one, you can run instead web/bin/sync-db.js:
npm run web-setup ./bin/generate-demo-data.js --users 2 --articles-per-user 10
After this initial setup, run the development server:
npm run dev
And the website is now running at localhost:3000. If you created the demo data, you can login with:
asdfCustom demo user passwords can be set by exporting the
OURBIGBOOK_DEMO_USER_PASSWORDvariable, e.g.:this is useful for production.
OURBIGBOOK_DEMO_USER_PASSWORD=qwer ./bin/generate-demo-data.js -u 2 -a 10
To run on a different port use:
PORT=3001 npm run dev
We also offer shortcuts on toplevel for the
npm run devcommands so you can skip the
cd webfor those:
npm install npm run dev
Whenever you save any changes to the backend server, we listen to this and automatically restart the server, so after a few seconds or less, you can refresh the web page to obtain the backend update.
For frontend, changes are automatically recompiled by the webpack development server, so you can basically just refresh pages and they will be updated straightaway.