Flask vs
Next.js

from flask import Flask
app = Flask(__name__)

@app.route('/')
def home():
    return "Hello World"

app.run()

Run: python app.py

# Terminal commands
npx create-next-app myapp
cd myapp
npm install  # Wait 5 minutes...

# app/page.tsx
export default function Home() {
  return <div>Hello World</div>
}

# Run
npm run dev  # Wait 30s for build...

Setup: 5-10 minutes, 300MB installed

@app.route('/contact', methods=['POST'])
def contact():
    name = request.form.get('name', '').strip()
    email = request.form.get('email', '').strip()
    message = request.form.get('message', '').strip()

    # Validate
    if not name or not email or not message:
        flash('All fields are required', 'error')
        return redirect('/contact')
    if '@' not in email or '.' not in email:
        flash('Valid email required', 'error')
        return redirect('/contact')

    # Save to database (parameterised — no SQL injection)
    cur.execute("""
        INSERT INTO contacts (name, email, message)
        VALUES (%s, %s, %s)
    """, (name, email, message))
    conn.commit()
    return redirect('/thank-you')

Works without JavaScript. No build step. Error feedback via flash.

// app/api/contact/route.ts
import { prisma } from '@/lib/prisma'
import { z } from 'zod'

const schema = z.object({
  name: z.string().min(1),
  email: z.string().email(),
  message: z.string().min(1)
})

export async function POST(req: Request) {
  const body = await req.json()
  const result = schema.safeParse(body)
  if (!result.success) {
    return Response.json({ error: 'Invalid' }, { status: 400 })
  }
  await prisma.contact.create({ data: result.data })
  return Response.json({ ok: true })
}

// components/ContactForm.tsx  ← required separate file
'use client'
import { useState } from 'react'

export function ContactForm() {
  const [loading, setLoading] = useState(false)
  const [error, setError] = useState<string | null>(null)

  async function handleSubmit(e: React.FormEvent) {
    e.preventDefault()
    setLoading(true); setError(null)
    const form = new FormData(e.currentTarget as HTMLFormElement)
    const res = await fetch('/api/contact', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(Object.fromEntries(form))
    })
    if (!res.ok) setError('Something went wrong')
    setLoading(false)
  }

  return (
    <form onSubmit={handleSubmit}>
      {error && <p className="text-red-500">{error}</p>}
      <input name="name" required />
      <input name="email" type="email" required />
      <textarea name="message" required />
      <button disabled={loading}>
        {loading ? 'Sending...' : 'Send'}
      </button>
    </form>
  )
}

Requires JavaScript. Two files minimum. Plus Prisma schema + TypeScript interfaces.

# app.py
@app.route('/users')
def users():
    cur.execute("""
        SELECT id, name, email FROM users ORDER BY name
    """)
    users = cur.fetchall()
    return render_template('users.html', users=users)

# templates/users.html

Complete solution. The SQL you see is the SQL that runs.

// app/users/page.tsx
import { prisma } from '@/lib/prisma'

// Must stay in sync with DB schema by hand
interface User { id: number; name: string; email: string }

export default async function UsersPage() {
  const users: User[] = await prisma.user.findMany({
    select: { id: true, name: true, email: true },
    orderBy: { name: 'asc' }
  })
  return (
    <div>
      {users.map(user => (
        <div key={user.id}>
          <strong>{user.name}</strong> — {user.email}
        </div>
      ))}
    </div>
  )
}
// Not shown: prisma/schema.prisma + migration file

Prisma schema + migration not shown. TypeScript interface must be kept in sync manually.