Up until now, Phase #3 (Frontend) was mostly about building pieces: sections, hooks, JSON files, layouts, navigation, and individual pages.
Day 8 was the day when I finally stopped creating new components and started doing something more product-like:
Making everything talk to each other properly.
This was the first time the portfolio started behaving like a cohesive product instead of a collection of screens.
From "Components" to "Product"
As a developer, it’s very tempting to keep adding features:
- one more section,
- one more animation,
- one more component.
But as a product owner/project lead, I forced myself to step back and ask:
- Do all pages feel consistent?
- Does the data flow make sense?
- Is the UX predictable for a real user?
So Day 8 became an integration and refinement day.
No new architecture.
No new fancy features.
Just alignment and polish.
1. Updating All Pages with Real Data
All the pages under src/pages/*.jsx were updated to properly consume:
- the latest JSON structures,
- the new hooks,
- and the finalised section components.
This included:
- About
- Projects
- Experiences
- Achievements
- Open Source
- Contact
Each page now follows the same mental model:
JSON → Hook → Page → Sections → UI
Which means:
- No hardcoded text.
- No magic values.
- Everything comes from data.
From a long-term perspective, this is huge:
- Tomorrow, I can replace JSON with an API.
- The UI won’t change at all.
That’s real frontend architecture, not just React code.
2. Making the Navigation Truly Reflect the Product
Earlier, the Navbar and Footer existed mostly as components.
On Day 8, they finally became product navigation.
I updated:
- Navbar links
- Footer links
- Contact references
So that:
- There are no dead routes.
- There are no fake sections.
- Everything matches the actual pages.
This is one of those things users never notice, but they instantly feel when it’s wrong.
Broken navigation = broken trust.
3. Contact Page: From Feature to Experience
The Contact page was already built earlier. Day 8 was about making it feel complete:
- Ensuring form states work correctly.
- Making sure social links are consistent.
- Aligning the content with the rest of the site's tone.
At this point, Contact stopped being:
"A form component"
and became:
"The only real entry point for human interaction with the product."
That’s a very different mindset.
4. The Most Underrated Skill: Restraint
This day taught me something important:
Sometimes the best engineering decision is to not build anything new.
Instead:
- review,
- refactor,
- simplify,
- align.
As a solo developer wearing multiple hats (PM, designer, architect, dev), this step is very easy to skip.
But this is exactly what separates:
- a demo project
from
- a product foundation.
Product Thinking vs Tutorial Thinking
A tutorial would say:
"Today we updated some pages."
A product mindset says:
"Today we validated the entire frontend architecture."
That’s the difference.
Day 8 was about:
- coherence,
- consistency,
- and credibility.
Not code volume.
Not feature count.
But system quality.
What Changed Emotionally (Not Technically)
This might sound weird, but after Day 8:
I stopped seeing this as:
"my React portfolio"
And started seeing it as:
"my personal product"
Something I could:
- evolve,
- extend,
- maintain,
- and even hand over to someone else.
That’s a huge psychological shift for any engineer.
Why Day 8 Matters More Than It Looks
Day 8 won’t impress on GitHub commit history. It’s a small diff. A few files changed.
But in real-world projects, this is exactly how products mature:
Not with big features. But with small integration days that remove friction everywhere.
Closing Thought
Day 8 was not about building. It was about owning the system.
And that, more than any new component, is what actually makes you a senior engineer in mindset, not just in years of experience.
If you’re following along, the complete source lives here:
👉 GitHub Repository: Portfolio.
Top comments (0)