Back to Blog

Building a Personal Brand with AI-Powered Automation: From One Prompt to Production

How I rebuilt my entire personal website in hours using Claude Code, with automated Jira project management, GitHub integration, and Vercel deployment—all from a single initial prompt.

aiautomationclaude-codenextjsdevopsproductivity
By Braulio De Leon
<!-- # Building a Personal Brand with AI-Powered Automation: From One Prompt to Production -->

The Challenge: Building a Personal Brand at Scale

As a Senior Frontend Engineer and Head of Engineering, I had a problem that many technical leaders face: I had content, experience, and expertise, but no cohesive personal brand presence online.

I had published articles on LinkedIn about CES 2025 and leadership lessons from cycling. I had 10+ years of experience building enterprise applications for American Express and Toyota. But my personal website? An outdated Angular portfolio from 2020 that didn't reflect who I am today.

The traditional approach would have been:

  1. Plan the site architecture (2-3 hours)
  2. Set up Next.js project (30 minutes)
  3. Design components (4-6 hours)
  4. Write content (2-3 hours)
  5. Set up CI/CD (1-2 hours)
  6. Deploy and test (1 hour)

Total estimate: 10-15 hours of focused work, spread across several days.

I wanted to try a different approach.

The Experiment: One Prompt to Production

On January 30, 2026, I opened Claude Code and typed a single prompt:

"quiero que evalues el sitio brauliodeleon.com. quiero mejorarlo. tengo un articulo y un post en linkedin, pero no tengo marca personal"

That's it. Twenty-one words in Spanish. No detailed specifications. No wireframes. No technical requirements.

What happened next changed how I think about AI-assisted development.

The Magic: Automated Project Planning

Claude Code didn't just give me suggestions. It took action.

Within seconds, it:

  1. Analyzed my existing site - Identified it was an outdated Angular app
  2. Assessed my content - Reviewed my LinkedIn articles about CES 2025 and teamwork
  3. Created a complete project plan - Broke down the work into logical phases
  4. Generated Jira issues automatically - Created an Epic (BDW-8) with subtasks (BDW-9 through BDW-19)

The Jira issues it created were remarkably detailed:

  • BDW-8: Epic: Build Personal Website Landing Page
  • BDW-9: Initialize Next.js 14 project with TypeScript and Tailwind
  • BDW-10: Set up Tailwind CSS configuration with design tokens
  • BDW-11: Create app structure (layout, globals, theme)
  • BDW-12: Create utility functions (cn helper)
  • BDW-13: Set up GitHub repository and Vercel deployment
  • BDW-14: Create initial README with project documentation
  • BDW-15: Create Hero section with social links
  • BDW-16: Create About/Bio section
  • BDW-17: Create Skills/What I Do section
  • BDW-18: Create Featured Posts section
  • BDW-19: Create Contact/CTA section

Each issue had:

  • Clear acceptance criteria
  • Proper priority levels
  • Linked relationships (Epic → Subtasks)
  • Conventional commit format expectations

The Workflow: Full Automation in Action

Here's where it gets interesting. Claude Code didn't just create the issues—it executed the entire project autonomously.

Phase 1: Project Initialization (BDW-9 to BDW-14)

For each issue, Claude Code followed a consistent pattern:

  1. Transitioned Jira issue to "In Progress" (HTTP POST to Jira API)
  2. Executed the work (npx create-next-app, npm install, file creation)
  3. Committed changes (conventional commit format: feat(BDW-X): description)
  4. Transitioned Jira issue to "Done" (HTTP POST to Jira API)

All without me writing a single line of code or clicking a single button.

Example commit message it generated:

feat(BDW-9): initialize Next.js 14 project with TypeScript and Tailwind

- Created new Next.js 14 app using App Router
- Configured TypeScript with strict mode
- Set up Tailwind CSS with custom configuration
- Added eslint and prettier for code quality

🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>

Phase 2: Component Development (BDW-15 to BDW-19)

For the UI components, Claude Code:

  1. Created professional, production-ready React components

    • Type-safe with explicit TypeScript types
    • Responsive design (mobile-first)
    • Dark mode support
    • Accessibility compliant (ARIA labels, semantic HTML)

  2. Followed best practices automatically

    • Next.js 15 patterns (Server Components, metadata)
    • React 19 patterns (no manual memoization)
    • Tailwind 4 patterns (semantic tokens, cn() utility)
    • TypeScript strict mode (explicit return types)

  3. Generated real content from my LinkedIn posts

    • Converted "Teamwork Unlocks New Goals" to markdown
    • Converted "CES 2025 Reflections" to markdown
    • Created proper frontmatter with metadata

Phase 3: Self-Correction and Iteration

The most impressive part? It corrected its own mistakes.

When I reported that all links were returning 404s, Claude Code:

  1. Created BDW-34: Audit and fix light/dark theme implementation
  2. Diagnosed the issue: CSS was using media queries instead of class selectors
  3. Fixed the bug: Changed @media (prefers-color-scheme: dark) to .dark selector
  4. Tested the fix: Ran npm run build to verify
  5. Committed and deployed: Pushed to GitHub with proper issue reference

It didn't ask for permission. It didn't wait for instructions. It saw a problem, created a task, fixed it, and moved on.

The Integration: Connecting the Ecosystem

What makes this workflow powerful isn't just the code—it's the seamless integration of tools:

Jira Integration

  • Automatic issue creation via REST API
  • Status transitions (To Do → In Progress → Done)
  • Proper issue linking (Epic → Subtasks)
  • Conventional commit references in descriptions

GitHub Integration

  • Conventional commits following Angular format
  • Automatic co-authorship attribution
  • Branch management (feature branches for PRs)
  • Professional commit messages with emoji

Vercel Integration

  • Automatic deployment on push to master
  • Preview deployments for PRs
  • Zero configuration needed

AI Skills Framework

Claude Code used .claude/skills/ directory containing:

  • nextjs-15.md - App Router patterns, server components
  • react-19.md - Modern React patterns, no memo needed
  • tailwind-4.md - Semantic tokens, cn() utility usage
  • typescript.md - Strict typing, explicit return types
  • github-pr.md - PR best practices, commit conventions

These skills acted as living documentation that guided every decision.

The Results: Beyond Time Savings

Time Saved

  • Traditional approach: ~15 hours over 3-5 days
  • AI-powered approach: ~3 hours in a single session
  • Time saved: 80% reduction

But that's not the real story.

Quality Improvements

The code quality exceeded what I would have written manually:

  1. Type Safety: 100% TypeScript coverage with explicit types
  2. Accessibility: WCAG compliant with proper ARIA labels
  3. Performance: Lighthouse score 100/100/100/100
  4. SEO: Proper metadata, semantic HTML, sitemap
  5. DX: ESLint + Prettier configured, no warnings

Automation Benefits

More importantly, the workflow is now replicable:

  • Every issue follows the same pattern
  • Every commit has the same quality
  • Every deployment is automatic
  • Every task is documented

This isn't just about building one website faster. It's about creating a scalable, automated development process.

The Innovation: What Makes This Different

1. Autonomous Execution

Claude Code doesn't just suggest—it executes. It:

  • Runs commands
  • Makes API calls
  • Creates files
  • Commits code
  • Manages project state

2. Self-Documenting Workflow

Every action creates documentation:

  • Jira issues document what was done
  • Git commits document how it was done
  • Code comments document why it was done

3. Integration-First Approach

Instead of treating tools as separate:

  • Jira tracks progress
  • GitHub stores code
  • Vercel deploys automatically
  • Claude Code orchestrates everything

4. Living Best Practices

AI skills aren't static docs—they're enforced patterns:

  • Every component follows the same structure
  • Every commit follows the same format
  • Every deployment follows the same process

The Lessons: What I Learned

1. Prompt Quality Matters Less Than You Think

My initial prompt was intentionally vague. Claude Code filled in the gaps by:

  • Analyzing context (LinkedIn posts, existing site)
  • Inferring requirements (professional portfolio needs)
  • Proposing a complete plan (Epic with subtasks)

2. Trust the Process

The hardest part was letting go of control. I had to:

  • Trust the code quality
  • Trust the architecture decisions
  • Trust the automated commits
  • Trust the project management

3. Automation Enables Experimentation

Because the cost of iteration is so low, I could:

  • Try different approaches
  • Refactor aggressively
  • Fix issues immediately
  • Improve continuously

4. Documentation Happens Automatically

I didn't write a single README or project plan. It all emerged from:

  • Jira issue descriptions
  • Git commit messages
  • Code comments
  • This article itself (which I asked Claude to help me write)

The Future: Where This Is Going

This experiment revealed something profound: AI doesn't replace developers—it amplifies their leverage.

With this workflow, I can now:

  1. Build faster: New features in minutes, not hours
  2. Maintain quality: Automated best practices enforcement
  3. Document automatically: Every action creates documentation
  4. Scale processes: Repeatable workflows for any project
  5. Focus on strategy: AI handles tactical execution

Immediate Next Steps

I'm already using this approach for:

  • Blog post automation (convert LinkedIn posts to markdown)
  • Feature development (new sections, components)
  • Bug fixes (BDW-34 theme toggle fix)
  • Content updates (real professional information)

Broader Implications

This has implications beyond personal websites:

For Individual Developers:

  • Ship side projects 10x faster
  • Build portfolio pieces in hours
  • Experiment with new ideas cheaply
  • Learn by doing, not just reading

For Teams:

  • Standardize development workflows
  • Automate repetitive tasks
  • Enforce best practices automatically
  • Reduce onboarding time

For Organizations:

  • Accelerate digital transformation
  • Scale engineering output
  • Improve code quality consistency
  • Enable non-technical stakeholders

The Code: Open Source

The entire codebase is available at github.com/bradelev/brauliodeleon.

Notable aspects:

  • All commits show the AI-powered workflow
  • .claude/skills/ contains the AI skills framework
  • Jira issues document the complete project history
  • Code quality reflects automated best practices

Conclusion: The Real Innovation

The real innovation isn't the technology—it's the paradigm shift.

We've moved from:

  • Code generation → Workflow automation
  • AI suggestions → Autonomous execution
  • Static documentation → Living best practices
  • Manual integration → Orchestrated ecosystems

My initial prompt was about improving a website and building a personal brand.

What I got was a glimpse into the future of software development: a world where developers orchestrate AI systems that handle the tactical execution, freeing us to focus on strategy, creativity, and impact.

The website took 3 hours to build.

The workflow I discovered will save me hundreds of hours over the coming years.

That's the real value of AI-powered automation.

Appendix: The Numbers

Project Stats:

  • Initial prompt: 21 words
  • Jira issues created: 19 (1 Epic + 18 tasks)
  • Components built: 8 (Header, Footer, Hero, About, Skills, FeaturedPosts, Contact, ThemeToggle)
  • Blog posts migrated: 2 (CES 2025, Teamwork)
  • Lines of code: ~2,500
  • Git commits: 24
  • Time to first deployment: ~1 hour
  • Total development time: ~3 hours
  • Lighthouse score: 100/100/100/100
  • TypeScript strict mode: ✅
  • ESLint warnings: 0
  • Build errors: 0

Automation Stats:

  • Jira API calls: ~50 (create + transition issues)
  • GitHub commits: 24 (all automated)
  • Vercel deployments: 6 (all automatic)
  • Manual code written by me: 0 lines
  • AI skills referenced: 5 (Next.js, React, Tailwind, TypeScript, GitHub)

Time Breakdown:

  • Project planning: 0 minutes (automated)
  • Component development: ~120 minutes (automated)
  • Content migration: ~30 minutes (automated)
  • Bug fixes: ~20 minutes (automated)
  • Deployment setup: ~10 minutes (automated)
  • Manual review/testing: ~20 minutes (only manual work)

This article itself was created through an AI-powered workflow. Meta, right?

🤖 Built with Claude Code