Javascript, HTML and CSS playground
I have just come across a very interesting website that just simply blew my mind away. It's called JsFiddle it's a virtual playground for Web Dev's to try out snippets of code.
JsFiddle comes with a variety of preloaded Javascript libraries for every taste, it also come with an Ajax echo backend so you can dive right into hacking code. You can also check out some very cool pre loaded examples.
It has a very slick and intuitive interface, thre distinct boxes for js, Css and HTML code to be placed and a fourth box where the results of the executed code will be displayed.
And something this handy wouldn't be complete if it didn't count with a very cool sharing and embed options to share your hacks with your programming peers.
Happy coding and enjoy!
Basic Tools For Web Developers
Well to keep up with a sort of introduction kind of posts, I decided to show case some of the tools I use on a day to day basis when it comes to developing web applications.
Let me just state before I continue that my de facto browser for development purposes is and will ever be Mozillas Firefox.
Having said that lets dive into the plugins I use:
- Firebug : Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
- fireRainbow : Javascript syntax highlighting for Firebug
- WebDeveloperToolbar : he Web Developer extension adds a menu and a toolbar with various web developer tools.
- Yslow : YSlow analyzes web pages and why they're slow based on Yahoo!'s rules for high performance web sites.
- Live HTTP headers : View HTTP headers of a page and while browsing.
- FirePHP : FirePHP enables you to log to your Firebug Console using a simple PHP method call.
- showIp : Show the IP address(es) of the current page in the status bar. It also allows querying custom information services by IP (right mouse button) and hostname (left mouse button), like whois, netcraft,etc.
- colorzilla : Advanced Eyedropper, ColorPicker, Page Zoomer and other colorful goodies.
- Screen Grab : Screengrab! saves webpages as images. It will capture what you can see in the window, the entire page, just a selection, a particular frame... basically it saves webpages as images - either to a file, or to the clipboard.
- x-ray : See the tags on a page without viewing the sourcecode.
Also some very cool web apps that I commonly use:
- Jslint : The Javascript Code Quality Tool, created by Douglas Crockfor.
- JsonLint : A handy Json Validator.
- CSS selector gadget : A point and click CSS selector, works as a bookmarklet, very handy tool.
That would be it any questions or comments feel free to do so.
Happy coding!
Javascript Reading
Well it's no surprise to the people who know me that am a Javascript Fanatic!
Having said that I would like to share some of the books I have read through out the years that I have particularly liked, and most importantly found its content useful.
OReilly - Javascript the Definitive Guide 5th Edition
Apress - Pro JavaScript Design Patterns (2008)
Apress - Pro Javascript Techniques
OReilly - Javascript The Good Parts
Well hope you enjoy them as much as I did : )
Happy Coding.
piz
