#JavaScript30 - Wrap Up

I did it!!! I built 30 JavaScript challenges and blogged about each one. I have learned sooooo much and feel more solid with my skills. This has truly inspired me to keep going. You don't have to build large projects just to learn - and I know I forget that »

#JavaScript30 - Day 30

Day 30: Whack A Mole Game DAY 30!!! I can't believe it!! What a super fun way to end off the course. Making a game where a user tries to click on the mole that randomly pops up. What Did I Learn? Event.isTrusted: To avoid a user cheating through »

#JavaScript30 - Day 29

Day 29: Countdown Clock This challenge included building a countdown clock which was started by clicking on pre-determined time intervals or entering in the number of minutes. What Did I Learn? Take a look at the below code: <form name="customForm" id="custom"> <input type="text" name= »

#JavaScript30 - Day 28

Day 28: Video Speed Controller UI This challenge included adding a speed controller to the corresponding video. What Did I Learn? I didn't learn anything new but it was nice to put what we had learned in previous challenges and bring them together to create a common feature. Interested in »

#JavaScript30 - Day 27

Day 27: Click and Drag to Scroll We're building the ability for the user to click and drag the contents horizontally. What Did I Learn? This was a challenging exercise and one I had to review a few times. Just when I thought I was feeling more confident with offsets, »

#JavaScript30 - Day 26

Day 26: Stripe Follow Along Dropdown Extending what we learned in Day 22's challenge, we will continue building out the dropdown menu that transforms the height, width and content as you navigate from one menu item to the next. What Did I Learn? In past posts, I've commented on how »

#JavaScript30 - Day 25

Day 25: Event Capture, Propagation, Bubbling and Once This challenge was to go a bit more in depth of the event listener method. What Did I Learn? The event Listener method includes an options object which includes once. This will listen for an event once and then unbind itself so »

#JavaScript30 - Day 24

Day 24: Sticky Nav This challenge was to make a nav bar stick to the top of the page as you scroll down. What Did I Learn? I didn't learn anything brand new but it was great to see it completed using JS fundamentals. Interested in participating in #JavaScript30? Register »

#JavaScript30 - Day 23

Day 23: Speech Synthesis This challenge provided multiple voices to choose from that read your input text. You can change the voice pitch and speed. What Did I Learn? The speech concept is new to me. I had no idea that SpeechSynthesisUtterance existed and that its function is to contain »

#JavaScript30 - Day 22

Day 22: Follow Along Links Visit Stripe's website and navigate to the menu links along the top of the page. As you hover, the dropdown transforms to different sizes as you move from one menu item to the next. This challenge tackles the first part, which is to highlight and »

#JavaScript30 - Day 21

Day 21: Geolocation based Speedometer and Compass This challenge utilized the Geolocation API to obtain a user's speed and which direction they are headed. What Did I Learn? When using the Xcode simulator, you can open up its dev tools in Safari to help debug. The Geolocation API contains a »

#JavaScript30 - Day 20

Day 20: Native Speech Recognition This challenge introduces the browser's speech recognition capabilities. What Did I Learn? I hadn't really thought about doing a speech recognition side project but now that I know it's easier to implement, I should build a fun side project! You can also add if statements »

#JavaScript30 - Day 19

Day 19: Unreal Webcam Fun In this challenge, I enabled my laptop's webcam and implemented varying effects to its RGB. I liked how out of the box it felt compared to the other lessons. What Did I Learn? ALL OF IT! Interested in participating in #JavaScript30? Register here and learn »

#JavaScript30 - Day 18

Day 18: Tally String Times with Reduce This challenge was to calculate the total video time. What Did I Learn? When you use document.querySelectorAll, it outputs a NodeList object. This looks like an array but you won't be able to use many of its methods. When a NodeList (or »

#JavaScript30 - Day 17

Day 17: Sorting Band Names Without Articles Use Array.prototype.sort() to sort a list of band names while not incorporating The, An and A while sorting. What did I learn? Similar to the Day 4 and Day 7 challenges, getting comfortable with sort() is a helpful way to practice »

#JavaScript30 - Day 15

Day 15: LocalStorage and Event Delegation This challenge uses localStorage and event delegation to create a list with checkboxes. As you add an item, the checked/unchecked event will be tied to the newly added list item. What did I learn? I learned a couple of new things in dev »

#JavaScript30 - Day 16

Day 16: CSS Text Shadow Mouse Move Effect This is something I've wanted to know how to do but haven't spent the time doing it! So I'm happy to see this type of challenge included. We learned how to apply a text shadow effect to a word when the mouse »

#JavaScript30 - Day 14

Day 14: Object and Arrays - Reference vs. Copy This was a good exercise and reminder of how updating an array and/or object can be affected depending on how the new array and/or object was created. What did I learn? Object.assign() only goes one level deep. Object »

#JavaScript30 - Day 13

Day 13: Slide In on Scroll This challenge was to implement a slide in animation on the photos as you scroll down the page. What did I learn? It can get complicated really quickly. Having to keep track of the offsets, heights and scrollY's can get overwhelming. One trick is »

#JavaScript30 - Day 12

Day 12: Key Sequence Detection This challenge taught us how to detect when a user inputs a specific key sequence. What did I learn? .includes has been used in many of the challenge solutions and it's hard to believe I didn't know it existed before. Interested in participating in #JavaScript30? »