Creating a web application from scratch can be intimidating at first, but not necessary hard, I just finished building a really cool expense tracking web application called “Expensy”, and even though it took me a couple of days to get it completely working, I thought it was going to be harder, but by following certain steps, it was easier than I expected:
1. Have a clear Idea of what you want to create and how is going to look like
You don’t need to know exactly all your code before you start, but you definitely need to have an idea how your project is going to look like, answers to questions like, how many models am I going to have? or how many views? should be clear before you move on. Mine looked like this:
├── Gemfile ├── Gemfile.lock ├── README.md ├── Rakefile ├── app │ ├── controllers │ │ ├── application_controller.rb │ │ ├── categories_controller.rb │ │ ├── expenses_controller.rb │ │ └── users_controller.rb │ ├── models │ │ ├── category.rb │ │ ├── expenses.rb │ │ └── user.rb │ └── views │ ├── categories │ │ ├── categories.erb │ │ ├── edit_category.erb │ │ └── show_category.erb │ ├── expenses │ │ ├── create_expense.erb │ │ ├── edit_expense.erb │ │ ├── expenses.erb │ │ └── show_expense.erb │ ├── index.erb │ ├── layout.erb │ └── users │ ├── create_user.erb │ └── edit_user.erb ├── config │ └── environment.rb ├── config.ru ├── db ├── public ├──
2. Create your project folder
After you have a clear idea of how your project is going to look like, create your project folder and sub-folders, run bundle init in the command line while inside of it, this will create a Gemfile.
3. Create your config folder and environment file.
This is a very important file, is where you get your database connection ready, and it will connect your app folder with the rest of the files that require it as well.
require 'bundler' Bundler.require ActiveRecord::Base.establish_connection( :adapter => "sqlite3", :database => "db/development.sqlite" ) require_all 'app'
4. Add gems to your Gemfile
While it is ok to add more gems later on, it is important you add all the gems you initially are going to need to make your development process function properly, like sinatra, ActiveRecord, sqlite3, rake, require_all, shotgun, etc. This was mine:
# A sample Gemfile source "https://rubygems.org" # gem "rails" gem 'sinatra' gem 'activerecord', :require => 'active_record' gem 'sinatra-activerecord', :require => 'sinatra/activerecord' gem 'rake' gem 'require_all' #=> Helps to load dependencies gem 'sqlite3' gem 'thin' gem 'shotgun' gem 'pry' gem 'bcrypt' gem "tux" gem 'rack-flash3' gem 'sinatra-flash'
run bundle install after adding them.
5. Make the most important file of your App, config.ru
Here you will need to load your environment and also is the place where you are going to mount your application controllers.
require_relative './config/environment' if ActiveRecord::Migrator.needs_migration? raise 'Migrations are pending. Run `rake db:migrate` to resolve the issue.' end use Rack::MethodOverride # use OtherController1 # use OtherController2 # use OtherController3 run ApplicationController
6. Create an application controller
In your app/controllers folder create an application_controller.rb file. It should look something like this if you are enabling sessions, make sure your other controllers inherit from this controller.
class ApplicationController < Sinatra::Base
configure do
set :public_folder, 'public'
set :views, 'app/views'
enable :sessions
set :session_secret, "password_security"
end
get '/' do
"Hello, World!"
end
end
Test it out!, just run shotgun in your command line:
[19:32:18] (master) sinatra_app // ♥ shotgun == Shotgun/Thin on http://127.0.0.1:9393/ Thin web server (v1.7.0 codename Dunder Mifflin) Maximum connections set to 1024 Listening on 127.0.0.1:9393, CTRL+C to stop
Check your browser at your local host address, you should see “Hello, World!”, if you do, you are doing great!!
7. Make a Rakefile
A Rakefile is tailored to specifying tasks and actions. It should load your environment and
require 'sinatra/activerecord/rake', I added a task to start a console, it should look like this:
require_relative './config/environment' require 'sinatra/activerecord/rake' task :console do Pry.start end
To open console, just type rake console, here you can test your models and database later on your development process, it gives you a direct connection to your application’s ecosystem it’s, it’s very useful, you are going to need it.
8. Add your Models
At the end of the day, the model file is a Ruby class. If it has a corresponding database table it will inherit from the ActiveRecord::Base class, which means that it has access to a number of methods that assist in working with the database, establish all your model associations (very important), and if you are enabling sessions and using bcrypt make sure your user model has_secure_password, just like this:
class User < ActiveRecord::Base has_secure_password has_many :categories end
class Category < ActiveRecord::Base belongs_to :user end
9. Create a Database folder (db), run your migrations to create your tables.
This is the place where all your migrations will be staged, and where your database is going to be placed, simply mkdir db inside of your project main directory.
Now is time to run your migrations, by typing rake -T you can see a list of rake tasks:
rake db:create # Creates the database from DATABASE_URL or con... rake db:create_migration # Create a migration (parameters: NAME, VERSION) rake db:drop # Drops the database from DATABASE_URL or confi... rake db:environment:set # Set the environment value for the database rake db:fixtures:load # Loads fixtures into the current environment's... rake db:migrate # Migrate the database (options: VERSION=x, VER... rake db:migrate:status # Display status of migrations rake db:rollback # Rolls the schema back to the previous version... rake db:schema:cache:clear # Clears a db/schema_cache.dump file rake db:schema:cache:dump # Creates a db/schema_cache.dump file rake db:schema:dump # Creates a db/schema.rb file that is portable ... rake db:schema:load # Loads a schema.rb file into the database rake db:seed # Loads the seed data from db/seeds.rb rake db:setup # Creates the database, loads the schema, and i... rake db:structure:dump # Dumps the database structure to db/structure.sql rake db:structure:load # Recreates the databases from the structure.sq... rake db:version # Retrieves the current schema version number
So if you want to create a new table just type rake db:create_migration NAME=create_yourtablename , then create each table:
├── db │ ├── development.sqlite │ ├── migrate │ │ ├── 20160720175203_create_yourtablename.rb
then modify you migration file according to your needs. (Don’t forget model associations)
class CreateYourtablename < ActiveRecord::Migration
def change
create_table :yourtablename do |t|
t.string :something
t.string :something
t.integer :something
end
end
end
And finally run rake db:migrate, and all your tables will be added.
10. Add your Controllers, Routes and Views.
It’s Time! You are the artist, from here on this app is your canvas, code away and create something amazing!
Pro Tip: “View files should contain the least amount of logic of any of the files in the model-view-controller architecture. The role of the view is to simply render whatever it is sent from the database.” – learn.co
Good luck!
Here I’m adding a link to my Github repository in case you want to check out my code and/or try out my app.
- Installing phpcs on a Mac ft. VSCode & WordPress, The Really Simple Guide - May 8, 2021
- How To Set Up Your WordPress Development Environment with a Large Database ft. MAMP & Mac, The Really Simple Guide - April 24, 2020
- Next.js ▲ + Typescript + Storybook The Really Simple Guide 2019 - November 25, 2019
