Category Archives: hosting

Errbit + HTTPS: Setting up Errbit reporter (Airbrake v5 gem) to work with self-signed HTTPS certificate

Note: If you’re using old Errbit version (0.2.0, 0.4.0) and an old Airbrake version (v4) please refer to this manual to make it work with self-signed certificates. Having an error catcher like Errbit behind SSL is generally a good idea. Especially when Errbit is hosted on a different server than you application (for example when […]

Read more at the source

Synology DMS 6 + Gitlab Docker + Gmail

When you’ll setup your Gitlab instance using Synology DMS 6.0 UI, despite the fact that you’ve provided all the Gmail credentials, you will notice that it does not send any emails. You probably end up with a message similar to this one when: EOFError: end of file reached It may sound a bit enigmatic, but […]

Read more at the source

Multiple UNIX sockets bindings for Puma cluster

If you want to bind Puma to a unix socket, you can do this either by providing a -b options: or using a puma.rb config file and setting the bind options. Unfortunately if you try to bind multiple Pumas to one socket, you might end up with issue similar to this one: So, what is […]

Read more at the source

Recovering QNAP NAS lost data when NAS not starting properly

QNAP is a company that designs great network attached storages (NAS). Unfortunately, even their NAS can crash. Mine did. Before you get to how to recover the lost data, here’s my NAS and RAID spec (so that you can understand what and why I did): QNAP TS-410U RAID5 4 HDD (/dev/sda, /dev/sdb, /dev/sdc, /dev/sdd) Approximately […]

Read more at the source

Ruby – Installation and compilation from sources on Debian

If you don’t want to use Ruby from your repositories and you don’t want (or can’t because of some reason) to use RVM, here’s a quick howto download and compile Ruby from sources (all the commands should be executed with sudo or as a super user): First a small update and some neccessery libs: Then […]

Read more at the source

MongoDB monitoring with Munin – Setting up Munin to work with MongoDB

To monitor MongoDB you can use many tools, some like MongoDB Management Service (MMS) are cloud based, some like Munin might be installed locally. Today we will focus on setting up Munin to monitor MongoDB. Getting started with Munin If you don’t know what Munin is, or how to install it on your platform, please […]

Read more at the source

Ruby & Rails: Making sure rake task won’t slow the site down

If you don’t have multiple cores and/or you have a small VPN, you may end up with a huge slow down of your web app, when rake tasks are executed. This can be a big issue especially when you use something like whenever to perform periodic tasks. Luckily there’s a nice program: nice is a […]

Read more at the source

Undefined and cache/xxx and invalid %-encoding weird requests

Recently I’ve been having a lot of weird looking requests that would end up reported in Errbit. Initially I thought that it is my fault but after double checking all the JS code, I would still get those errors. Fixing this is quite easy. Undefined/cache/xxx requests come from Complitly malware chrome plugin. Solution to this […]

Read more at the source

Nginx: Block access to certain parts of your app based on visitor country

It may be a good idea to enable some parts of your application based on a user country. You could do this on an application level: But why would you want to store non-business logic like this in your app? There’s a much better solution: you can use the Nginx GeoIP Module. To do […]

Read more at the source

Running GitLab 7.1 using Puma instead of a Unicorn

Warning Warning! Before you do this, please read why you should’nt: why did gitlab 6 switch back to unicorn? So now, when let’s get started… Gemfile updates Nothing special here. Just add: and then: Puma config Create a puma.rb file in your gitlab config dir and copy/paste this: and At this point, you should be […]

Read more at the source

Adding Twitter’s Bootstrap CSS to your Rails app

November 10, 2011

Bootstrap in action, as demoed in Luca Pette's article

Updated Feb 2012 for Bootstrap 2.

Twitter’s new CSS toolkit, Bootstrap, is all the rage these days. I explain how to get the CSS, and optionally the mixins and the JavaScript, into your Rails app.

“How do I serve Bootstrap through Rails 3.1’s asset pipeline?”

Just add Ken Collins’s (@metaskill’s) less-rails-bootstrap gem (announced recently on his blog) to your Gemfile:

1	`gem 'less-rails-bootstrap'`

Require it in your app/assets/stylesheets/application.css:

1	`*= require twitter/bootstrap`

Done. You now have Bootstrap 2 working in your Rails app. :-)

By the way: Did you know that Bootstrap is written in LESS, a stylesheet language like SCSS?

“Ugh, I hate LESS. Can I get Bootstrap as plain CSS please?”

That’s OK, not everybody likes LESS. Behind the scenes, less-rails-bootstrap transparently compiles the Bootstrap LESS files into CSS through Rails’s asset pipeline (using the less-rails gem). This means that there is no scary client-side compilation with less.js (like the LESS website advertises). And on the Rails side, you can just carry on using SCSS. In other words, Bootstrap by default acts like any regular CSS library – all the LESS stuff is hidden from you.

“I love LESS. Can I use the Bootstrap mixins in my LESS code?”

Sure you can. Just import the mixins and variables in any stylesheet file ending in .less (like posts.css.less):

@import "twitter/bootstrap/variables";
@import "twitter/bootstrap/mixins";

div.post {
   color: @yellow;  // <-- using variables
   #gradient.vertical(@black, @blue);  // <-- using mixins
}

Warning: Do not get confused about requiring vs importing:

Use = require twitter/bootstrap at least once (typically in application.css) to get all the CSS rules that come with Bootstrap. The files will be processed through Sprockets (Rails’s asset handler), which guards against duplicate inclusion. If you tried to require the mixins or variables, it would have no effect, since Sprockets compiles them separately from your stylesheets.
Add the two @import lines above to every LESS file in which you want to use Bootstrap mixins or variables. As you can verify by inspecting the CSS output, importing them has no effect (i.e. no CSS rules are generated) until you actually use the mixins and variables in your own CSS rules. If you tried to @import the entire “twitter/bootstrap” library, it would show up multiple times in your compiled CSS assets, because Sprockets can’t guard against duplicate inclusion when you use @import.

To summarize, require the entire toolkit, and @import the mixins and variables.

“Can I use Bootstrap’s JavaScript plugins?”

Easy enough. Add this to your application.js:

1	`//= require twitter/bootstrap`

The plugins load through jQuery’s .ready, so be sure to wrap your own code as well:

1
2
3

$(function() {
  // ...
});

“Now how do I get started using Bootstrap in my layouts and views?”

Try adding a button in any view file – it should be rendered pretty:

1	`<input type="button" value="Click me" class="btn primary">`

Or try adding a black navigation bar to your layout:

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <a class="brand" href="/">Whizboo App</a>
      <ul class="nav">
        <li class="active"><a href="/">Home</a></li>
        <li><a href="/about">About</a></li>
      </ul>
      <ul class="nav pull-right">
        <li><a href="/sign_in">Sign In</a></li>
      </ul>
    </div>
  </div>
</div>

Fore more inspiration, check out Luca’s article about using Bootstrap with Rails.

“I want more explanation. / I heard there is a Sass version of Bootstrap.”

Check out ”Twitter Bootstrap, Less, and Sass: Understanding Your Options for Rails 3.1” on RubySource!

[…]

The Ruby Rails Aggregator