http://travel.michaelvillar.com
Create a data
folder: this is where your photos will live.
For each group of photos, create a folder (i.e. "sanfrancisco") and add your photos in it.
Finally, create a info.json
into that folder with this format:
{
"name": "San Francisco",
"date": "2015-01-01",
"images": [
{
"file": "1.jpg",
"type": "full"
},
{
"file": "2.jpg",
"type": "row"
},
{
"file": "3.jpg",
"type": "row"
}
]
}
This is how the file hierarchy should look like:
Install the necessary packages:
brew install imagemagick
npm install
Then run the script to prepare your photos -- this can take a while.
It will resize your photos and create a global info.json
required for the app.
These will be saved into public/data/
.
./scripts/prepare.coffee
Finally, compile the app and run it!
./scripts/compile.coffee
coffee web.coffee
Open http://localhost:8000/ in your browser.
For the sake of simplicity, we'll use Heroku.
heroku apps:create
git push heroku master
Then, you need to upload your photos on a server. Amazon S3 is an option.
Upload the whole public/data
folder which has been generated by ./scripts/prepare.coffee
.
Tell the app where your photos live:
heroku config:set IMAGES_ROOT_PATH="http://example.com/folder/"
You can also change the page title:
heroku config:set PAGE_TITLE="Michael Villar - Travel Log"