Adnan Qaizar

#Javascript30

No Frameworks, No jQuery, No Templates, Only Vanilla Javascript.

Layout of this page is made with Flexbox and SVG animation, extensive and careful use of pseudo selectors as well.

Throughly enjoyed my time coding Javascript30, made sure to add pinch of my unique flavor in each of the project.

Thank you Wes Boss for being a wonderful teacher.

1You can play drum by pressing the keys. Master plays the drum on it's own. Press ~ and try.

2Made an analog clock and a digital clock.

3Had a great time working with filters to add a creative touch to images.

4Console based learning for dealing with Arrays, such as filter, map, reduce, sort etc.

5A Flex based panel gallery, where cursor changes using Javascript too.

6A very challenging task but succesfully implemented Promise, used checkboxes for individual city, state search.

7Learned more about Arrays, such as find, findIndex etc.

8Make sure to right click, I've added some neat features to help you create a real artpiece.

9Learned debugging tricks and overall console.

10Holding shift to select multiple boxes, added buttons for checking/unchecking all too.

11Made a full custom video player using Javascript and added extra controls, such as full-screen using Esc and a visual button.

12A console based app, where you type in anything. But whenever you type adnan, it shows something on console.

13A small little app for a custom scrolling effect for images.

14A console thing for learning the basics about References vs Objects.

15A creative app helped me to learn all about LocalStorage using JS.

16You can move your mouse and see the shadows move via JS.

17A tricky app that helped me to learn more about regex and array sorting.

18Learned how to take any time and add it up using Reduce.

19Just allow it to access your webcam and play with it.

20Learn more about how Speech Detection works using JS.

21Learned it but couldn't do it due to unavailability of an accelometer.

22A small script helped me to learn more.

23A cool app that helped me to learn more about DOM manipulation and Speech Synthesis.

24Pretty neat nav technique using JS.

25It was all about understanding bubbling, propogation and how it works in JS.

26An extenstion of Links Highlighter learning, had fun building such a creative nav.

27A click-and-drag slider, added little css for a twist.

28On speed change, background also blurs. Since 1 is default speed, made sure the background is at default blur at 1.

29Added percentage timer as well as extended date if you want to enter say 5000 minutes, it still works fine.

30Whew! this was a challenging app but learned a number of things here.