Day3 of DevJourney

Manik KhajuriaManik Khajuria
2 min read

Today, I delved into Flexbox and CSS Grid layouts, then tackled DOM manipulation by building a to-do list app using vanilla JavaScript. This hands-on experience highlighted the challenges of direct DOM manipulation, emphasizing the advantages of using React for its component-based structure and state management. Additionally, I'm working on a frontend clone of Zerodha.

Today was all about understanding the complexity of the DOM and why React is such a lifesaver for developers.

I kicked off my morning practicing some Flexbox concepts—playing around with different layouts, then diving into CSS Grids. I made some random layouts just for fun and ticked off a few web dev assignments from my to-do list.

After that, I decided to really get my hands dirty with DOM manipulation. I built a simple to-do list app using vanilla JavaScript. At first, it felt pretty straightforward, but as I tried to add more features, things started to get messy. Managing all those event listeners and updating the DOM manually quickly became repetitive and confusing.

That’s when it hit me: this is exactly why React exists! With React, I can break my UI into simple, reusable components and manage state much more cleanly. Instead of worrying about manually updating the DOM, I just update the state, and React takes care of rendering everything for me. It’s like magic!

I realized that even though most modern projects don’t use direct DOM manipulation anymore, understanding how it works is super helpful before diving into frameworks like React.

On a side note, I’ve started building a simple frontend clone of Zerodha. Can’t wait to share it once it’s ready!

#100DaysOfCode #WebDevelopment #PhantomTechies2_0 #NITJ


0
Subscribe to my newsletter

Read articles from Manik Khajuria directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Manik Khajuria
Manik Khajuria