Ruby and Rails Configuration: Difference between revisions

From Littledamien Wiki
Jump to navigation Jump to search
No edit summary
 
(One intermediate revision by the same user not shown)
Line 12: Line 12:
* Install Rails:<syntaxhighlight lang="powershell">> gem install rails</syntaxhighlight>
* Install Rails:<syntaxhighlight lang="powershell">> gem install rails</syntaxhighlight>


== New project from the command line ==
''N.B. All of this can be accomplished from within the RubyMine IDE.''
'''Create a new app.'''
<syntaxhighlight lang="powershell">
> rails new project_name
</syntaxhighlight>
'''Generate a model within the app.'''
`Article` is the name of the new model. `title`, `teaser`, and `body` are fields on the model. `string` and `text` are the data types.
This doesn't create a table on the database, just creates definitions of the model within the app.
<syntaxhighlight lang="powershell">
> rails generate model Article title:string teaser:text body:text
</syntaxhighlight>
'''Run rake to apply the changes to the database.'''
[http://guides.rubyonrails.org/migrations.html Detailed documentation on migrations]
<syntaxhighlight lang="powershell">
> rake db:migrate
</syntaxhighlight>
'''Add some data in the `db/seeds.rb` file.'''
<syntaxhighlight lang="ruby">
# db/seeds.rb
Article.create!(title: 'first title', teaser: 'sample teaser', body: 'sample body text.')
Article.create!(title: 'second title', body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.')
Article.create!(title: 'third title', teaser: '3rd article teaser', body: 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. ')
</syntaxhighlight>
'''Commit the seeding.'''
<syntaxhighlight lang="powershell">
> rake db:seed
</syntaxhighlight>
'''Set up a simple route.'''
<syntaxhighlight lang="ruby">
# config/routes.db
Rails.application.routes.draw do
  resources :articles
  route 'articles#index'
</syntaxhighlight>
'''Run the server'''
<syntaxhighlight lang="powershell">
> rails s
</syntaxhighlight>
The address for the server is [http://localhost:3000 http://localhost:3000]


== IDE ==
== IDE ==


* [https://www.jetbrains.com/ruby/ RubyMine] (JetBrains)
* [https://www.jetbrains.com/ruby/ RubyMine] (JetBrains)
== Rails and Twitter Bootstrap ==
Bootstrap is written in LESS, but there is an official port to SASS that is maintained by the Bootstrap team.
=== Integrating Bootstrap with Rails ===
Install the Ruby Gems for Boostrap
<syntaxhighlight lang="ruby">
# Gemfile
...
gem 'bootstrap-sass', '~> 3.2.0'
gem 'autoprefixer-rails'
# NOTE: The sass-rails gem is included with new Rails applications by default.
#      Please make sure that it is not already in your Gemfile before uncommenting it.
# gem 'sass-rails'
</syntaxhighlight>
Autoprefixer (`autoprefixer-rails`) is optional, but recommended. It automatically adds the proper vendor prefixes to your CSS code when it is compiled.
To install the gems, run:
<syntaxhighlight lang="powershell">
> bundle install
</syntaxhighlight>
=== Import Bootstrap CSS assets ===
Rename `app/assets/stylesheets/application.css` to `app/assets/stylesheets/application.css.sass`.
Import the Bootstrap assets in the newly renamed `application.css.sass` file.
<syntaxhighlight lang="css">
// app/assets/stylesheets/application.css.sass
...
@import "bootstrap-sprockets"
@import "bootstrap"
</syntaxhighlight>
When you compile, imported assets render a compiled version of their contents where the `@import` statement was found.
=== Import Bootstrap JavaScript assets ===
Add directive to `app/assets/javascripts/application.js`.
<syntaxhighlight lang="javascript">
//= require bootstrap-sprockets
</syntaxhighlight>
This must come after
<syntaxhighlight lang="javascript">
//= require jquery
</syntaxhighlight>
The file should look like this
<syntaxhighlight lang="javascript">
// app/assets/javascripts/application.js
...
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap-sprockets
//= require_tree .
</syntaxhighlight>
It's important this this is the last thing to be required:
<syntaxhighlight lang="javascript">
//= require_tree .
</syntaxhighlight>
`//= require_tree .` complies each of the other JavaScript files in the javascripts directory and any subdirectories.
* [http://www.gotealeaf.com/blog/integrating-rails-and-bootstrap-part-1 Boostrap Tutorial on Rails, Installation]

Latest revision as of 23:58, 21 November 2014


Overview[edit]

Notes on installing Ruby and Rails, and creating and configuring new Rails projects.

Ruby and Rails installation[edit]

New project from the command line[edit]

N.B. All of this can be accomplished from within the RubyMine IDE.

Create a new app.

> rails new project_name

Generate a model within the app.

Article is the name of the new model. title, teaser, and body are fields on the model. string and text are the data types.

This doesn't create a table on the database, just creates definitions of the model within the app.

> rails generate model Article title:string teaser:text body:text


Run rake to apply the changes to the database.

Detailed documentation on migrations

> rake db:migrate

Add some data in the db/seeds.rb file.

# db/seeds.rb

Article.create!(title: 'first title', teaser: 'sample teaser', body: 'sample body text.')
Article.create!(title: 'second title', body: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.')
Article.create!(title: 'third title', teaser: '3rd article teaser', body: 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. ')

Commit the seeding.

> rake db:seed

Set up a simple route.

# config/routes.db

Rails.application.routes.draw do
  resources :articles
  route 'articles#index'

Run the server

> rails s

The address for the server is http://localhost:3000

IDE[edit]

Rails and Twitter Bootstrap[edit]

Bootstrap is written in LESS, but there is an official port to SASS that is maintained by the Bootstrap team.

Integrating Bootstrap with Rails[edit]

Install the Ruby Gems for Boostrap

# Gemfile

...

gem 'bootstrap-sass', '~> 3.2.0'
gem 'autoprefixer-rails'

# NOTE: The sass-rails gem is included with new Rails applications by default.
#       Please make sure that it is not already in your Gemfile before uncommenting it.
# gem 'sass-rails'

Autoprefixer (autoprefixer-rails) is optional, but recommended. It automatically adds the proper vendor prefixes to your CSS code when it is compiled.

To install the gems, run:

> bundle install

Import Bootstrap CSS assets[edit]

Rename app/assets/stylesheets/application.css to app/assets/stylesheets/application.css.sass.

Import the Bootstrap assets in the newly renamed application.css.sass file.

// app/assets/stylesheets/application.css.sass

...

@import "bootstrap-sprockets"
@import "bootstrap"

When you compile, imported assets render a compiled version of their contents where the @import statement was found.

Import Bootstrap JavaScript assets[edit]

Add directive to app/assets/javascripts/application.js.

//= require bootstrap-sprockets

This must come after

//= require jquery

The file should look like this

// app/assets/javascripts/application.js

...

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap-sprockets
//= require_tree .

It's important this this is the last thing to be required:

//= require_tree .

//= require_tree . complies each of the other JavaScript files in the javascripts directory and any subdirectories.