Tutorial: A Sample Todo App With Padrino and AngularJS – Part 1

September 22, 2015

Part 1: A Sample Todo List App With Padrino and AngularJS – Setting Up Padrino

Note: This tutorial assumes you are familiar with managing your Ruby environment to setup gems and Gemfiles. It assumes you have deployed a couple of Rails applications (perhaps even by reading the Rails tutorial before and are now exploring other frameworks.

Step 1 – Generate a padrino project

Note: The source code for this repository is at this link: padrinosuperherotodo

First prepare a Gemfile in your project directory. Here is my Gemfile:

Do a bundle install command at the command prompt to get your Gemfile setup.

source ''

# Project requirements

gem 'rake'

# Component requirements

gem 'mini_record'

gem 'sqlite3'

gem 'haml'

# Test requirements

gem 'rspec', :group => 'test'

gem 'rack-test', :require => 'rack/test', :group => 'test'

# Padrino Stable Gem

gem 'padrino', '0.12.5'

gem 'padrino-sprockets', :require => ['padrino/sprockets'], :git => 'git://'

gem 'uglifier', '2.1.1'

gem 'yui-compressor', '0.9.6'

gem 'grape'

gem 'padrino-grape', github: “adamluzsi/padrino-grape”

gem 'httparty'

gem 'gon-sinatra'

gem 'pry'

I’m using sqlite for the database and ActiveRecord for querying the database.

Here are the commands you need:

padrino g project padrino_superhero_todo

padrino g component -d minirecord -a sqlite -t rspec

Note: You may need to do another bundle install command at each iteration.

Step 1a – Modify your routes

Add a hello world route below to the app/app.rb file just so you can see something happening as follows:


module PadrinoSuperheroTodo
class App < Padrino::Application
use ConnectionPoolManagement
register Padrino::Mailer
register Padrino::Helpers
register Padrino::Sprockets
register Gon::Sinatra sprockets :minify => (Padrino.env == :production)

enable :sessions

# Add this route below to the app/app.rb file just so you can see something happening…

get'/' do
  "Hello World Home Route!"

Step 2 – start your padrino application

padrino start

Be aware of rake tasks at your disposal to make life easier:

padrino rake -T

Output of running padrino rake -T:

=> Executing Rake -T ...
rake db:seed # Load the seed data from db/seeds.rb
rake mr:migrate # Auto migration of database
rake routes[query] # Displays a listing of the named routes within a project, optionally only those matched by [query]
rake routes:app[app] # Displays a listing of the named routes a given app [app]
rake secret # Generate a secret key
rake spec # Run complete application spec suite
rake spec:models # Run the spec suite in models

Step 3 – mount your api

In config/apps.rb, mount the following folders and know that order matters:

config/apps.rb (order matters)

Padrino.mount('Api', :app_file => Padrino.root('api/api.rb')).to('/api')
Padrino.mount('PadrinoSuperheroTodo::App', :app_file => Padrino.root('app/app.rb')).to('/')

Step 3a – To run rake:routes with the Grape API gem, modify config/boot.rb


#Need this config/boot.rb for rake:routes to work

Padrino.before_load do

#need Grape::Route for rake routes to work

  class Grape::Route

    def name

    def request_methods [route_method]

    def original_path

    def controller


Step 4 – Setup the API

In api/api.rb, setup the following code:


require 'pry'

class Api < Grape::API
  include PadrinoGrape
  format :json
  default_format :json
  get'/' do
    @superheroes = Superhero.all @superheroes
  get '/' do
    @superhero = Superhero.where(:id => params[:id])

  post :create do
    @superhero = Superhero.create(superhero_name: params[:superhero_name], age: params[:age])

  put :update do
    @superhero = Superhero.update(params[:id], superhero_name: params[:superhero\_name], age: params[:age])

  delete :delete do
    @superhero = Superhero.destroy(params[:id])


This concludes Part 1. I’ll write up another post detailing how to do the front end.

Note: The source code for this repository is at this link: padrinosuperherotodo