In this section, we are going to take a break from back-end programming and focus on the UI design portion of the application. Our UI is going to be simple and intuitive and we're going to integrate the Twitter Bootstrap framework to give us a baseline set of styles.
In this guide, we are going to put together our prototype design. To do that, I'd like to use a tool called LayoutIt. The cool thing about this tool is that it allows you to drag and drop design elements, and based on your design, and it automatically generates the corresponding HTML code for you. The HTML code includes all of the Bootstrap styles that we can use as a foundation for our app's user interface.
In this guide we're going to implement our tab functionality. If you have a look at our code, you'll see that our home tab will always be active since it's hard coded into the navigation partial. For obvious reasons this isn't a great strategy for our user interface. To fix this, let's create a Rails view helper method.
devCamp does not support ancient browsers.
Install a modern version for best experience.