Meet CodedBits: All-in-one Toolbox for Web Developers

Patrick McNeil is a man who wears many hats! You may know him as the the author of two of the best selling web design books out there (The Web Designer’s Idea Book or the new volume 2 of the same collection), the author of the original Design Meltdown, a prolific blogger or a tutorials ninja, but then again Patrick put his curator hat on when he created CodedBits – a real swiss knife for web developers. We had the chance to sit down for a short talk with Patrick, here’s what we learned:

What is CodedBits?
In a nutshell, CodedBits is a portal to a selection of the best online tools for generating code. Things like CSS generators, image generators and place holder elements. It includes online tools that front end developers in particular use frequently.

How did you get the idea?

I was recently working on an article series about CSS3 for designers. As a part of the series I was referencing a lot of code generating tools that made producing certain cross browser code a lot easier. I realized that I actually used a lot of tools online to produce various things; such as favicons, rounded corners and lorem ipsum text. Through this, it occurred to me to not only consolidate the best code generating tools into a single place, but to provide an application like interface where you can easily load up the tool and put it to work. So I mashed together some jQuery to make it happen.

How long did it take to build it?

I spent about 15 hours on the project. I even got to use a few of the tools to produce the end product! Such as the noise generator and 3D CSS text tools.

http://www.blindtextgenerator.com/snippets


I made use of the jQuery UI framework to build out dynamic tabs. When a tab is loaded it contains an iframe where the remote site is displayed. This is not a case of showing and hiding each tab; instead when you select a tool it creates a tab and loads up the tool. This way you can have multiple versions of the same tool open. I wanted to keep it as simple as possible, so the whole thing is pretty self contained and does not rely on WordPress or other back end system. In fact, if you have the files you can completely run it from your computer. Being lazy and not wanting to maintain a lot of code the whole thing runs off of some simple html lists of links. I was particularly geeked out when I found a tool to automagically find favicons!

Is it finished or an ongoing project?
It is hardly finished. I just had to move onto other tasks. The core functionality is there and I use it all the time. I can of course see a ton of ways to make it even cooler and I would really like to organize the tools even better.

What’s your favorite app included in CodeBits?

That is a hard question because I carefully selected the tools I liked best (it’s not intended to be an all inclusive list). My favorites probably include the HTML Snippet Generator, the Noise Texture Generator

What other web apps do you like / use?
Recently I was turned onto Trello and have been using it heavily. I also rely on HootSuite, Dropbox, Freshbooks and LastPass every day.

What are your favorite online destinations for casual browsing?
Casual browsing? I don’t think I even know what that is anymore!

Catalin is the founder of Mostash - a social marketing boutique - and he's always happy to share his passion for graphic design & social media.

 
Inspired Mag recommends Elegant Themes - 69 brilliant WordPress themes for only $39!
Backup Buddy

Each of the 69 premium WordPress themes from Elegant Themes comes expertly coded in valid XHTML and CSS, and all are made compatible with the latest version of WordPres. Eeach template performs flawlessly in each of the most widely used browsers to ensure maximum functionality. Furthermore, all sidebars are made widget ready for your convenience.

  • Cross-browser compatibility guaranteed
  • Intuitive theme options page gives you control
  • A focus on support and community
  • Frequent theme additions and upgrades
Find out more about Elegant Themes

Comments

  • Nora Reed October 27, 2011

    Very inspiring article, i am learning more on graphic n web designing, so that would be more useful to me! thanks

Leave a Reply

Trackbacks

Hosted By

7,228 Friends & Subscribers

Newsletter

Signup for our newsletter

Ads

Ads 2

Recent Comments

  • Rajat Goyal: Hey Guys, Any news on announcing the winners for this contest? It’s been way more than a week...
  • Sammantha Lindgren: I would be ecstatic about winning a shopify package. I would be able to start my online store of...
  • John: I want to win as it will help me get out of this god for saken office full off dull individuals who have...
  • Emma Szasz: I will make a store where people can upload their clothes and borrow them to others for a small amount of...
  • Meme: I would like to win the Shopify deal so I can upgrade from zen cart which is quite difficult to use in some...
  • Elliot: Because we have been using such an archaic system for ecommerce for so long and I am yearning for the...
  • Kristin M.: This would be so helpful for selling tees, digital products, and my artwork! Great giveaway.
  • Codemunkys: we love Shopify! we are big evangelists of their services … we’d like to set up a shop...
  • Chris: I use shopify now and love it, I want to start a clothing company and would love this prize.
  • Alex Meade: Would be very helpful in getting my little bike business started!
  • Rune Toldam: I will make a successful online store, selling things kissed by beautiful girls under the full moon. I...

skyscraper

Evanto

Smashing Network