- heroku: cloud platform as a service to help you easily deploy your apps
- roots (the special sauce): a tool for quickly building beautiful and efficient web products
1. Install node
If you don’t have node.js, install it from nodejs.org.
2. Install roots
Once node.js is installed, you can can install roots in the terminal with the following command:
3. Create a new roots project
You can create a new roots project with the following command in the terminal:
4. Start the local server
Once you’ve switched into the new project folder, you can start the app on localhost:1111 with the following command:
5. Deploy to heroku
Now you’re one small command away from having your app up on Heroku for the world to see:
Yes, it’s that easy. If you don’t believe me checkout the app I made while going through the roots tutorial.
Checkout your own app with the following command:
In addition to helping you get an app up and running in just a couple minutes, roots also has a ton of amazing built in features.
Axis in action
An example of how Axis makes css easier is how it simplifies border radius. The following code shows how to create a border radius that works across different browsers: first using standard css, and then using Axis.
1 2 3 4 5 6 7 8 9 10
The button in the example page uses the following code:
1 2 3
Border-radius? Included. An easy on the eyes blue? Included. Darken on hover? Included. Yep, it’s super convenient. There are a lot of other cool features you can check out via the library’s documentation.
This is just the tip of the iceberg
There are a lot of other awesome features that I haven’t talked about above – for example dynamic content and js templates. The roots creator, @jescalan, has some great video tutorials that you can find here if you are interested in learning more.