https://github.com/jakazzy/js_30

https://github.com/jakazzy/js_30

Last synced: 16 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/jakazzy/js_30
• Owner: jakazzy
• Created: 2019-01-25T13:10:15.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2019-03-11T13:04:09.000Z (almost 6 years ago)
• Last Synced: 2024-12-10T20:41:43.479Z (2 months ago)
• Language: HTML
• Size: 5.86 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# js_30

This repository consist of series of mini projects under the JavaScript challenge for 30 days dubbed js 30 by Wes Bos. 

Consist of projects with neither libraries nor  frameworks only Vanilla JavaScript with HTML and CSS. Attached to each of these projects(with the exception of Array Cardio) is the link to the hosted project. Of all the projects, Array Cardio distinguishes itself as a problem set solved using the application of JavaScript concepts such as iterator methods(filter, maps, etc).

## Project 1 DrumKit

This is a static website made with HTML, CSS and JavaScript.

Type a letter on the keyboard corresponding to the letter on the box so it generate dum sounds.

[drumkit url](drumkit_sample.surge.sh)

## Project 2 Clock

This is a simple clock project made with HTML, CSS and JavaScript.

It offers an input field where one can set an alarm.

[clock url](clock-js30.surge.sh). 

## Project 3 Update CSS Variables

This is a static website made with HTML, CSS and JavaScript.

Drag the range selector for blur to make the picture clear or blur or drag the range selector to increase the padding for the image. 

[update CSS variables url](update-css.surge.sh)

## Project 4 Array Cardio

Includes series of JavaScript problems solved using iterator methods etc.

## Project 5 Flex Panels Gallery Image

This is a static website made with HTML, CSS and JavaScript.

It is a simple gallery project with focus on application of css principles such as flex panel and JS DOM Manipulation.

Click on any of the images and observe the transition in and out.

[flex panel url](flex-panel.surge.sh)