first bl

Welcome to my first blog post! In this article, I'll walk through how I built my portfolio site using Next.js and Sanity.

Setting Up the Project

I used pnpm to initialize the project. The key command was pnpm create next-app, which scaffolds a Next.js app with TypeScript support out of the box.

import { defineConfig } from 'sanity'
import { structureTool } from 'sanity/structure'

export default defineConfig({
  name: 'default',
  title: 'My Portfolio',
  projectId: 'abc123',
  dataset: 'production',
  plugins: [structureTool()],
  schema: {
    types: [],
  },
})

Styling with Tailwind CSS

Tailwind v4 changed everything. No more config files — just define your theme directly in CSS using the @theme directive.

@theme {
  --color-bg: #0a0a0a;
  --color-text: #e8e4de;
  --color-accent: #c9a87c;
  --font-heading: 'Marcellus', serif;
}

Good design is as little design as possible.

That's it for now. In the next post, I'll cover how I set up GSAP animations with scroll triggers. Stay tuned!