Day 70 JavaScript Mini Framework/Library Project

For the past couple of days I have been busy moving, so there hasn’t been any blog updates. Instead of staying up till 3am coding I’ve been reorganizing trying to get situated at the new apartment. First time had the weekend off in a long time.

However, I finally completed The Weird Parts Of JavaScript by Anthony Alicea course. The final project of the course was to make our own mini library/ framework.

The goal of the library was to create a greeter. The greeter library function was to be able to give a formal and informal greeting when given a first and last name. It’d also have to support two languages English and Spanish. Lastly, the code would have to be reusable and easy to type ‘G$()’. The ‘G$()’ Function would mimic the jQuery $ operator to replace new to create function constructors. Also similarly to jQuery our new library/framework would have another library within it.

The first step was to structure safe code. Which meant to use an IIFE. Next step was to create a click event on login to set a greeting depending on the language chosen. Create a new object first name and last name. Then use the greeter to set a heading on html with an ID of greeting with the language chosen. The html greeting method sets up the jQuery object just needs a selector and have the language set appropriately. Next I needed to set up a click event for login. The ID was set up as login and use jQuery function to pass it the login ID and a click event and pass it a function object made on the fly with a function expression. After this I made a brand new object using G$() my object and pretend to know login was John Doe and hide entire select login drop with .hide. Lastly create a method chaining function as a single line of code.

Set language depending on what’s chosen in the select box. Chain a method that updates the H1 ID of greeting, set formal greeting to true and lastly .log to log it to the console.

That was it! A mini library/ framework that mimics the structure of jQuery and its approach of chain-able methods.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Up ↑

%d bloggers like this: