DEV Community: Harshita

Pulse & Precedent: A Living Timeline of Gender Equity

Harshita — Tue, 31 Mar 2026 04:08:22 +0000

This is a submission for the 2026 WeCoded Challenge: Frontend Art

Show us your Art

Inspiration

For the #WeCoded 2026 challenge, I wanted to create more than just a timeline. I wanted to build a digital relay race.
My project, Pulse & Precedent, is an interactive archive that honors the pioneers of gender equity while passing the torch to the next generation of developers and advocates.

🕊️ A Note to the Community
To my fellow underrepresented developers: Our stories are data points in a larger constellation. Every PR you submit and every junior dev you mentor adds a "pulse" to this archive.

My Code

Building this was a journey in balancing interactivity with meaningful storytelling.

I used Google AI Studio as my primary architectural partner. It helped me move from a static grid to a dynamic Constellation UI, where voices like Malala Yousafzai and Radia Perlman float like stars in a galaxy of progress.

I utilized React, Tailwind CSS, and Framer Motion to create a lens interaction. When you hover over a name, the animation locks, the element glows, and their story emerges from the blur.

One of my biggest hurdles was making the Echo Chamber feel organic. AI Studio helped me refine the jittered grid logic to ensure the floating elements felt alive without overlapping.

The most rewarding part was coding the Action Cards. I realized that looking at history is only half the battle. We have to act on it. I integrated specific triggers for:

Accessibility Audits: Because equity starts with access.
Empathetic Code Reviews: To ensure our technical spaces remain supportive.

📂 GitHub Repo

The Full Circle: From a Student to a Mentor

Harshita — Tue, 31 Mar 2026 04:08:10 +0000

This is a submission for the 2026 WeCoded Challenge: Echoes of Experience

🛠️ The Greatest Bug: Confusing Equality with Equity

I’ve realized that the greatest bug in our industry is the confusion between equality and equity.

Equality is giving every developer the same laptop and the same documentation.
Equity is realizing that if one developer is navigating a systemic isolation, they need more than just a laptop, they need a spotlight, a sponsor, and a community.

I’ve seen how mentorship does wonders for the community. When we mentor others, we aren't just helping, we are adjusting the lighting so that brilliant voices in the shadows become visible to the center.

Reflecting on the past year, I’ve realized that building equity is a lot like preparing for a high altitude trek. Whether I’m navigating a complex codebase at Google or summiting Mount Kilimanjaro, the lesson is the same - You don't reach the peak alone but you reach it through a synchronized system of support.

The Full Circle Moment

One of my most fulfilling triumphs this year didn't happen through coding. It happened at an event at the Northeastern University in Seattle. I stood in front of a room of students and shared the very things I wish someone had told me when I was in their shoes at VIT or USC. There is a profound refactoring that happens when you share your past challenges with someone else’s future. It turns your past struggles into guidance for them.

Giving back didn't just help them but it reenergized me. It reminded me that equity starts with a conversation.

🤖 The AI Variable: Overwhelming but Amazing

As we look toward the future, there is a new variable in our equity equation: Artificial Intelligence. I’ll be the first to admit that the pace of AI is overwhelming. Every day there is a new model, a new framework, or a new agent that promises to change everything. But beneath the noise, AI is amazing because it is a democratizer.

AI tools like Gemini act as a 24/7 mentor for a student at VIT or an aspiring engineer in Seattle who might not have a professional network yet. It can explain a complex bug in plain language or help draft a first resume.

In my own work, I’ve seen how AI doesn't replace the engineer rather it removes the blank page syndrome. It allows us to focus on the high level architecture of our lives while it handles the boilerplate.

However, AI lacks one thing: Contextual Empathy. It can teach you the syntax of a language, but it cannot tell you how it feels to be the only gender in a boardroom. It can suggest a code fix, but it can't offer the great feeling of giving back at Northeastern University.

AI is the tool, but we are the architects of the equity it builds.

How are you using AI to lower the barrier for someone else?

From Prompt to Production: Building my Travel Website with Vercel v0

Harshita — Sun, 29 Mar 2026 23:40:51 +0000

Being a great engineer isn't just about writing code, rather it’s about velocity, production readiness, and continuous learning. I’m constantly experimenting with how to keep up with the latest technologies to achieve results faster and smarter, without sacrificing the standards of a production level environment.

Last weekend, I rode the Vibe Coding train and decided to try it out with my travel website, Scenic Stamps.

🦉 What is Vibe Coding?
A workflow where your primary role shifts from a Coder to a Creative Director.
Think of it like conducting an orchestra. You don’t need to play the violin, the cello, and the drums yourself. You just need to know exactly how the symphony should "vibe."

While I’ve integrated several AI workflows into my daily engineering at Google, this was the first time I decided to apply this process end to end for a personal project. My goal was to leverage my engineering expertise to up level my hobby and set up a professional, production ready website quickly.

Every project has a different North Star. For Scenic Stamps, my North Star wasn't just to build a site quickly but it was to minimize the time between a trip being taken and a story being shared.

🦉 North Star
Just as sailors once used North Star to guide their ships across oceans in the right direction, engineering teams use a metric (referred to as North Star) that represents the ultimate value the product delivers to its customers.

Building Websites in the Agentic Era

In the AI era, we constantly hear that we are moving from "Traditional Workflow" to "Agentic Workflow."

Traditional Workflow: A fancy way of saying we spend 80% of our time setting up the bare bones i.e. writing boilerplate setup, and wrestling with CSS layouts before we even touch the core logic.

Agentic Workflow: A fancy way of saying we provide a high level objective, and AI agents independently plan, reason, and execute the multi-step workflows which includes writing type-safe code to running terminal commands and auto fixing deployment errors. All we do is provide strategic oversight.

In the Traditional workflow era, building a professional personal site was a multi-day project. With Agentic era, we compress weeks into minutes.

Feature	Traditional Workflow (Hours)	Agentic Workflow (Hours)	Time Saved
UI/UX Design	8-12h (Figma/Sketch)	0.1h (Prompting)	~98%
Frontend Skeleton	4-6h (Setup/Auth)	0.2h (Auto-gen)	~95%
Component Dev	20-30h (Tailwind)	0.5h (Chat-iteration)	~97%
Responsive Debug	4-8h (Media queries)	Included (Native)	100%
Deployment & DNS	2-4h (CI/CD)	0.2h (One-click)	~90%
TOTAL	38 - 60 Hours	~1 Hour	50x Faster

The 50x speed-up isn't just about laziness, it's about reducing the cost of iteration.

⚠️ Warning: Don't Lose the Engineer in the Vibe
While Vibe Coding is 50x faster, the Agent can sometimes hallucinate. As a professional, your job is verification. Use the 80-20 Rule: Let the AI build the 80%, but use your expertise to audit the 20% — specifically security, accessibility, and performance.

🛠️ Choosing Your Agent

The AI landscape in 2026 is crowded with powerful options. I chose Vercel and v0 because I recently attended a developer event where I earned some credits and wanted to test its reputation for high speed agentic web deployment.

Vercel is the cloud infrastructure where the website actually lives and v0 is an AI tool built by Vercel specifically to generate UI and full stack code using natural language.

🦉 Avoid "Analysis Paralysis"
While Vercel/v0 is fantastic for React heavy frontends, it's not the only player in the game. In a field moving this fast, the biggest risk isn't picking the "wrong" tool; it's not picking one at all. Don't over-optimize before you've started. My suggestion? Pick one agent : whether it’s v0, Cursor, or AI Studio and start building. You can only truly evaluate a workflow once you’ve felt the friction and the wins of a live project.
Build first, benchmark later.

🏗️ Getting Setup: The Infrastructure

Before you can "vibe," you need a foundation. Here is how I went from a blank slate to a production-ready environment in under 5 minutes.

The most critical step in building a production ready setup is Version Control. You want to experiment with things, revert in case something goes wrong and have a history - all things that version control does.

Initialize the Project: Start a "New Project" in v0.
You can choose "Create new repository" when prompted.
The Gear Icon: Click the Settings button (gear icon) in the top right corner.
Authenticate: Under the "Settings" tab, click "Connect to GitHub".
Name Your Repo: A name suitable for your repo, for example scenic-stamps-v0

Note: You can also connect to an existing GitHub repository.

Step-by-Step Implementation

🧠 Engineering Your Intent

The secret to a great AI-generated site isn't just asking for a "portfolio." It’s about Technical Specificity. In the industry, we call this Prompt Engineering, or Architectural Intent.

⚠️ The Golden Rule: Garbage In, Garbage Out.
If you give a vague prompt, you get a generic result. To get a production ready site, you must provide the AI with a Technical Anchor.

When I prompted v0 for the 2026 version of Scenic Stamps, I didn't just ask for "a blog." I provided a structured intent that balanced high-performance code with a professional editorial feel.

The Prompt: "Build a professional, media-heavy travel platform using Next.js and Tailwind CSS. The layout should feature a hero section with a full-bleed cinematic image and a sleek overlay for the title. Include a 'Our Story' section for Harshita & Antriksh. Add an interactive, configurable Map component for travel tracking. Aesthetic: Minimalist UI with high-end typography."

Notice I didn't just say "Make it look good." I specified the libraries, the layout patterns, and the UX feel. By providing these in the prompt, I reduced the AI's hallucination.

🦉 What is AI Hallucination?
In a coding context, hallucination is when the agent generates non-existent code, broken CSS classes, or ghost API endpoints. By defining the libraries (Tailwind/Next.js) and the specific sections upfront, I forced the agent to stay within a known reality.

🛠️ From Iteration to Production

Once v0 generates the initial UI, use the new code editor directly in the browser to tweak the logic. The site didn’t have my specific photos from the Kilimanjaro hike or the Japan trip yet.

The Workflow: Let the AI generate the "Containers" and the "Lazy Loading" logic first.
The Manual 20%: Once the scaffold is ready, I manually swapped the placeholder paths for my optimized photography assets stored in my Photos.

Once you are set, you can hit deploy in the top right. Vercel automatically creates a preview deployment. Since we synced this to a GitHub repo we also have a clean version history.

A professional brand needs a professional URL. If you, like me, manage your domains via Squarespace, it is a simple setup. In Vercel you can Go to Settings > Domains and add your custom domain.

Closing Thoughts

By using v0, my site was up in a few minutes. Adding blog content was all that I had to focus on and rest was all taken care of. I didn't treat v0 as a no code tool rather used it as a pair programmer. It handled the visual boilerplate, then I spent my brain on the unique features, such as pulling live data from instagram or optimizing image loading for high res photography.

My travel website is live, you can check it out here. I’d love to hear your thoughts!

What’s your current AI augmented workflow? Are you still writing every by hand?

Let’s discuss in the comments!