Harsh_here

Full Stack Engineer in making

#MERNStack

Learning in Public? Let's Connect!

[Harsh_here @Dev_Harsh22]

🚀 Excited to share that I’m starting my MERN Stack Challenge – Cohort 2.0!

Over the next 100 days, I’ll be documenting my daily learnings here — from MongoDB to React to full-stack projects.

Why?
To stay consistent 💯
To build in public 🌍
To become a better developer 👨‍💻

🚀

[Harsh_here @Dev_Harsh22]

Q8: How do you create animations like the Instagram heart?
✔️ Add/remove CSS classes dynamically + trigger with events.

Q9: What does setTimeout() do?
✔️ Runs a function once after a delay.

Q10: What about setInterval()?
✔️ Repeats a function continuously at fixed intervals.

[Harsh_here @Dev_Harsh22]

DOM Quiz Time

Q1: What does document.querySelector() do?
✔️ It selects the first matching element from the DOM.

Q2: How is querySelectorAll() different?
✔️ It returns all matching elements as a NodeList.

Q3: How do you detect a click event in JS?

[Harsh_here @Dev_Harsh22]

Q6: How do you move a div from left to right?
✔️ Modify its position: https://t.co/1coebJ1H6V.left = "50px".

Q7: How do you detect a double-tap/ double click?
✔️ Use dblclick event or custom double-click logic with timestamps.

[Harsh_here @Dev_Harsh22]

💻 Day 35 of Cohort 2.0 - DOM + Project -

Today we created the Instagram-style double-tap like animation ❤️ using DOM manipulation.
Learned how to handle double-click detection and trigger animations dynamically.
A super fun and interactive feature to build! ✨

#Day35 #DOM

[Harsh_here @Dev_Harsh22]

🔑 Key Takeaway:
Not every day is about new topics consistency + reflection also counts as learning.

#day34
#100DaysOfCode #Cohort2 #JavaScript #WebDev #LearningInPublic #CodingJourney

[Harsh_here @Dev_Harsh22]

💻 Day 34 of Cohort 2.0 - Quick Brainstorm

Today wasn’t a heavy learning day, but I made sure to think through my progress and stay consistent.
Here’s my quick self-check:

🔹 How can I make my DOM projects more interactive?
✔️ By using more event listeners & dynamic styling.

[Harsh_here @Dev_Harsh22]

🔹 What can I build with setTimeout & setInterval?
✔️ Auto color-changers, countdowns, text animations, movement effects.

🔹 What should I revise next?
✔️ DOM selection + styling + events.

🔹 What’s my next step?
✔️ Build 1–2 small DOM projects to combine all concepts.

.

[Harsh_here @Dev_Harsh22]

💻 Day 33 - Self-Study Day

I revised everything I've learned so far DOM basics, event listeners, styling, and timers.
A quiet but solid revision day!

#Day33 #JavaScript #WebDev #100DaysOfCode #Cohort2

[Harsh_here @Dev_Harsh22]

🔑 Key Takeaway:
Timers + DOM = endless creative possibilities. Feeling more confident with interactive JS now!

#Day32 #JavaScript #DOM #setTimeout #setInterval #WebDev #Cohort2 #CodingJourney #100DaysOfCode

[Harsh_here @Dev_Harsh22]

💻 Day 32 of Cohort 2.0- Mini Projects + Timers in JS

Today I built multiple small DOM projects using everything I learned in the last two days element selection, styling, events, and interactivity.

Also learned two powerful timing functions:

-setTimeout() ⏳
-setInterval() 🔁

[Harsh_here @Dev_Harsh22]

Wrapped up the session by implementing all of this in small interactive DOM projects making elements move, change color, and respond to user actions.

🔑 Key Takeaway:
DOM manipulation makes a webpage feel alive.

#Day31 #javascript #DOM #WebDev #Cohort2 #100DaysOfCode

[Harsh_here @Dev_Harsh22]

💻 Day 31 of Cohort 2.0 - DOM Revision + Interactive Mini Projects

Revised the core DOM concepts again today:

-document.querySelector()
-addEventListener()
-Updating styles like https://t.co/1coebJ19hn.left
-Changing text on click
-Changing background colors dynamically

[Harsh_here @Dev_Harsh22]

-innerHTML

🔑 Key Takeaway:
DOM is the bridge that lets JavaScript control the entire webpage.

#Day30 #JavaScript #DOM #WebDevelopment #Cohort2 #CodingJourney #100DaysOfCode #mernstackdevelopers

[Harsh_here @Dev_Harsh22]

💻 Day 30 of Cohort 2.0 - DOM Basics + The 4 Pillars

Started the DOM today and learned its 4 core pillars:
1️⃣ Selecting elements
2️⃣ Changing HTML
3️⃣ Changing CSS
4️⃣ Adding Event Listeners

Also covered:
-querySelector()
-querySelectorAll()
-getElementById()
-addEventListener()

[Harsh_here @Dev_Harsh22]

-Shallow vs deep copying of objects
-Optional Chaining (?.) for safe access

🔑 Key Takeaways:

-Objects help store structured data
-Destructuring + optional chaining = cleaner code
-Copying objects isn’t as simple as it looks

#Day29 #JavaScript #Objects
#100DaysOfCode #cohort2

[Harsh_here @Dev_Harsh22]

💻 Day 29 of Cohort 2.0 - Understanding Objects in JavaScript

Today I explored JavaScript Objects in depth:

-Key–Value pair structure
-Dot vs Bracket notation
-Nested objects & deep property access
-Object destructuring
-Looping through objects (for…in, Object.keys() etc.)

[Harsh_here @Dev_Harsh22]

-IIFE (Immediately Invoked Function Expressions)
-Hoisting and how JS handles functions behind the scenes

A super important day understanding functions properly makes everything else in JS much easier! ⚡

#Day28 #JavaScript #Functions #mernstackdevelopers

[Harsh_here @Dev_Harsh22]

💻 Day 28 of Cohort 2.0 - Deep Dive into Functions

Today’s Session was packed with core JavaScript concepts:

-Functions and how they really work
-Parameters vs Arguments
-Arrow Functions
-First-Class & Higher-Order Functions
-Closure & Lexical Scope

[Harsh_here @Dev_Harsh22]

💡 Key takeaway:
Understanding concepts is good, but consistent practice is what actually builds confidence.

#Day27 #JavaScript #Arrays #ProblemSolving #CodingJourney #Cohort2 #WebDevelopment #100DaysOfCode

[Harsh_here @Dev_Harsh22]

💻 Day 27 of Cohort 2.0

Array Problem Solving

Today I focused on solving different types of Array problems to strengthen my logic
Worked with methods like map, filter, reduce, loops, and basic transformations.
The more I practice, the more natural JavaScript’s Array flow feels