Javascript Tasks

Weather App

• Visit here to see how it works.

About Weather App

• This weather app will show the weather information that it will get from the API like this, an Icon that shows the weather status, the temperature value (18°C) in Celsius unit, the weather description (clear sky), and then the user's city and country (Delhi, IN). When the user clicks on the temperature value, that will convert it from Celsius to Fahrenheit.

• The icons I used for this web application are created by the Graphic Designer Ashley Jager.

• The API provider is Open Weather Map.

Github Profile Fetcher

• Visit here to see how it works.

About Github Profile Fetcher

• When you type the username of an user on search Box and click on Search button this App will show you name, avatar, number of Github Repositories, number of followers of that user. Here we use the Github api key for fetching data of the users.

To Do List App

Visit here to see how it Works.

About To Do List

• In this App, I use vanilla Javascript to create a beautiful and functional To Do List

• This To Do List has a beautiful UI, the user can add a To-Do by filling the input and hit ENTER or PLUS after that he can rather check the To-Do when it's done, or remove it using the delete button.

• The user's to-do list is stored in the local storage, so when he refreshes the page, he can always find the list there.

• There is the possibility for the user, to clear the list, by clicking the button clear, at the top right corner of our app.

• The to do list app, shows the today's date to the user, for that I used a method called toLocaleDateString

Bookmarking Application

Visit here to see how it Works.

About Bookmarking Application

• In this App, I use vanilla Javascript to create a beautiful and functional Bookmarking App

• This Bookmarking App has a beautiful UI styled with Bootstrap, the user can add a Bookmark of his favourite Site by filling the input and click on Add Bookmark button after that he can Visit this Site using Visit button, or remove it using the Delete button.

• The user's Bookmarked List is stored in the local storage, so when he refreshes the page, he can always find the list there.

• There is the possibility for the user, to clear the Bookmarked List, by clicking the Refresh button, at the bottom left corner of our app.

Music Maker

• Visit here to see how it Works.

Clock

• This is a simple Clock built using vanilla Javascript

• Visit here to see how it Works.

Animate On Scroll using CSS Grid

• This webpage is built using simple Vanilla Javascript and CSS Grid. For this I use two Javascript DOM Property called getBoundingClientRect() and clientHeight.

• Visit here to see how it Works.

Chrome-Extension (Basic)

• This is a basic Chrome Extension named Budget Manager Which show your expenditures or Budget. You can also set the Limit of the Budget and Reset the Total by Going to Options Page. For add this in Chrome you first download the Chrome-Extension Folder or Create files like as in that Folder. Then go to chrome://extensions/ and on Developer Mode, then click load unpacked and add your folder. This Extension also use the Chrome Storage to store your previous Expenditures and also give you notification when your Expenditure greater than your alloted Total Limit. 📝

Color-Game

• This is a simple Color-Game built using vanilla Javascript

• Visit here to see how it Works.