rails rookies bootcamp - blogger

Rails Rookies BootcampBlogger

What is Ruby?

Dynamic, reflective, general-purpose object-oriented programming language

Designed/developed in 1995 by Yukihiro Matsumoto in Japan

Syntax inspired by Perl with Smalltalk-like features and influenced by Eiffel and Lisp

Supports function, object-oriented, and imperative paradigms

Dynamic type system and automatic memory management

What is Rails?

Ruby on Rails is an open-source web application framework for Ruby

Full-stack framework

Routing system independent of the web server

Patterns and Principles

Active record pattern

Convention over configuration

DRY (Don’t Repeat Yourself)

MVC (Model-View-Controller)

MVC

Agile

Software development methodology

Iterative and incremental development

Requirements and solutions evolve through collaboration between self-organizing, cross-functional teams

Adaptive planning, evolutionary development and delivery, and a rapid and flexible response to change

Agile

Agile ManifestoWe are uncovering better ways of developing software by doing it and helping other do it

Through this work we have come to value:

Individuals and interactions over processes and tools

Working software over comprehensive documentation

Customer collaboration over contract negotiation

Responding to change over following a plan

That is, while there is value in the items on the right, we value the items on the left more

Git

Git is a distributed revision control and source code management (SCM) system with an emphasis on speed

Every Git working directory is a full-fledged repository with complete history and full revision tracking capabilities, not dependent on network access or a central server

Git Explained

You’ll use git to record the changes you make to your project over time. In git, these changes are called “commits”

Commits contain a change a user has made to the code and some additional useful metadata, including the time that the change was made, your name, and a message you add to describe the change

Why Git (or SCM at all)?

Allows more than one developer to make changes and stay in sync

Allows you to maintain and access different versions of a project

Allows you to retrieve past versions of a project

GitHub

GitHub is a web-based hosting service for software development projects that use the Git revision control system

The most popular open source repository site

Setting Up GitHub

https://github.com/

Log in or sign up for an account

git config --global user.name “Your Name Here”

git config --global user.email “your_email@example.com”

Generating a SSH Key

ssh-keygen -t rsa -C “your_email@example.com”

Enter a passphrase (if you wish)

pbcopy < ~/.ssh/id_rsa.pub

Adding SSH Key to GitHub

Go to your Account Settings

Click “SSH Keys” in the left sidebar

Click “Add SSH Key”

Paste your key into the “Key” field

Click “Add key”

Confirm the action by entering your GitHub password

Test Everything Out

ssh -T git@github.com

Accept (“yes”) the RSA key fingerprint

Get authentication confirmation.

Learning Git

Pro Git by Scott Chacon

Interactive Tutorial by GitHub

Git Immersion by EdgeCase

Understanding Git Conceptually by Charles Duan

Version Control with Git from Michael Hartl’s Rails Tutorial

Git Workflow

Initialize new repository (repo)

Create a GitHub repo

Add GitHub as a remote repo

Initial commit

Create a git branch each time you begin to work on implementing a new feature

Commit changes as you work on the feature

When your new feature is complete, merge the branch and “squash” the commits so your comrades see just one commit for the entire feature

Blogger

A simple blog system

Allows users to read articles

Allows users to comment on articles

Allows users to locate articles by tags

Allows authenticated users to create, update, and delete articles

Allows authenticated users to create, update, and delete users

Iteration 1Up and RunningUp and Running

Ruby on Rails takes a lot of the hard work off your hands, especially when starting up a project

Rails practices the idea of “sensible defaults” and will, with one command, create a working application ready for your customization

Setting the Stage

Git WorkflowInitialize New RepoInitialize New Repo

git init

git add .

git commit -m “initial commit”

git status

Git WorkflowAdd GitHub Remote

RepoAdd GitHub Remote

RepoCreate new repo on GitHubgit remote add origin git@github.com:YOUR_GITHUB_ACCOUNT/YOUR_PROJECT_NAME.git

git push origin master

git commit -am “some helpful comment”

Git WorkflowCheckout New BranchCheckout New Branch

git checkout -b up-and-running

Project Tour

Project Tour

app - This is where 98% of your effort will go. It contains subdirectories which will host most of the code you write, including Models, Views, Controllers, Helpers, JavaScripts, etc

config - Control the environment settings for your application. It also includes the initializers subdirectory which holds items to be run on startup

Project Tour

db - Will eventually have a migrations subdirectory where your migrations, used to structure the database, will be stored. When using SQLite3, as is the Rails default, the database file will be stored in this directory

doc - Who writes documentation? If you did, it’d go here. Someday

Project Tour

lib - Not commonly used, this directory is to store code you control that is reusable outside the project. Instead of storing code here, consider packaging it as a gem

log - Log files, one for each environment

Project Tour

public - The “root” of your application. Static files can be stored and accessed from here, but all the interesting things (JavaScript, Images, CSS) have been moved up to app since Rails 3.1

script - Nothing of interest

Project Tour

test - If your project is using the default Test::Unit testing library, the tests will live here

tmp - Temporary cached files

vendor - Infrequently used, this directory is to store code you do not control. With Bundler and RubyGems, we generally don’t need anything in here during development

Configuring the Database

Look in the config directory and open the file database.yml

This file controls how Rails’ database connection system will access your database

You can configure many different databases, including SQLite3, MySQL, PostgreSQL, SQL Server, and Oracle

Configuring the Database

If you were connecting to an existing database, you would enter the database configuration parameters here. Since we’re using SQLite3 and starting from scratch, we can leave the defaults to create a new database, which will happen automatically

The database will be stored in db/development.sqlite3

Starting the Server

Accessing the Server

Creating the Article Model

Our blog will be centered around “articles”

Need a table in the database to store all the articles

Need a model to allow our Rails app to work with that data

rails generate model Article

Working with the Database

Rails uses migration files to perform modifications to the database

Killer feature!! Rails migrations are generally database agnostic

Open db/migrate/(some_time_stamp)_create_articles.rb

Modifying change

Timestamps

t.timestamps will create two columns inside our tables, automatically managed by Rails, to track when an object is created or updated

Running the Migration

rake db:migrate

Working with a Model in the Console

Rails console is a command-line interface to your application

Allows you to access and work with almost any part of your application directly instead of going through the web interface

Can greatly simplify your development process

Looking at the Model

app/models/article.rb

Contains all the code for the Article model

Setting up the Router

config/routes.rb

When a Rails server gets request from a web browser, it first goes to the router

Router decides what the request is trying to do, what resources it is trying to interact with

Looking at the Routing Table

rake routes

Creating the Articles Controller

rails g controller articles

app/controllers/articles_controller.rb

Defining the Index Action

http://localhost:3000/articles/

Add index action to the articles controller

Instance Variables

@articles

@ marks a variable as an “instance level variable”

Creating the Template

Create app/views/articles/index.html.erb

ERB is a templating language allowing us to mix Ruby into our HTML

ERB clause starts with <% or <%= and ends with %>

<% will hide the result of the Ruby code

<%= will output the result of the Ruby code

Index Template Content

Adding Navigation to the Index

Looking at the Routing Table

Completing the Article Links

New Article Link

Review the Results

Creating the Show Action

A Bit on Parameters

Back to the Template

Styling

Iteration 1 Complete!

Git Workflow

git add .

git commit -am “a meaningful message”

git push origin up-and-running

git checkout master

git merge --squash up-and-running

git commit -am “implement ‘up and running’ feature”

git push origin master

Iteration 2Form-Based WorkflowForm-Based WorkflowCreating articles from the console isn’t a viable long-term solution

Users will expect to add content through a web interface

Create an HTML form to submit the article and all the back-end processing to get it into the database

Git WorkflowCheckout New BranchCheckout New Branch

git checkout -b form-based-workflow

Creating the New Action and View

Starting the Template

Writing a Form

Does it Work?

Setting up for Reflection

The Create Action

Processing the Data

Understanding Form Parameters

Pulling Out Form Data

More Body

Fragile Controllers

Fragile Controllers

Uh-oh! An Error!

Less Fragile Controllers

Deleting Articles

REST is About Path and Verb

Representational State Transfer (REST) is a software architectural style for distributed systems (e.g. World Wide Web)

Predominant web API design model

Collection URI http://example.com/resources/

Element URI http://example.com/resources/item17

Action URI http://example.com/resources/new

The Destroy Action

Adding the Edit Link

Implementing the Edit Action

An Edit Form

Creating a Form Partial

Implementing Update

Adding a Flash

Testing the Flash

Setting the Site Root

Iteration 2 Complete!

Git Workflow

git add .

git commit -am “a meaningful message”

git push origin form-based-workflow

git checkout master

git merge --squash form-based-workflow

git commit -am “implement ‘form-based-workflow’ feature”

git push origin master

Iteration 3Adding CommentsAdding Comments

A comment...

Is attached to an article

Has an author name

Has a body

Git WorkflowCheckout New BranchCheckout New Branch

git checkout -b adding-comments

Generating the Comment Model

Setting Up the Migration

Relationships

Relationships

Testing in the Console

Displaying Comments for an Article

Creating the Comments Partial

Web-Based Comment Creation

In the ArticlesController

Improving the Comment Form

Trying the Comment Form

Creating a Comments Controller

Writing the Create Action

Cleaning Up

Iteration 3 Complete!

Git Workflow

git add .

git commit -am “a meaningful message”

git push origin adding-comments

git checkout master

git merge --squash adding-comments

git commit -am “implement ‘adding-comments’ feature”

git push origin master

Iteration 4TaggingTagging

An article has many taggings

A tag has many taggings

A tagging belongs to an article and belongs to a tag

Git WorkflowCheckout New BranchCheckout New Branch

git checkout -b tagging

Making Models

Expressing Relationships

Tags in Action

An Interface for Tagging Articles

Fixing tag_list

Not So Fast

Pseudo-Code

Split the tags_string into an array of strings with leading and trailing whitespace removed

For each of those strings...

Ensure each one of these strings are unique

Look for a tag object with that name. If there isn’t one, create it

Add the tag object to a list of tags for the article

Set the article’s tags to the list of tags that we have found and/or created

Working with Strings

Fixing tag_list=

Testing in the Console

Adding Tags to Our Display

Listing Articles by Tag

Listing All Tags

Iteration 4 Complete!

Git Workflow

git add .

git commit -am “a meaningful message”

git push origin tagging

git checkout master

git merge --squash tagging

git commit -am “implement ‘tagging’ feature”

git push origin master

Iteration 5Using GemsUsing Gems

Git WorkflowCheckout New BranchCheckout New Branch

git checkout -b using-gems

Setting Up the Database for Paperclip

Adding to the Model

Modifying the Form Template

Trying It Out

Improving the Form

Further Notes about Paperclip

A Few Sass Examples

https://www.dropbox.com/s/4wl3qdjd9ht5y2o/styles.css.scss

Put in app/assets/stylesheets/

Details about Sass can be

found here:

http://sass-lang.com

Working with Layouts

<%= stylesheet_link_tag ‘styles’ %>

DRY - Don’t Repeat Yourself

Iteration 5 Complete!

Git Workflow

git add .

git commit -am “a meaningful message”

git push origin using-gems

git checkout master

git merge --squash using-gems

git commit -am “implement ‘using-gems’ feature”

git push origin master

Iteration 6AuthenticationAuthentication

gem ‘sorcery’

When specifying & installing a new gem, you will need to restart your Rails Server

Git WorkflowCheckout New BranchCheckout New Branch

git checkout -b authentication

Running the Generator

Creating a First Account

Form Validation

Creating a New Author

Are We Logged In?

Logging In

New Session Form

Configuring Routes

Editing Layout

Securing New Users

Securing the Rest of the Application

Securing the Rest of the Application

Iteration 6 Complete!

Git Workflow

git add .

git commit -am “a meaningful message”

git push origin authentication

git checkout master

git merge --squash authentication

git commit -am “implement ‘authentication’ feature”

git push origin master

Iteration 7ExtrasExtras

Add a site-wide sidebar that holds navigation links

Create date-based navigation links. For instance, there would be a list of links with the names of the months and when you click on the month, it shows you all the articles published in that month.

Track the number of times an article has been viewed. Add a view_count column to the article, then in the show method of articles_controller.rb just increment that counter. Or, better yet, add a method in the article.rb model that increments the counter and call that method from the controller.

Once you are tracking views, create a list of the three “most popular” articles.

Create a simple RSS feed for articles using the respond_to method and XML view templates.