Showing posts with label html5. Show all posts
Showing posts with label html5. Show all posts

22 March 2011

JavaScript Heaven with jsFiddle

I may have finally found the perfect tool to build and test JavaScript concoctions on the fly (or at least a really cool one). I have been utilizing Kodingen (which is awesome) to code on my Cr48 and then flipping between the JavaScript code, css, html (I know I could put these all in the same document but navigating that is more exhausting to me that toggling windows) and rendered pages to test my script, styles, and html quickly.  This can get a bit cumbersome, and flipping between tabs or workspaces can get old very quickly.

So I was reading through the Chromium blog and I watched a video of Paul Irish, a developer advocate for the Chrome team, discussing some of the cool tools using Google Chrome to develop quicker.  This sparked my interest in Paul Irish and the first post I saw on his site had an embedded example from jsFiddle.  This led me to jsFiddle.net.  Perfect.  Clean.  Awesome. 

The setup of the editor reminds me of the HTML5 playground at HTML5Rocks, only without the need to switch between views of CSS, HTML, and JavaScript.  In jsFiddle the concurrent views of HTML, CSS, JavaScript, and the current render are all visible because they are each contained in their own iframe.  I decided to try it out with a quick "hello world" test which due to the ease of use and another Paul Irish contribution CSS3Please, I was able to quickly generate this little fiddle:


Another great feature is the 'TidyUp' button which will clean up your code's indents and spacing, which is super handy if you are like me and you have moved things around or copied text in from outside sources (css3please).  Also included is JSLint which is a great utility that will examine the quality of your code and "will hurt your feelings" as it tells the user exactly what is wrong with their JavaScript.  I used jQuery as my JavaScript library of choice, but also included are Mootools, YUI, Prototype, Dojo, Glow, Procession.js, ExtJS, RightJS,  Raphael, and No Library (pure JS)... so just about any flavor you might care for.   I am sold on jsFiddle and I will likely be using it as my primary tool to fiddle with JavaScript.

20 February 2011

Coding in the Cloud: Part II

Coding in the cloud is something I feel I need to be able to do easily now that I'm utilizing my Google Chrome OS notebook.  Last post I discussed utilizing an online development environment called CodeRun and found it to be quite useful, but it is not my favorite cloud development environment.  My favorite (so far) is called Kodingen.

Kodingen is "The Cloud Development Environment, Online Code Editor, Cloud Hosting, Web-based access to file system, Web-based ftp & svn integration" or at least it will be all of those things.  Currently Kodingen is in Beta v3 so not all of those features are available as of this writing.  Even though this cloud development environment is not fully operational it is still fantastic.  As shown on their site, there is code support for php, perl, and python [with future support of django, ruby on rails, fastcgi,...].  The site you create is hosted on Kodingen, and they offer a default 500mb of diskspace, 1000mb of monthly traffic, 1 domain, 6 subdomains, and 5 databases by default (of course you can "get extra resources").  So I set out to play around with Kodingen.

Setting up an account was easy enough, so I logged in an got to work.  I quickly created a website with an HTML5 canvas star field plastered on it all from the comfort of my Cr-48.  As far as code editor selection, currently there is support for Bespin, CodeMirror, and Ymacs.  I found that CodeMirror suits my needs best, though I might have been inclined to choose Bespin (probably because of its name), but it lacks good support for copy/paste in Google Chrome.

A couple features I have not utilized more than a simple evaluation are the database support and the image editing.  Creating a MySQL database was a snap (PostgreSQL, and SqLite support to come) so I created a simple database with a couple tables that seemed to perform well enough.  Image editing is currently supported using Pixlr (support for Aviary to come) and again seemed to perform well enough.  Kodingen also reports future support for code repositories such as svn, git, and mercurial where one can create teams to manage joint coding efforts (can't wait to try it out).

So after my week of trialling CodeRun and Kodingen, I must lean toward Kodingen based mostly on personal preference, but I feel that both systems create a sound cloud based development environment.  As I mentioned in the last post I think these systems would be ideal for educators wishing to introduce their students to web development or as a great code on the go environment.