Uploaded July 2015 | Updated September 2026, 1 week ago

---

In this video, we'll convert plain jQuery code to an object literal module. It will still use jQuery, but the pattern will be much cleaner and easier to maintain.

Missed video #1? youtu.be/HkFlM73G-hk

Source code for this video:
codepen.io/anon/pen/OVZpqO?editors=101

Web developers often don't see the value of changing the way they write javascript code - this is often due to the fact that they have never had to code a large application. Code that doesn't look messy at first gets VERY messy when you need a lot of code doing a lot of things.

This video will show how to take that messy jQuery code and clean it up into a self-encapsulated module that is easy to work with.

Modular JS #1 - Object Literal Pattern pt 1:
youtube.com/watch?v=HkFlM73G-hk&index=1&list=PLoYCgNOIyGABs-wDaaxChu82q_xQgUb4f

Modular JS #2 - Object Literal Pattern pt 2:
youtube.com/watch?v=m-NYyst_tiY&index=2&list=PLoYCgNOIyGABs-wDaaxChu82q_xQgUb4f

Modular JS #3 - Revealing Module Pattern:
youtube.com/watch?v=pOfwp6VlnlM&index=3&list=PLoYCgNOIyGABs-wDaaxChu82q_xQgUb4f

-~-~~-~~~-~~-~-
Also watch: "Responsive Design Tutorial - Tips for making web sites look great on any device"
youtube.com/watch?v=fgOO9YUFlGI
-~-~~-~~~-~~-~-