How I got started in JavaScript.

http://ajaxian.com/archives/bacon-a-sizzling-new-yui-utility

Hello, I’m @cheeaun.I do lots of awesome web stuff.

In the old days, JavaScript is (sort of) known as DHTML.

Or at least, that’s how I know it.

But, I wasn’t really that interested in it.

Later I was inspired by this guy.Shaun Inman.

http://si8.shauninman.com/plete/

http://si8.shauninman.com/plete/

It was so cool,I just got to view source.

I had totally no idea what it does. Still I try to learn

JavaScript anyway.

My first attempt is to fix a small, simple problem on my

own web site.

The scenario.

I have a float-ed image here with variable width.

I don’t want this to happen.

The solution.

Display image this way if its width is roughly 90% of the container width.

The code.Please pardon my noobness.

http://gist.github.com/655217#file_floatimages1.js

The code evolves.

http://gist.github.com/655217#file_floatimages2.js

The code may look simple(?) but it took me weeks to figure it

out. I didn’t touch JavaScript for a period of time since then.

Until I got inspired, again.

One day, I saw this.

http://wiki.github.com/madrobby/scriptaculous/effect-fade

I realize the existence of JavaScript frameworks and

decided to learn one of them.

I end up learning MooTools.

http://mootools.net/

Why MooTools?

Because I like the MooTools code, syntax style, and

documentation.

http://mootools.net/docs/

http://keetology.com/blog/2009/07/00-up-the-moo-herd-mootools-tips-and-tricks

Also, MooTools developers are seriously awesome.

http://twitter.com/cpojer/status/26416392120

http://twitter.com/davidwalshblog/status/26109921796

http://engineering.twitter.com/2010/09/tool-legit.html

The best part is the more I learn about MooTools, the more I learn about JavaScript itself.

Remember my imageFloat() function? It evolves, again.

Not the prettiest code in the world but oh well.

http://gist.github.com/655217#file_floatimages3.js

I dive in deeper. I’ve coded some JavaScript-intensive apps

and MooTools plugins.

One of the most interesting is Mooj, which provides jQuery-

like syntax for MooTools.

http://github.com/cheeaun/mooj

Though the most exciting of all is MooEditable, a simple web-

based WYSIWYG editor.

http://github.com/cheeaun/mooeditable

http://twitter.com/kamicane/status/1773451438

But then, here’s my advice; Don’t even think of writing your

own WYSIWYG editor. It’s a living hell.

After all this, I’m still learning. One step at a time.

http://twitter.com/cheeaun/status/9908162471

http://twitter.com/cheeaun/status/5010791853

So does everyone else.Even you.

http://twitter.com/izs/status/9716361341

http://twitter.com/cowboy/status/20381852737

http://shouldilearnjavascript.com/

That’s all, folks. Thanks!

Tools used during the production of these slides:http://pastie.org/ http://placehold.it/ http://jsfiddle.net/ http://jsconsole.com/