Current Stack

Hosting (Mostly Serverless)

Depending on project timelines and requirements, I use Vercel, AWS Amplify or Cloudflare for hosting. Occasionally I'll reach for an IBM virtual machine due to their generous free tier.

Framework (Next.js/React)

Next.js and React are my foundation, with TypeScript providing essential type safety and, at times, a bit of annoyance. When working with data, I have hopped on the Server Components train but still reach for context or client libraries, depending on the use case.

Styling

While many developers are moving toward utility-first frameworks like Tailwind CSS, I prefer using a combination of vanilla CSS, SCSS and Bootstrap, depending on the situation.

SCSS (Sassy CSS)

  • SCSS allows me to break styles into smaller, reusable modules.
  • Nested selectors: Simplifies targeting specific elements in deeply nested structures.
  • Variables and mixins: Enables easy theming and consistent reuse of styles
  • Dynamic imports: Helpful in component-based workflows like Next.js.

Vanilla CSS

  • Complete control over every styling detail and animation.
  • No framework overhead or constraints limiting creative designs.
  • Easier debugging without abstraction layers.
  • Better performance with only the necessary styles.

Bootstrap

  • Fast prototyping/responsive layouts built-in.
  • Predefined UI components for standard elements.
  • Cross-browser compatibility without extra effort.

While utility-first frameworks like Tailwind CSS can be a great fit in many cases, they aren't always. When the project requires custom designs with minimal common elements vanilla is the way. Additionally, overhead from having large utility classes can hurt performance and readability at times.

Database

I primarily use MongoDB, with occasional use of Postgres when the situation demands it. MongoDB works well for my typical use cases because:

  • Most of my projects use third-party services like Stripe and Auth.js that handle complex data relationships
  • I build content-focused applications where flexible document structures are beneficial
  • It integrates seamlessly with Next.js through libraries like Mongoose
Branching Out

While I'm most familiar with Postgres through Vercel's offering, when branching out I look for platforms with generous free tiers (Supabase, Neon, AWS RDS). For my projects that need Postgres's features, I typically use Vercel's integration for simplicity, but I'm looking to expand my experience with other hosting solutions as I tackle more complex projects. The choice really comes down to the project's needs rather than following trends. MongoDB and the document model fits well with JavaScript and TypeScript development, while Postgres becomes valuable when I need to maintain complex data relationships that can't be outsourced to third-party services.

Patterns and File Structure

File Naming

I’ve started to use lower-kebab-case for all files to prevent cross-platform issues and ensure consistent behavior between development and production environments. Otherwise I follow Airbnb's React style guide for consistent, maintainable code.

  • Keep related code close together to improve readability.
  • Prefer explicit implementations over premature abstractions.
  • Focus on readability and maintainability first.

AI Development Tools

I leverage multiple AI tools to enhance productivity:

  • Claude for complex problem-solving and architecture discussions.
  • ChatGPT for quick code snippets and debugging.
  • V0 for Next.js-specific optimizations/quick UI prototyping