Quickstart¶
In this guide you’ll learn how to create a demo Hoodie app, learn about the basic structure of a Hoodie project and its folders, the endpoints and app URLs and how to include and use the Hoodie library in your project.
Prerequisites¶
For all operating systems, you’ll need Node.js installed. You can download Node from nodejs.org. We recommend the LTS (Long Term Support) version.
Make sure you have version 4 or higher. You can find out with
$ node -v
Create a new Hoodie Backend¶
First you need to create a new folder, let’s call it testapp
$ mkdir testapp
Change into the testapp
directory.
$ cd testapp
Now we need to create a package.json file. For that we can use npm which comes with Node by default. It will ask you a few questions, you can simply press enter to leave the default values.
$ npm init -y
Now we can install hoodie using npm
$ npm install hoodie --save
The resulting package.json file in the current folder, should look something like this
{
"name": "testapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "hoodie",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"hoodie": "^28.2.10"
}
}
Now you can start Hoodie with
$ npm start
Great, your Hoodie backend started up and is now telling you at which URL you can access it. By default that is http://127.0.0.1:8080
Congratulations, you just created your first Hoodie Backend :) You can now load the Hoodie client on any website with
<script src="http://127.0.0.1:8080/hoodie/client.js"></script>
You can also create a public/index.html
file, which will be served
at http://127.0.0.1:8080 after you restart the server. All assets in the public
folder, like images, CSS files or JavaScript files, will be served by your
Hoodie Backend at http://127.0.0.1:8080/<path/to/your/file.ext>
.
If you just want to try, you can copy https://raw.githubusercontent.com/gr2m/sweet.la/master/public/index.html to your index.html. (This code was created to present Hoodie in an event, you can watch it at https://www.youtube.com/watch?v=TSDyxtVbbME&t=1272s) Open the Console and try:
hoodie
Also try:
hoodie.account.signUp({username: 'foo', password: 'secret'})
Now, test using it offline and back online. You can also open a second browser (incognito) and see the changes being replicated.
Note for npm v2¶
Because of how npm v2 installs sub dependencies, the hoodie client cannot be
bundled. As a workaround, just install pouchdb-browser
and @hoodie/client
as a dependency of your hoodie app
$ npm install --save pouchdb-browser @hoodie/client
What’s next?¶
Our Hoodie Tracker App is a great place to see how to use a Hoodie backend. It’s an intentionally simple and well commented application built with only HTML, JavaScript and CSS, without using any library or framework. You can see it running at https://hoodie-app-tracker.now.sh/
Having Trouble?¶
Sorry it didn’t go smoothly for you. Come chat with us or ask a question on StackOverflow