Dzaki Amri Zaidaan
Community@dzakiamriz22 · Semarang
Agent Skills by Dzaki Amri Zaidaan
Showing 38 vetted skills indexed across 1 GitHub repositories.
responsive
Implement mobile-first responsive layouts with CSS Grid, Flexbox, and Tailwind breakpoints.
micro-interactions
Integrate Framer Motion patterns for button, form, and notification animations.
design
Generate accessible, responsive user interfaces with Next.js and TailwindCSS.
tables
Build interactive data tables with TanStack Table and shadcn/ui.
app-router
Architect Next.js App Router file structures with layouts, loading, and error boundaries.
forms
Create accessible validated web forms with React Hook Form, Zod, and shadcn/ui.
bundle-size
Optimize JavaScript bundle size via code splitting, tree shaking, and dependency auditing.
component-splitting
Decompose monolithic React components into focused modules with extracted hooks.
tailwind-layout
Generate responsive TailwindCSS layouts using Flexbox and Grid utilities.
shadcn
Standardize shadcn/ui component implementation with TailwindCSS and CSS variables.
frontend-review
Analyze React, TypeScript, and Next.js code for best practices and issues.
component-architecture
Standardize React component design through composition patterns and responsibility boundaries.
color-system
Define semantic color tokens in OKLCH with WCAG 2.1 AA contrast.
charts
Generate accessible responsive charts with shadcn/ui and recharts components.
refactor-ui
Refactor React and TailwindCSS UI components for accessibility and consistency.
ai-slop-detector
Detect and rewrite generic AI-generated UI patterns in frontend code.
server-actions
Implement type-safe Next.js Server Actions with Zod validation and cache revalidation.
lazy-loading
Implement lazy loading for images, components, and routes.
tailwind-animation
Standardize UI animations with TailwindCSS utility classes for web interactions.
tailwind
Generate TailwindCSS utility classes for responsive web interfaces.
page-transitions
Implement Framer Motion route transitions and shared element animations in Next.js App Router.
cleanup
Remove unused imports, variables, and dependencies from TypeScript and JavaScript frontend projects.
command-palette
Implement keyboard-accessible command palettes with the shadcn/ui Command component.
state-management
Standardize React state management across server, client, URL, and form states.