DEV Community: Benjamin Nwokoye

Production Grade Webapp Using 100% AI Prompts — Here's What I Learned

Benjamin Nwokoye — Fri, 06 Mar 2026 04:02:03 +0000

TL;DR: Designed, developed and deployed a fully functional portfolio webapp without writing a single line of code (100% AI coded). But here's the twist - it's not just another AI project.

It scales seamlessly, follows SWE fundamentals (SOLID principles), security best practices, has 150+ test cases, an automated CI/CD pipeline, and runs on AWS - Let me show you how.

The Challenge

As a TPM working with AWS and Azure daily, I wanted a portfolio that reflected my engineering standards. Not a template, not a drag-and-drop builder, but a well-architected, production-grade application that is highly available, cost optimized, reliable and scalable.

The constraint? Build it entirely through AI prompts using Claude.

The Stack

Frontend: Next.js 14, TypeScript, Tailwind CSS, Framer Motion
Testing: Vitest + React Testing Library (150+ tests)
CI/CD: GitHub Actions → AWS Amplify
Infrastructure: AWS Amplify (Hosting), API Gateway, Lambda, SNS
AI Tools: Claude (development), Gemini (image generation)

Phase 1: Documentation First

Before any code, I created:

Document	Purpose
PRD	Product requirements and user stories
TRD	Technical requirements and constraints
ARCHITECTURE.md	System design and component hierarchy
CI-CD.md	Pipeline architecture
ADRs	Architecture Decision Records

Why this matters: AI assistants perform significantly better with context. These documents became the "memory" that kept Claude aligned across dozens of sessions.

Prompt pattern that worked:
"Read CLAUDE.md and docs/PLAN.md. We're starting Phase 3..."

Phase 2: SOLID Principles in Practice

Every component was built with intention:

Single Responsibility

// Each component does ONE thing
<Hero />           // Landing section only
<ProjectCard />    // Single project display
<EmailCapture />   // Form handling only

Open/Closed

// Extend via props, don't modify
interface SectionProps {
  className?: string;  // Extensible
  children?: ReactNode; // Composable
}

Interface Segregation

// Small, focused interfaces
interface Project {
  title: string;
  description: string;
  tech: string[];
  image?: string;  // Optional fields
  link?: string;
}

The result? Components that are testable, maintainable, and reusable.

Phase 3: Testing Strategy

I maintained a strict testing discipline throughout:

npm run test
# ✓ 150+ tests passing
# ✓ 17 test files
# ✓ Components, hooks, utilities covered

Key insight: When AI generates code, tests become your safety net. Every prompt included:

"..update related tests, verify: npm run lint, npm run test, npm run build."

This caught regressions immediately, especially when refactoring UI components.

Phase 4: CI/CD Pipeline

The deployment architecture:

┌─────────────┐     ┌─────────────────┐     ┌─────────────┐
│ Push to     │────▶│ GitHub Actions  │────▶│ AWS Amplify │
│ main branch │     │(lint/test/build)│     │ (deploy)    │
└─────────────┘     └─────────────────┘     └─────────────┘

GitHub Actions handles:

ESLint validation
150+ test execution
Next.js static build
Push to deploy branch

AWS Amplify handles:

Automatic deployment on branch update
CDN distribution
SSL certificate management
Custom domain configuration

The entire pipeline runs in under 3 minutes.

Phase 5: AWS Architecture

Contact Form Backend

┌──────────┐     ┌─────────────┐     ┌────────┐     ┌─────┐
│ Contact  │────▶│ API Gateway │────▶│ Lambda │────▶│ SNS │
│ Form     │     │             │     │        │     │     │
└──────────┘     └─────────────┘     └────────┘     └─────┘

API Gateway: RESTful endpoint with CORS configured
Lambda: Node.js function for form processing
SNS: Email notification delivery

Hosting

Amplify: Static web hosting with built-in CI/CD
Route53: DNS management
ACM: SSL certificate (auto-managed by Amplify)
IAM: Principle of least privilege
Cloudwatch: Telemetrics (logging and alerting)

Total AWS cost: ~$2/month (mostly Route53 hosted zone)

Security Considerations

Even with AI-generated code, security wasn't negotiable:

No secrets in code: Environment variables in Amplify
HTTPS everywhere: Amplify-managed SSL
Input validation: Client and server-side
CORS configured: API Gateway restrictions
No sensitive data exposure: Form data handled server-side
Dependencies audited: npm audit in CI pipeline

Lessons Learned

What Worked

Documentation-first approach — AI performs better with context
Incremental prompts — Small, focused changes vs. massive rewrites
Test requirements in every prompt — Catches regressions immediately
Reference examples — "Make it look like {example.com}" > vague descriptions

What Didn't

Vague design requests - "Make it look professional" yields generic results
Skipping verification — Always run lint/test/build before committing
Trusting without reviewing — AI makes mistakes; review the diff

The Prompt Pattern That Worked

Read [context files].

[Specific task description]

Requirements:
1. [Explicit requirement]
2. [Explicit requirement]
3. [Explicit requirement]

Verify: npm run lint, npm run test, npm run build

Update docs: CHANGELOG.md, FEATURES.md

This pattern maintained consistency across 50+ development sessions.

Results

Metric	Value
Development time	~2 weeks (evenings/weekends)
Lines of code	5,000+
Test coverage	150+ tests
Lighthouse score	90+ (Performance, SEO, Accessibility)
Monthly AWS cost	~$2
Manual code written	0 lines

Try It Yourself

The site is live at bennwokoye.com

Key takeaways for your own AI-assisted projects:

Invest in documentation — It's context for your AI
Enforce engineering standards — AI will follow them if you're explicit
Test everything — Your safety net for AI-generated code
Iterate visually — Screenshots help AI understand design issues
Own the architecture — AI assists; you architect

Check out my other posts on dev.to/benzinoh.

aws #webdev #devops #ai #cloudcomputing #cicd #typescript #nextjs

Host Your Web App For Free Using AWS Serverless Architecture + CB Credits

Benjamin Nwokoye — Mon, 31 Mar 2025 03:17:03 +0000

My website www.bennwokoye.com runs on AWS serverless architecture at almost zero cost. Continue for insights and pros of deploying it entirely using AWS serverless resources. You can leverage this architecture to host your web applications, as AWS CB credits can be applied towards resource costs.

Architecture Diagram

Overview of the Architecture

The core components of my architecture leveraging AWS serverless solutions:

Static content hosting: Amazon S3
Domain and DNS management: Route 53
Content Delivery Network (CDN): CloudFront
Backend processing: API Gateway, Lambda, SNS, DynamoDB
Security and SSL: AWS WAF, AWS Certificate Manager (ACM)
CI/CD automation: GitHub + GitHub Actions
Infrastructure as Code: Terraform

Static Content Hosting with Amazon S3
I choose AWS S3 to host HTML, CSS, and JavaScript files. S3 provides an easy, cost-effective, and scalable solution for static web hosting. Amazon S3's high availability ensures reliable content accessibility from anywhere globally.

Domain Management and DNS with Route 53
AWS Route 53 handles domain registration and translates my domain name into IP addresses, making DNS management straightforward and reliable. It also offers health checks and failover support to maintain high availability.

CDN and Caching with AWS CloudFront
AWS CloudFront caches my content at edge locations globally, significantly reducing load times and latency for global users. It integrates seamlessly with S3 as the origin and automatically invalidates caches whenever new content is deployed through my CICD pipeline, ensuring visitors always see the latest version of my website.

Enhanced Security with WAF and ACM
AWS Web Application Firewall (WAF) is integrated with CloudFront to protect my site against common web exploits and attacks. AWS Certificate Manager (ACM) provides free, automated SSL certificates, ensuring encrypted and secure connections to my site.

Serverless Backend: API Gateway, AWS Lambda, SNS & DynamoDB
I leveraged API Gateway to expose a secure REST API to handle dynamic interactions with my contact form submissions, triggering an AWS Lambda function to process requests. This eliminates server management overhead and allows automatic scaling based on traffic.

Notifications with Amazon SNS
I integrated Amazon SNS with the Lambda function to send notifications whenever a user submits a form. SNS sends email notifications instantly, informing me promptly of user interactions without manual checks.

Data Storage with DynamoDB
I also store messages submitted via the contact form in Amazon DynamoDB, a highly performant, serverless NoSQL database. DynamoDB ensures scalable, secure, and reliable storage for user-generated data.

Automated CI/CD with GitHub + GitHub Actions
The entire deployment process is automated using GitHub + GitHub actions. A commit to the main branch of my GitHub repository triggers an automatic deployment, ensuring fast, consistent updates. The pipeline automatically fetches, builds, deploys, and invalidates CloudFront cache, streamlining updates effortlessly.

Infrastructure Management via Terraform
All resources are managed through Terraform, enabling version control, modularity, and reusability.

Why Serverless?

This architecture offers significant advantages:

Cost Efficiency: No infrastructure management overhead, pay only for resources used.
High Availability: 99.99% uptime with auto-scaling.
Security: Integrated AWS security, DDoS protection, and request throttling.
Performance: Minimized latency with a global CDN.
Automation: Streamlined updates via automated CI/CD pipelines.

Adopting AWS serverless services accelerated the time and effort to build a cost-effective, scalable, secure web app following well-architected framework and industry best practices. This approach simplifies operations and provides a solid foundation for autoscaling and integration with other AWS serverless offerings.
Follow me on LinkedIn to explore opportunities for collaboration and innovation. Let's build something great together, for now and the future.

From Coal & Crude to Data & AI

Benjamin Nwokoye — Tue, 25 Mar 2025 04:37:26 +0000

From 1760 to 1840, the Industrial Revolution marked one of history's most significant transformations. Europe experienced groundbreaking innovations such as James Watt's steam engine in 1769, while West Africa saw the rise of the Sokoto Caliphate in 1804, becoming a prominent empire in present-day Nigeria. The global landscape further shifted with the discovery of oil at Pennsylvania's Drake Well in 1859, fueling advancements in transportation and industrialization.

Long before oil was discovered in Nigeria in 1956, African societies actively engaged in trade, agriculture, textile production, industrial fishing and other innovative industrial practices, contributing notably to global economic networks. With the discovery of coal and oil, industries were transformed, oil-fueled transportation and human skill and adaptability sparked innovation, empowered emerging industries, and reshaped the global economy.

Fast forward to 2025! Today, we stand at the brink of another transformative era, “the AI revolution.” Much like coal and oil-fueled industries in history, data is now the pivotal resource powering the modern digital economy. Alongside data, interconnected devices (IoT) and human ingenuity remain critical. However, data increasingly drives competitive advantage, innovation, and strategic decision-making.

I map data to oil because, much like crude oil, its true value emerges only after careful refinement. Raw data, accumulated from billions of daily interactions across multiple digital platforms, IoT devices, and transactional systems, has limited intrinsic value. However, data becomes immensely valuable when strategically processed, analyzed, and leveraged through tailored cloud services and AI.

Cloud technologies like AWS SageMaker enable effective data utilization to predict customer behaviour, optimize supply chains, detect fraud, and personalize user experiences. Harnessing data's full potential goes beyond mere storage in AWS services like S3, DynamoDB, or RDS. It requires advanced analytics capabilities through data lakes, data warehouses, serverless architectures, and integrated AI systems like AWS Bedrock to transform raw data into actionable intelligence.

Even as technology advances, human potential remains indispensable. Data, IoT devices, computer chips, robots, and AI alone cannot generate innovation or creativity. Skilled individuals who responsibly collect, secure, and interpret data and understand how to leverage cloud technology to build and effectively train AI models, avoiding common pitfalls like underfitting, overfitting, or bias, are and will remain indispensable.

Adopting a growth mindset, investing in continuous education, earning certifications like the AWS AI Practitioner, and joining community initiatives like AWS Community Builders help foster collaboration, knowledge-sharing, and collective growth within our new data-driven economy.

Just as coal and oil once defined the pace and possibilities of the industrial age, data, cloud computing, and AI now define our digital era. Individuals who harness this "new oil" effectively will shape markets, transform industries, and lead the next wave of innovation. It’s 2025! Let's build something great together for now and for the future.

References
Falola, T., & Heaton, M. M. (2008). A History of Nigeria. Cambridge University Press.
Last, M. (1967). The Sokoto Caliphate. Longman Publishing Group.
Yergin, D. (1991). The Prize: The Epic Quest for Oil, Money & Power. Simon & Schuster.