Rails App
Phase Five - Routes & Static Pages
In this module, we will refine the routes, or how the URLs in the application act, as well as create a static page that contains info about the Scriba application.
If you look at the http://localhost:3000 webpage (with your server
running of course), what do you see? Instead of that file, let’s tell
Rails to serve out our transcriptions#index
view.
Stop your server (remember, any changes to files in the config
directory require you to restart rails
) and open config/routes.rb
.
Update the root path (root 'welcome#index'
)
Rails.application.routes.draw do
resources :transcriptions
...
root 'transcriptions#index'
...
end
What happens now if you start your web server back up?
While we’re at it, this actually added a new path in rails
for us to
use—the root_path
. We can use this in the application layout to
return people to the defined root
of the project. Open up
app/views/layouts/application.html.erb
and find the line
<%= link_to "Scriba", transcriptions_path, class: 'navbar-brand' %>
And update it to:
<%= link_to "Scriba", root_path, class: 'navbar-brand' %>
If you ever need to check the routes you have defined in your
application, you can check them by running the bin/rake routes
task.
Now when you restart the server, what happens when you click on the “Scriba” link? How is it different than when you click on “Transcriptions”?
A Static Page
Another common task you will find yourself needing to do is create
content that is static (not saved to the database). We’ll use a
rails
generator to create a new controller and view for us but skip
creating a model (and database migration).
$ bin/rails generate controller pages about
create app/controllers/pages_controller.rb
route get 'pages/about'
invoke erb
create app/views/pages
create app/views/pages/about.html.erb
invoke test_unit
create test/controllers/pages_controller_test.rb
invoke helper
create app/helpers/pages_helper.rb
invoke test_unit
create test/helpers/pages_helper_test.rb
invoke assets
invoke coffee
create app/assets/javascripts/pages.js.coffee
invoke scss
create app/assets/stylesheets/pages.css.scss
As you can see from the output, this generated views, tests, and helpers
for us but no models. It also wrote to config/routes.rb
a line to
tell rails
how to access the code. Now we can update the file.
Open app/views/pages/about.html.erb
and add some lorem ipsum (in
Atom, simply type the word “lorem” and hit the tab key) text in a <p>
element.
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
Now if your server is still running, you can get to the new page at http://localhost:3000/pages/about.
Better Routes
When we ran the generator for the controller, one of the things it did for us
was create a new entry in the config/routes.rb
file. The entry get
'pages/about'
tells rails what to do when a particular path is requested.
Right now it’s a bit of an “ugly” URL since to get here you have to have the
word “pages” in them. Let’s make this look a bit better by updating the
config/routes.rb
file so there is a path defined as /about
.
Under the line get 'pages/about' in the
config/routes.rb` file, add the line
get 'about', to: 'pages#about'
Restart your server, you should be able to see the same page at http://localhost:3000/about.
But we forgot the credits page…
No worries, we don’t even have to use the console. We’ll do this manually. To
do this, we need to update the pages
controller (to tell rails what to do),
update the routes (to define what to do), and finally, the actual view with the
information.
Let’s work with the controller first. We need to add a simple method that
defines what to do. We don’t need to do anything, but we still need to define
this. Simply add this code to app/controllers/pages_controller
.
def credit
end
Now we can add the route. Open config/routes.rb
and try create a route for
pages#credit
(think about it for a second).
Now we need to create a new view file. Create the file
app/views/pages/credit.html.erb
. In it, create some dummy credits.
<h1>Credits</h1>
<p>This application was created by me, for this thing I did.</p>
<p>Some other people helped too.</p>
Git
Now that everything is working, it’s time to add and commit everything to git. Go ahead and add the new files, and commit them all with a “good” message.
Summary
In this module, we created a static pages for our application that don’t necessarily need to be stored in a database. We used both the rails generator and did this manually. You also learned a bit more about how routes work and also how to create custom routes to make the URLs of your application easier to “guess” by users.