diff --git a/.gitignore b/.gitignore
index 20700da..50061e8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -13,6 +13,7 @@
 !/log/.keep
 !/tmp/.keep
 /.idea/*
+/config/database.yml
 /node_modules
 /yarn-error.log
 
diff --git a/app/assets/images/rails.png b/app/assets/images/rails.png
new file mode 100644
index 0000000..f9fa0a0
Binary files /dev/null and b/app/assets/images/rails.png differ
diff --git a/app/assets/stylesheets/custom.scss b/app/assets/stylesheets/custom.scss
new file mode 100644
index 0000000..e7ee3e3
--- /dev/null
+++ b/app/assets/stylesheets/custom.scss
@@ -0,0 +1,97 @@
+@import 'bootstrap-sprockets';
+@import 'bootstrap';
+
+/* mixins, variables, etc. */
+
+$gray-medium-light: #eaeaea;
+
+/* universal */
+
+body {
+  padding-top: 60px;
+}
+
+section {
+  overflow: auto;
+}
+
+textarea {
+  resize: vertical;
+}
+
+.center {
+  text-align: center;
+  h1 {
+    margin-bottom: 10px;
+  }
+}
+
+/* typography */
+
+h1, h2, h3, h4, h5, h6 {
+  line-height: 1;
+}
+
+h1 {
+  font-size: 3em;
+  letter-spacing: -2px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+h2 {
+  color: $gray-light;
+  font-size: 1.2em;
+  font-weight: normal;
+  letter-spacing: -1px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+p {
+  font-size: 1.1em;
+  line-height: 1.7em;
+}
+
+/* header */
+
+#logo {
+  color: white;
+  float: left;
+  font-weight: bold;
+  font-size: 1.7em;
+  letter-spacing: -1px;
+  margin-right: 10px;
+  padding-top: 9px;
+  text-transform: uppercase;
+  &:hover {
+    color: white;
+    text-decoration: none;
+  }
+}
+
+/* footer */
+
+footer {
+  border-top: 1px solid $gray-medium-light;
+  color: $gray-light;
+  margin-top: 45px;
+  padding-top: 5px;
+  a {
+    color: $gray;
+    &:hover {
+      color: $gray-darker;
+    }
+  }
+  small {
+    float: left;
+  }
+  ul {
+    float: right;
+    list-style: none;
+    li {
+      float: left;
+      margin-left: 15px;
+    }
+  }
+}
diff --git a/app/controllers/static_pages_controller.rb b/app/controllers/static_pages_controller.rb
new file mode 100644
index 0000000..ef9a647
--- /dev/null
+++ b/app/controllers/static_pages_controller.rb
@@ -0,0 +1,13 @@
+class StaticPagesController < ApplicationController
+  def home
+  end
+
+  def about
+  end
+
+  def contact
+  end
+
+  def help
+  end
+end
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index de6be79..200534f 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -1,2 +1,6 @@
 module ApplicationHelper
+  def full_title page_title = ""
+    base_title = t "content.base_title"
+    page_title.empty? ? base_title : page_title + " | " + base_title
+  end
 end
diff --git a/app/views/layouts/_footer.html.erb b/app/views/layouts/_footer.html.erb
new file mode 100644
index 0000000..061f22b
--- /dev/null
+++ b/app/views/layouts/_footer.html.erb
@@ -0,0 +1,17 @@
+<footer class="footer">
+  <small>
+    <%= t "words.the" %>
+    <%= link_to t(".rails_book"), "http://www.railstutorial.org/" %>
+    <%= t "words.by" %>
+    <%= link_to t(".author"), "http://www.michaelhartl.com/" %>
+  </small>
+  <nav>
+    <ul>
+      <li><%= link_to t(".about"), about_path %></li>
+      <li><%= link_to t(".contact"), contact_path %></li>
+      <li>
+        <%= link_to t("words.news"), "http://news.railstutorial.org/" %>
+      </li>
+    </ul>
+  </nav>
+</footer>
diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
new file mode 100644
index 0000000..974d24f
--- /dev/null
+++ b/app/views/layouts/_header.html.erb
@@ -0,0 +1,12 @@
+<header class="navbar navbar-fixed-top navbar-inverse">
+  <div class="container">
+    <%= link_to t(".app_name"), root_path, id: "logo" %>
+    <nav>
+      <ul class="nav navbar-nav navbar-right">
+        <li><%= link_to t("words.home"), root_path %></li>
+        <li><%= link_to t("words.help"), help_path %></li>
+        <li><%= link_to t("word.log_in"), "#" %></li>
+      </ul>
+    </nav>
+  </div>
+</header>
diff --git a/app/views/layouts/_rails_default.html.erb b/app/views/layouts/_rails_default.html.erb
new file mode 100644
index 0000000..76823d8
--- /dev/null
+++ b/app/views/layouts/_rails_default.html.erb
@@ -0,0 +1,4 @@
+<%= csrf_meta_tags %>
+<%= stylesheet_link_tag "application", media: "all",
+  "data-turbolinks-track": "reload" %>
+<%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>
diff --git a/app/views/layouts/_shim.html.erb b/app/views/layouts/_shim.html.erb
new file mode 100644
index 0000000..ecfd51d
--- /dev/null
+++ b/app/views/layouts/_shim.html.erb
@@ -0,0 +1,4 @@
+<!--[if lt IE 9]>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js">
+  </script>
+<![endif]-->
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index ffac5de..7e7d751 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,14 +1,15 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>FirstProject</title>
-    <%= csrf_meta_tags %>
-
-    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
-    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
+    <title><%= full_title yield :title %></title>
+    <%= render "layouts/rails_default" %>
+    <%= render "layouts/shim" %>
   </head>
-
   <body>
-    <%= yield %>
+    <%= render "layouts/header" %>
+    <div class="container">
+      <%= yield %>
+      <%= render "layouts/footer" %>
+    </div>
   </body>
 </html>
diff --git a/app/views/layouts/mailer.html.erb b/app/views/layouts/mailer.html.erb
index cbd34d2..5468c92 100644
--- a/app/views/layouts/mailer.html.erb
+++ b/app/views/layouts/mailer.html.erb
@@ -1,12 +1,11 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
     <style>
       /* Email styles need to be inline */
     </style>
   </head>
-
   <body>
     <%= yield %>
   </body>
diff --git a/app/views/static_pages/about.html.erb b/app/views/static_pages/about.html.erb
new file mode 100644
index 0000000..44472cb
--- /dev/null
+++ b/app/views/static_pages/about.html.erb
@@ -0,0 +1 @@
+<%= t ".content" %>
diff --git a/app/views/static_pages/contact.html.erb b/app/views/static_pages/contact.html.erb
new file mode 100644
index 0000000..44472cb
--- /dev/null
+++ b/app/views/static_pages/contact.html.erb
@@ -0,0 +1 @@
+<%= t ".content" %>
diff --git a/app/views/static_pages/help.html.erb b/app/views/static_pages/help.html.erb
new file mode 100644
index 0000000..6dd4a87
--- /dev/null
+++ b/app/views/static_pages/help.html.erb
@@ -0,0 +1,2 @@
+<% provide :title, t "words.help" %>
+<%= t ".content" %>
diff --git a/app/views/static_pages/home.html.erb b/app/views/static_pages/home.html.erb
new file mode 100644
index 0000000..718b7ea
--- /dev/null
+++ b/app/views/static_pages/home.html.erb
@@ -0,0 +1,11 @@
+<div class="center jumbotron">
+  <h1><%= t ".wellcome" %></h1>
+  <h2>
+    <%= t ".first_content" %>
+    <%= link_to t(".sub_title_first"), "http://www.railstutorial.org/" %>
+    <%= t ".sub_content" %>
+  </h2>
+  <%= link_to t("words.sign_up_now"), "#", class: "btn btn-lg btn-primary" %>
+</div>
+<%= link_to image_tag("rails.png", alt: t("rails_logo")),
+  "http://rubyonrails.org/" %>
diff --git a/config/database.yml b/config/database.yml
deleted file mode 100644
index a953260..0000000
--- a/config/database.yml
+++ /dev/null
@@ -1,54 +0,0 @@
-# MySQL. Versions 5.1.10 and up are supported.
-#
-# Install the MySQL driver
-#   gem install mysql2
-#
-# Ensure the MySQL gem is defined in your Gemfile
-#   gem 'mysql2'
-#
-# And be sure to use new-style password hashing:
-#   http://dev.mysql.com/doc/refman/5.7/en/old-client.html
-#
-default: &default
-  adapter: mysql2
-  encoding: utf8
-  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
-  username: root
-  password:
-  socket: /var/run/mysqld/mysqld.sock
-
-development:
-  <<: *default
-  database: first_project_development
-
-# Warning: The database defined as "test" will be erased and
-# re-generated from your development database when you run "rake".
-# Do not set this db to the same as development or production.
-test:
-  <<: *default
-  database: first_project_test
-
-# As with config/secrets.yml, you never want to store sensitive information,
-# like your database password, in your source code. If your source code is
-# ever seen by anyone, they now have access to your database.
-#
-# Instead, provide the password as a unix environment variable when you boot
-# the app. Read http://guides.rubyonrails.org/configuring.html#configuring-a-database
-# for a full rundown on how to provide these environment variables in a
-# production deployment.
-#
-# On Heroku and other platform providers, you may have a full connection URL
-# available as an environment variable. For example:
-#
-#   DATABASE_URL="mysql2://myuser:mypass@localhost/somedatabase"
-#
-# You can use this database configuration with:
-#
-#   production:
-#     url: <%= ENV['DATABASE_URL'] %>
-#
-production:
-  <<: *default
-  database: first_project_production
-  username: first_project
-  password: <%= ENV['FIRST_PROJECT_DATABASE_PASSWORD'] %>
diff --git a/config/locales/en.yml b/config/locales/en.yml
index decc5a8..f079f5e 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -1,33 +1,33 @@
-# Files in the config/locales directory are used for internationalization
-# and are automatically loaded by Rails. If you want to use locales other
-# than English, add the necessary files in this directory.
-#
-# To use the locales, use `I18n.t`:
-#
-#     I18n.t 'hello'
-#
-# In views, this is aliased to just `t`:
-#
-#     <%= t('hello') %>
-#
-# To use a different locale, set it with `I18n.locale`:
-#
-#     I18n.locale = :es
-#
-# This would use the information in config/locales/es.yml.
-#
-# The following keys must be escaped otherwise they will not be retrieved by
-# the default I18n backend:
-#
-# true, false, on, off, yes, no
-#
-# Instead, surround them with single quotes.
-#
-# en:
-#   'true': 'foo'
-#
-# To learn more, please read the Rails Internationalization guide
-# available at http://guides.rubyonrails.org/i18n.html.
-
 en:
-  hello: "Hello world"
+  words:
+    about: "About"
+    help: "Help"
+    contact: "Contact"
+    news: "News"
+    the: "the"
+    by: "by"
+    is_a: "is a"
+    log_in: "Log in"
+    home: "home"
+    rails_logo: "Rails logo"
+    sign_up_now: "Sign up now!"
+  layouts:
+    footer:
+      rails_book: "Ruby on Rails Tutorial"
+      author: "Michael Hartl"
+    header:
+      app_name: "Sample app"
+  static_pages:
+    about:
+      content: "wellcome to about page"
+    contact:
+      content: "wellcome to contact page"
+    home:
+      wellcome: "Welcome to the Sample App"
+      first_content: "This is the home page for the"
+      sub_title_first: "Ruby on Rails Tutorial"
+      sub_content: "sample application."
+    help:
+      content: "wellcome to help page"
+  content:
+    base_title: "Ruby on Rails Tutorial Sample App"
diff --git a/config/routes.rb b/config/routes.rb
index 787824f..e5cb0cf 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -1,3 +1,6 @@
 Rails.application.routes.draw do
-  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
+  root "static_pages#home"
+  get "help", to: "static_pages#help"
+  get "about", to: "static_pages#about"
+  get "contact", to: "static_pages#contact"
 end
diff --git a/config/settings.local.yml b/config/settings.local.yml
new file mode 100644
index 0000000..e69de29
diff --git a/kitten.jpg b/kitten.jpg
new file mode 100644
index 0000000..e224540
Binary files /dev/null and b/kitten.jpg differ