braydoncoyer.dev

braydoncoyer.dev is a portfolio website template built on Next.js 15, Tailwind CSS, Supabase, and Framer Motion, designed for developers and designers to showcase their work and blog on Vercel.

What is braydoncoyer.dev?

braydoncoyer.dev is the personal portfolio of developer Braydon Coyer, built as a public repository so others can use it as a starting point. It pairs a Next.js 15 front end with a Supabase backend, using Cloudinary for image delivery. The project is bootstrapped with create-next-app, so it includes the standard app directory structure with app/page.tsx as the entry point, and it outputs a fast, deployable static and server-rendered site ready for Vercel.

Key Features

• Next.js 15 with App Router — Uses the latest Next.js version with the app directory, giving you file-based routing, server components, and hot reloading during development.
• Tailwind CSS styling — Utility-first CSS framework is preconfigured, allowing rapid UI development without leaving your markup.
• Framer Motion animations — Includes the Framer Motion library for smooth, declarative animations and page transitions.
• Supabase backend — Leverages Supabase as a managed Postgres database and authentication service for storing portfolio content and blog posts.
• Cloudinary image handling — Integrates Cloudinary for optimized image uploads, transformations, and delivery.
• Blog support — The repository's topics include 'blog', meaning the template ships with a blog content model powered by the Supabase data layer.
• Vercel deployment — Configured for one-click deployment on Vercel, with the standard create-next-app deploy flow.
• Inter font optimization — Uses next/font to automatically load and optimize Inter, a custom Google Font, with no layout shift.

Who is it for?

• Developers and designers — Use it as a starting point to build your own portfolio, replacing the sample content in app/page.tsx and wiring in your Supabase data.
• Tech bloggers — Publish articles through the built-in blog, with post content stored in Supabase and images served via Cloudinary.
• Freelancers — Showcase past projects and case studies in a polished, animated layout, then deploy to Vercel for a live URL.

What can you do with braydoncoyer.dev?

• Showcase projects: Display selected work with images hosted on Cloudinary and descriptive text pulled from Supabase.
• Publish blog posts: Write and manage blog articles within the Supabase-backed content model.
• Customize the design: Modify Tailwind classes and Framer Motion variants to match your personal brand.

How does braydoncoyer.dev work?

Run npm run dev to start the development server at http://localhost:3000, then edit app/page.tsx to see live updates. To build for production, use the standard Next.js build command, and deploy by connecting the repo to Vercel, which recognizes the framework automatically.

FAQ

How do I start the development server?

Run 'npm run dev' (or yarn/pnpm/bun dev) in the project root. The site will be live at http://localhost:3000 with hot reloading, so changes to app/page.tsx appear instantly.

What tech stack does this template use?

The template uses Next.js 15 with the App Router, Tailwind CSS for styling, Framer Motion for animations, Supabase for backend data and authentication, and Cloudinary for image delivery. It is designed for deployment on Vercel.

How do I deploy this to production?

The easiest path is to import the repository into Vercel, which auto-detects Next.js. Run the standard build step and push; Vercel handles server-side rendering and static generation automatically.