Assalamualaikum everyone,
I hope you’re all doing well. This week’s recap is coming a little late — I usually post my weekly blog every Monday, but this time I got fully absorbed in coding practice and completely forgot to publish it.
My apologies for the delay — but Alhamdulillah, the consistency in learning remained intact.
Let’s dive into Week 7, which was all about strengthening foundational concepts, revisiting core React principles, and applying them in a practical mini project.
🔁 Revisiting Core Concepts (No New Theory — Deepening Understanding)
Week 7 wasn’t focused on learning new topics. Instead, I concentrated on reviewing and reinforcing concepts from Week 5 and Week 6.
This kind of deliberate practice is essential — understanding React deeply is often more important than just learning something new.
Here’s what I revised:
✅ State Management (useState)
Managing UI interactions efficiently
Opening and closing components dynamically
Controlling state-driven view updates
✅ Thinking in React
Breaking UI into logical, reusable components
Identifying minimal required state
Maintaining one-way data flow
Keeping structure clean, simple, and predictable
✅ Props & Component Reusability
Passing data from parent to child components effectively
Building reusable, modular component structures
No new theory this week, but the reinforcement of these core ideas made React concepts much clearer.
Honestly, revisiting these fundamentals is what transforms understanding into fluency.
🧩 Mini Project (Completed): Accordion Component
The main mini-project for Week 7 was the Accordion Component — a focused, small-scale project that let me apply everything I revised.
✨ Concepts Applied:
useState → toggle open/close state of each accordion item
Props → passing title, text, and num from parent to child
Conditional Rendering → show/hide content dynamically
Array.map() → render multiple FAQ items efficiently
Component Reusability → separate Accordion and AccordionItem components
Event Handling (onClick) → toggling items interactively
Key Prop → uniquely identify list items for optimized rendering
Even though it’s a small project, it helped me understand React at a much deeper level and solidified my ability to structure components cleanly.
🍽️ Practice Project (In Progress): Eat-N-Split
In the second half of Week 7, I started a new practice project called Eat-N-Split, which is still ongoing and will likely continue into Week 8.
💡 Project Goals:
Apply state logic in a practical, real-world scenario
Improve UI/UX thinking and layout design
Understand component communication in complex structures
Develop a “Thinking in React” mindset
This project is giving me hands-on experience in building structured, interactive React applications, bridging the gap between theory and real-world usage.
📌 Final Thoughts
Even though I missed my regular Monday post, Week 7 was productive, focused, and highly effective:
Reinforced core React concepts
Completed a mini-project (Accordion)
Started a practical, ongoing practice project (Eat-N-Split)
Strengthened my React thinking and component structuring skills
InshaAllah, from next Monday onward, I’ll aim to stay consistent with my weekly blogging routine.
Thanks for reading, and see you in Week 8! 🚀
Top comments (0)