Building the bxSlider
This is a small section that describes the construction of the plugin, different tools used in the process, how this website was made, and what kind of beers I like.
First off - view a complete annoted source here. For learning purposes, I have included comments on almost every line. Hope you enjoy!
Many tools and resources have gone into the coding of bxSlider v4.0. Obviously, Google is about as priceless a tool as you can have. However, good ol' fashioned pencil-and-paper scribblings helped formulate the math logic behind the slider functionality.
On the digital side of things: FIREBUG. Where would we be without this amazing tool? Dynamic DOM inspection done right. If you have not heard of Firebug, save yourself a million headaches and grab it (http://getfirebug.com).
Since this slider is completely responsive, I needed to use multiple mobile devices for testing. At my physical disposal I have an iTouch, an iPhone 3, an iPad4 and a Droid2. This got me through a lot of testing, but then I discovered the iOS Simulator provided by Apple's XCode SDK. It simulates an iPhone and iPad directly on your desktop. A note: this thing is not simply an "emulator". It actually contains the same programming used in the actual devices. So its 100% accurate. Very cool and very convenient.
Another great testing tool I use is VirtualBox with a Windows 7 install. Since I work exclusively on OS X, I need a way to test IE (sigh). I followed this great tutorial which describes a free, legal way to install Windows / IE in VirtualBox.
Finally, I have included two plugins in the bxSlider package. Shout outs to the following:
- jQuery Easing: been including this one for a long time. Allows tons of different easing animation types. Thanks to George Smith for his plugin: http://gsgd.co.uk/sandbox/jquery/easing/
- fitVids: makes videos responsive. Thanks to Chris Coyier and Paravel for the plugin: http://fitvidsjs.com/
Regarding the building of this website, many exciting things have contributed to the process. Namely: Sinatra. The more I use Ruby and its frameworks (Sinatra, Rails), the more I love it. It truly makes web development fun and efficient. I know, I know - Ruby is all the rage these days. But give it a try!
The following tools have contributed to the building of this site (along with most other sites I build):
- Textmate (http://macromates.com/) - the best text editor PERIOD
- Firebug (http://getfirebug.com) - DOM inspection done right
- Transmit (http://panic.com/transmit/) - gorgeous and fast FTP client
- Github (http://github.com) - social coding and project hosting
- Rainbow (http://craig.is/making/rainbows/) - JS syntax highlighter
- Fontello (http://fontello.com) - awesome font icon tool
- icoMoon (http://icomoon.io) - awesome font icon tool
Nectar of the gods
Not to forget one of the most important aspects of web development and coding: delicious Belgian ales. Shout outs to La Trappe, Maredsous, Westmalle, Tripel Karmeliet, and Leffe (just to name a few). Salute!