h1. !http://railsapps.github.io/images/rails-36x36.jpg(Rails Bootstrap)! Rails and Bootstrap
Rails 5.1 example application that integrates Rails and Bootstrap 4.0.
"Bootstrap":http://getbootstrap.com/ (formerly Twitter Bootstrap) provides CSS stylesheets and JavaScript code for the visual design of websites. Bootstrap is a framework for client-side (browser-based or “front end”) development, much like Ruby on Rails is a framework for server-side development.
Use this example application as a starter app for your own web applications.
You can build this application in only a few minutes using the "Rails Composer":http://railsapps.github.io/rails-composer/ tool.
h4. Quickstart Guide
The RailsApps project provides a "Rails and Bootstrap":https://tutorials.railsapps.org/ Quickstart Guide with details about integrating Rails and Bootstrap.
h4. !http://railsapps.github.io/images/join/join-railsapps.png(Join RailsApps)!:http://railsapps.github.io/
h4. From the RailsApps Project
The "RailsApps":http://railsapps.github.io/ open source project offers starter applications and tutorials for Rails developers. Generate the applications with the Rails Composer tool.
All the code is explained in the Capstone Rails Tutorials. You can purchase the "Capstone Rails Tutorials":https://tutorials.railsapps.org/ to support the project.
h4. If You Are New to Rails
If you're new to Rails, see "What is Ruby on Rails?":http://railsapps.github.io/what-is-ruby-rails.html, the book "Learn Ruby on Rails":http://learn-rails.com/learn-ruby-on-rails.html, and recommendations for a "Rails tutorial":https://tutorials.railsapps.org/rails-tutorial.
h2. What Is Implemented -- and What Is Not
The example application can be used as the basis for any website. It shows the simplest approach to implementing a website, using practices recommended by experienced Rails developers. With knowledge of Rails, the website can be adapted and customized to your needs. Features include:
- Home page
- "About" page
- Navigation bar
- Flash messages
h4. Additional Pages
The application uses the "high_voltage gem":https://github.com/thoughtbot/high_voltage for the "About" page. Additional pages can easily be added. The high_voltage gem makes it easy to add pages with static content (text that doesn't change) incorporating elements of a site-wide application layout such as header, navigation links, and footer.
For example, using the high_voltage gem, you could add pages for:
- FAQ
- News
- Legal disclaimers
h4. Database
The application does not require a database. No pages are generated using information from a database and no user-submitted data is saved to a database. However, the sqlite3 gem is included in the Gemfile so Rails ActiveRecord can be used to add database functionality to the web application.
h2. Similar Examples and Tutorials
This is one in a series of Rails example apps and tutorials from the "RailsApps Project":http://railsapps.github.io/. See a list of additional "Rails examples, tutorials, and starter apps":http://railsapps.github.io/rails-examples-tutorials.html. Related example applications may be useful:
- "Learn Rails":https://github.com/RailsApps/learn-rails companion to the book "Learn Ruby on Rails":http://learn-rails.com/learn-ruby-on-rails.html
- "Foundation and Rails":http://railsapps.github.io/rails-foundation/ shows how to integrate Foundation
- "OmniAuth and Rails":https://github.com/RailsApps/rails-omniauth uses OmniAuth for authentication
- "Devise and Rails":https://github.com/RailsApps/rails-devise uses Devise for authentication
- "Devise and Pundit and Rails":https://github.com/RailsApps/rails-devise-pundit uses Pundit for authorization
h2. Accounts You Will Need
We provide instructions to deploy the tutorial application to "Heroku":https://www.heroku.com/ which provides Rails application hosting. It costs nothing to set up a Heroku account and deploy as many applications as you want. To deploy an app to Heroku, you must have a Heroku account. Visit Heroku "to set up an account":https://id.heroku.com/signup/devcenter.
h2. Dependencies
Before generating your application, you will need:
- The Ruby language - version 2.4.1
- The Rails gem - version 5.1
See the article "Installing Rails":http://railsapps.github.io/installing-rails.html for instructions about setting up Rails and your development environment.
h2. Getting the Application
h3. Local
You have several options for getting the code on your own machine. You can fork, clone, or generate.
h4. Fork
If you'd like to add features (or bug fixes) to improve the example application, you can fork the GitHub repo and "make pull requests":http://help.github.com/send-pull-requests/. Your code contributions are welcome!
h4. Clone
If you want to copy and customize the app with changes that are only useful for your own project, you can clone the GitHub repo. You'll need to search-and-replace the project name throughout the application. You probably should generate the app instead (see below). To clone:
You'll need "git":http://git-scm.com/ on your machine. See "Rails and Git":http://railsapps.github.io/rails-git.html.
h4. Generate
If you want to use the project as a starter application, use the "Rails Composer":http://railsapps.github.io/rails-composer/ tool to generate a new version of the example app. You'll be able to give it your own project name when you generate the app. Generating the application gives you additional options.
To build the example application, Rails 5.1 must be installed in your development environment. Run the command:
The @$@ character indicates a shell prompt; don't include it when you run the command.
This creates a new Rails app named @rails-bootstrap@ on your computer. You can use a different name if you wish.
You'll see a prompt:
Enter "1" to select Build a RailsApps example application. You'll see a prompt:
Choose rails-bootstrap. The Rails Composer tool may give you other options (other applications may have been added since these notes were written).
h4. Web Servers
If you plan to deploy to Heroku, select Unicorn as your production webserver.
h4. Template Engine
The example application uses the default "ERB" Rails template engine. Optionally, you can use another template engine, such as Haml or Slim. See instructions for "Haml and Rails":http://railsapps.github.io/rails-haml.html.
h4. Testing
If you are a beginner, select "None."
h4. Other Choices
Set a robots.txt file to ban spiders if you want to keep your new site out of Google search results.
If you choose to create a GitHub repository, the generator will prompt you for a GitHub username and password.
It is a good idea to use "RVM":https://rvm.io/, the Ruby Version Manager, and create a project-specific rvm gemset (not available on Windows). See "Installing Rails":http://railsapps.github.io/installing-rails.html.
h4. Troubleshooting
If you get an error "OpenSSL certificate verify failed" or "Gem::RemoteFetcher::FetchError: SSL_connect" see the article "OpenSSL errors and Rails":http://railsapps.github.io/openssl-certificate-verify-failed.html.
h3. Edit the README
If you're storing the app in a GitHub repository, please edit the README files to add a description of the app and your contact info. If you don't change the README, people will think I am the author of your version of the application.
h2. Getting Started
See the article "Installing Rails":http://railsapps.github.io/installing-rails.html to make sure your development environment is prepared properly.
h3. Use RVM
I recommend using "rvm":https://rvm.io/, the Ruby Version Manager, to create a project-specific gemset for the application. If you generate the application with the Rails Composer tool, you can create a project-specific gemset.
h3. Gems
Here are the gems used by the application:
- "bootstrap-rubygem":https://github.com/twbs/bootstrap-rubygem - Bootstrap 4 for CSS and JavaScript
- "high_voltage":https://github.com/thoughtbot/high_voltage - for static pages like "about"
These gems make development easier:
- "better_errors":https://github.com/charliesome/better_errors - helps when things go wrong
- "rails_layout":https://github.com/RailsApps/rails_layout - generates files for an application layout
h3. Install the Required Gems
If you used the "Rails Composer":http://railsapps.github.io/rails-composer/ tool to generate the example app, the application template script has already run the @bundle install@ command.
If not, you should run the @bundle install@ command to install the required gems on your computer:
You can check which gems are installed on your computer with:
Keep in mind that you have installed these gems locally. When you deploy the app to another server, the same gems (and versions) must be available.
h3. Configuration File
To consolidate configuration settings in a single location, store credentials in the config/secrets.yml file. To keep your credentials private, use Unix environment variables to set your credentials. See the article "Rails Environment Variables":http://railsapps.github.io/rails-environment-variables.html for more information.
This is the default config/secrets.yml file:
The example application does not require any configuration settings. The file config/secrets.yml is provided in case you need to customize the application with features that require configuration settings.
If you don't want to use Unix environment variables, you can set each value directly in the config/secrets.yml file. The file must be in your git repository when you deploy to Heroku. However, you shouldn't save the file to a public GitHub repository where other people can see your credentials.
h3. Change your Application's Secret Token
If you've used the Rails Composer tool to generate the application, the application's secret token will be unique, just as with any Rails application generated with the @rails new@ command.
However, if you've cloned the application directly from GitHub, it is crucial that you change the application's secret token before deploying your application in production mode. Otherwise, people could change their session information, and potentially access your site without permission. Your secret token should be at least 30 characters long and completely random.
Get a unique secret token:
Edit the config/secrets.yml file to change the secret token.
h2. Test the App
You can check that your application runs properly by entering the command:
To see your application in action, open a browser window and navigate to "http://localhost:3000/":http://localhost:3000.
You should see a home page with a placeholder headline.
You should be able to click the navigation link for "About" and see a placeholder page.
Stop the server with Control-C. If you test the app by starting the web server and then leave the server running while you install new gems, you’ll have to restart the server to see any changes. The same is true for changes to configuration files in the config folder. This can be confusing to new Rails developers because you can change files in the app folders without restarting the server. Stop the server each time after testing and you will avoid this issue.
h2. Deploy to Heroku
Heroku provides low cost, easily configured Rails application hosting.
h4. From the Command Line
You can deploy from the command line.
If you've set configuration values in the config/secrets.yml file, you'll need to set them as Heroku environment variables. You can set Heroku environment variables directly with @heroku config:add@. For example:
Complete Heroku deployment with:
See the "Tutorial for Rails on Heroku":http://railsapps.github.io/rails-heroku-tutorial.html for details.
h2. Troubleshooting
Problems? Check the "issues":https://github.com/RailsApps/rails-bootstrap/issues.
h2. Documentation
The "Tutorial":https://tutorials.railsapps.org/rails-bootstrap provides additional documentation.
h2. Issues
Please create a "GitHub issue":https://github.com/RailsApps/rails-bootstrap/issues if you identify any problems or have suggestions for improvements.
h2. Where to Get Help
Your best source for help with problems is "Stack Overflow":http://stackoverflow.com/questions/tagged/ruby-on-rails-3. Your issue may have been encountered and addressed by others.
You can also try "Rails Hotline":http://www.railshotline.com/, a free telephone hotline for Rails help staffed by volunteers.
h2. Contributing
If you make improvements to this application, please share with others.
Send the author a message, create an "issue":https://github.com/RailsApps/rails-bootstrap/issues, or fork the project and submit a pull request.
If you add functionality to this application, create an alternative implementation, or build an application that is similar, please contact me and I'll add a note to the README so that others can find your work.
h2. Credits
Daniel Kehoe implemented the application and wrote the tutorial.
Is the app useful to you? Follow the project on Twitter: "@rails_apps":http://twitter.com/rails_apps
and tweet some praise. I'd love to know you were helped out by what I've put together.
h2. MIT License
"MIT License":http://www.opensource.org/licenses/mit-license
Copyright ©2013-16 Daniel Kehoe
h2. Useful Links, _. Getting Started, _. Articles, _. Tutorials, "Ruby on Rails":http://railsapps.github.io/ruby-and-rails.html, "Analytics for Rails":http://railsapps.github.io/rails-google-analytics.html, "Rails Bootstrap":http://railsapps.github.io/twitter-bootstrap-rails.html, "What is Ruby on Rails?":http://railsapps.github.io/what-is-ruby-rails.html, "Heroku and Rails":http://railsapps.github.io/rails-heroku-tutorial.html, "Rails Foundation":http://railsapps.github.io/rails-foundation.html, "Learn Ruby on Rails":http://learn-rails.com/learn-ruby-on-rails.html, "JavaScript and Rails":http://railsapps.github.io/rails-javascript-include-external.html, "RSpec Tutorial":http://railsapps.github.io/rspec.html, "Rails Tutorial":https://tutorials.railsapps.org/rails-tutorial, "Rails Environment Variables":http://railsapps.github.io/rails-environment-variables.html, "Rails Devise Tutorial":http://railsapps.github.io/tutorial-rails-devise.html, "Ruby on Rails Tutorial for Beginners":http://learn-rails.com/ruby-on-rails-tutorial-for-beginners, "Git and GitHub with Rails":http://railsapps.github.io/rails-git.html, "Devise RSpec":http://railsapps.github.io/tutorial-rails-devise-rspec-cucumber.html, "Install Ruby on Rails":http://railsapps.github.io/installing-rails.html, "Send Email with Rails":http://railsapps.github.io/rails-send-email.html, "Devise Bootstrap":http://railsapps.github.io/tutorial-rails-bootstrap-devise-cancan.html, "Install Ruby on Rails - Mac OS X":http://railsapps.github.io/installrubyonrails-mac.html, "Haml and Rails":http://railsapps.github.io/rails-haml.html, "Rails Membership Site with Stripe":https://tutorials.railsapps.org/rails-stripe-membership-saas, "Install Ruby on Rails - Ubuntu":http://railsapps.github.io/installrubyonrails-ubuntu.html, "Rails Application Layout":http://railsapps.github.io/rails-default-application-layout.html, "Rails Subscription Site with Recurly":https://tutorials.railsapps.org/rails-recurly-subscription-saas, "Ruby on Rails - Nitrous.io":http://railsapps.github.io/rubyonrails-nitrous-io.html, "HTML5 Boilerplate for Rails":http://railsapps.github.io/rails-html5-boilerplate.html, "Startup Prelaunch Signup Application":https://tutorials.railsapps.org/rails-prelaunch-signup, "Update Rails":http://railsapps.github.io/updating-rails.html, "Example Gemfiles for Rails":http://railsapps.github.io/rails-3-2-example-gemfile.html, "Rails Composer":http://railsapps.github.io/rails-composer/, "Rails Application Templates":http://railsapps.github.io/rails-application-templates.html, "Rails Examples":http://railsapps.github.io/, "Rails Product Planning":http://railsapps.github.io/rails-product-planning.html, "Rails Starter Apps":http://railsapps.github.io/rails-examples-tutorials.html, "Rails Project Management":http://railsapps.github.io/rails-project-management.html