Frontend Applications with JavaScript and jQuery
JavaScript began its life in 1995 as a browser-embedded scripting language. It came with a powerful Document Object Model (DOM) that enabled code to directly modify the document structure, style, and content of a live website. In the early days, it was quite difficult to work with JavaScript, as it was implemented inconsistently across browsers. The jQuery library was first released in 2006 to bring ease of use and consistency to building web apps with JavaScript. It quickly became the most popular JavaScript library in use on the web (used by 70% of the top 100,000 sites online).
Over time, JavaScript has become more consistent across browsers, which has lessened the need for a library like jQuery. And many modern applications don't use JavaScript DOM manipulation directly, and instead use frameworks with higher level abstractions on top of the DOM, like Vue.js, React, or Angular.
So why learn plain JavaScript or jQuery? One, frameworks like React are built on top of vanilla JavaScript - it can be helpful to understand the technologies that make them work under the hood. Two, you may encounter older codebases that use vanilla JavaScript or jQuery. Three, using a large frontend framework can be overkill if you only need to add a small amount of dynamic functionality to a particular page.
This course goes over how to build a complete dynamic application, first using JavaScript without any dependencies, then with the jQuery helper library. The application features are fully dynamic, responding to user input to change application state and automatically updating the appropriate elements on the page, without requiring a browser refresh. By taking this course, you will be able to add dynamic features to any website and have a better understanding how modern frontend frameworks work under the hood.
Course Curriculum
-
PreviewInstallation (2:31)
-
PreviewDisplay note titles from an array of notes (7:34)
-
StartSidenote - security issues with .innerHTML (2:14)
-
StartUse methods to sort and format notes (7:07)
-
StartAdd active class to note selector on click (4:44)
-
StartPut note body and timestamp in the note editor on note selector click (6:19)
-
StartEdit the selected note on editor input (8:54)
-
StartCreate a new note with a button (4:37)
-
StartDelete the selected note with a button (6:12)
-
StartFilter notes on search input (8:14)
-
StartOverview and Installation (3:26)
-
StartDisplay note titles from an array of notes (3:37)
-
StartUse methods to sort and format notes (1:29)
-
StartAdd active class to note selector on click (4:54)
-
StartPut note body and timestamp in the note editor on note selector click (3:21)
-
StartEdit the selected note on editor input (5:32)
-
StartCreate a new note with a button (3:25)
-
StartDelete the selected note with a button (4:29)
-
StartFilter notes on search input (6:37)
Your Instructor
Peter Jang is the Dean of Instruction at Actualize, where he designs the web development curriculum and teaches live classes at the Actualize Chicago main campus.
Peter has been programming since 1998, earning a masters in mechanical engineering and writing optimization software as a consultant as well as full stack web applications at a Chicago-based startup. He has been a classroom instructor since 2008, earning a masters in education and working as a high school math teacher for 6 years as well as a web development instructor since 2015. His passion is to blend his teaching and programming expertise to create the best technology educational resources available.