Development
npx shadcn@latest eject -c packages/ui
My development setup is focused on modern web development, especially Next.js, React, and TypeScript.
Frameworks
My primary frameworks and libraries are:
- Next.js
- React
- TypeScript
- Tailwind CSS
- shadcn/ui
I prefer strongly typed code, reusable components, and simple abstractions.
Backend & Database
For backend development and data management, I commonly use:
- Node.js
- Prisma
- PostgreSQL
- Supabase
I prefer keeping database access strongly typed and separating database logic from the UI layer.
Tooling
My main development tools include:
- pnpm
- Turborepo
- ESLint
- Prettier
- Git
I prefer automating repetitive tasks through project scripts.
Editor
I use Visual Studio Code as my primary code editor.
Languages
My editor is mainly configured for:
- TypeScript
- JavaScript
- TSX
- MDX
- JSON
- CSS
Extensions
I prefer useful extensions that improve development without making the editor unnecessarily heavy.
Some important categories are:
- TypeScript
- Tailwind CSS
- ESLint
- Git
- MDX
- Formatting
Preferences
My editor setup is focused on:
- Fast navigation
- Clean formatting
- Auto imports
- Type checking
- Git integration
- Integrated terminal
- Minimal distractions
Terminal
My primary terminal environment is PowerShell on Windows.
Shell
I use PowerShell for most of my local development tasks.
I prefer keeping common commands short and predictable.
Package Manager
I use pnpm for managing JavaScript and TypeScript dependencies.
{
"packageManager": "pnpm@12.5.1"
}
Common Commands
Some commands I frequently use:
pnpm install
pnpm dev
pnpm build
pnpm lint
pnpm typecheck
Monorepo
For larger projects, I use Turborepo to manage applications and shared packages.
Git
Git is part of my everyday development workflow.
Commit Style
I prefer small and meaningful commits instead of combining unrelated changes into a single commit.
git status
git add .
git commit -m "description of change"
git push
Branches
For larger features, I prefer using separate branches so changes can be developed and tested independently before being merged.
Code Style
I prefer code that is:
- Type-safe
- Reusable
- Simple
- Consistent
- Easy to understand
- Easy to maintain
Reusability
When I find repeated logic, I usually extract it into:
- Components
- Hooks
- Utilities
- Shared packages
Instead of duplicating the same logic across multiple files.
TypeScript
I prefer using TypeScript wherever possible.
Types should describe the actual data structures used by the application and help catch mistakes before runtime.
UI & Design
I prefer minimal, clean, and functional interfaces.
UI Stack
My usual UI stack includes:
- Tailwind CSS
- shadcn/ui
- Hugeicons
- Framer Motion
- GSAP
Design Principles
I prefer:
- Clean layouts
- Good spacing
- Clear typography
- Consistent components
- Responsive interfaces
- Subtle animations
I generally avoid excessive visual effects when they don't improve the user experience.
Animation
For animations, I mainly use Framer Motion.
For more complex or timeline-based animations, I use GSAP.
Project Structure
I prefer keeping projects organized by responsibility.
Basic Structure
A typical project looks similar to:
app/
components/
hooks/
lib/
types/
public/
docs/
scripts/
Shared Code
For larger projects, I prefer separating reusable functionality into shared packages.
This makes it easier to reuse:
- UI components
- Types
- Utilities
- Configuration
- Database logic
MDX
I use MDX for my blog posts, documentation, and personal notes.
Frontmatter
A typical MDX file starts with frontmatter:
---
title: "My Settings"
date: "2026-10-01"
description: "A collection of my development preferences."
---
Validation
I validate my MDX frontmatter before building the project.
This helps catch:
- Missing fields
- Invalid dates
- Incorrect types
- Invalid frontmatter
- Formatting mistakes
Development Workflow
My usual workflow is:
1. Plan
Understand the feature and decide how it should fit into the existing project.
2. Build
Create the required components, types, hooks, and utilities.
3. Test
Run the project locally and verify the functionality.
4. Validate
Run:
npx shadcn@latest eject -c packages/ui
5. Commit
Commit the completed changes with a meaningful commit message.
6. Push
Push the changes to the remote repository.
I prefer fixing TypeScript, lint, and build errors before considering a feature complete.
Current Focus
I'm currently focusing on improving my skills in:
Development
- Full-stack Next.js
- TypeScript
- Database architecture
- SaaS architecture
- Developer tooling
Design
- UI/UX design
- Design systems
- Responsive interfaces
- Animation
- Component architecture
Performance
- Next.js performance
- Server-side rendering
- Database optimization
- Image optimization
- Client-side performance
Architecture
- Reusable component systems
- Monorepos
- Shared packages
- Clean project structures
- Scalable application architecture