ProjectsProjects
Every project showcased here is the result of thoughtful design, clean development, and a deep passion for technology.
Floral - AI Image Node Editor
Floral : An AI Image Node Editor that allows users to create and manipulate images using AI-powered nodes. Built with Vite , Gemini Nano Banana, and TypeScript.
Roomieo - Live video sync app
Roomieo : A live video sync app that allows users to watch videos together in real-time and real-time chat , enhancing the shared viewing experience. Built with Nextjs , Supabase, and TypeScript.
MoviesMod - Movie Review App
MoviesMod: Transforming Education with Automated Exam Paper and Quiz Management. Klassiko is an innovative platform designed to revolutionize the process of exam and quiz management in educational institutions.
Fintraz – Finance management app
I developed a Next.js, TypeScript, MongoDB finance tracking system with Clerk authentication, enabling users to log in, categorize transactions, and visualize financial data through an interactive dashboard.
Klassiko - Exam Paper and Quiz Generator
Klassiko: Transforming Education with Automated Exam Paper and Quiz Management. Klassiko is an innovative platform designed to revolutionize the process of exam and quiz management in educational institutions.
Techmier
I redesigned and rebuilt Techmier's website for a more interactive and engaging experience, optimizing performance with Next.js, NextUI, and JavaScript, and adding PWA support for a fast, seamless user experience.
G3 Consult
Built a tech-focused course platform with dynamic course pages, providing a seamless learning experience.
DotoZ
Created a task management app designed for productivity, allowing users to organize tasks, set priorities, and stay efficient. Developed with React + Vite and available as a downloadable web app.
SelfUpGrad
Redesigned multiple pages using HTML, CSS, and JavaScript within a Graphy CMS-hosted platform to improve usability and engagement.
Featured PostsFeatured Posts
A selection of blog posts that I've written.
How to Sync Next.js Theme with Clerk Components in Just 2 Lines of Code
If you’re using Next.js and Clerk, though, it’s a breeze! In just two lines of code, you can sync Clerk’s theme with Next.js and keep everything looking on point.
Why I Fell in Love with Gorhom Bottom Sheet in React Native (Expo)
Gorhom Bottom Sheet is one of the smoothest, most flexible UI components in React Native. In this post, I’ll share why I loved using it in my Expo app, how to get started, and where it truly shines.
Building Type-Safe API Routes in Next.js with Zod & TypeScript
API contracts are critical for scalability. Learn how Zod validation + TypeScript ensures your API is bulletproof and catches errors before production.
Mastering Server Components: When to Use Server vs Client in Next.js 14+
Confused about 'use client'? Learn the mental model for splitting your app into server and client components for maximum performance.
React Native Gestures: Building Smooth Interactions with Gesture Handler
Upgrade your mobile UI from static to fluid. A guide to implementing pinch, swipe, and pan gestures with Reanimated.
From Web to Mobile: Sharing Logic Between Next.js and React Native
Don't write the same code twice. Strategies for sharing hooks, types, and utility functions between your web and mobile apps.
MongoDB Schema Design: Building Scalable Data Models for SaaS 🗄️
NoSQL doesn't mean no structure. Best practices for modeling relationships in MongoDB to avoid performance bottlenecks.
Securing Your API: JWT, Rate Limiting & Best Practices in Next.js 🔒
Don't leave your API endpoints exposed. Implementation guide for secure authentication checks and preventing abuse.
Beyond Basic Auth: Building Multi-Role Systems with Clerk & Next.js 👥
Admin, User, or Guest? How to implement robust Role-Based Access Control (RBAC) using Clerk's custom claims.
Why Your Next.js App is Slow: Bundle Analysis & Real Fixes 🚀
Is your First Contentful Paint suffering? I analyzed my bundle and shaved off 60% of JS payload. Here's how.
Building a Scalable Design System with ShadCN, TypeScript & Tailwind
Stop copying generic components. Learn how to extend ShadCN to build a unique, maintainable design system for your brand.
zahid ansari
Building scalable systems by applying mental models to code and architecture.
Website
Install this app to stay connected and in the loop.
Building meaningful experiences one pixel at a time 😉.
Made with by Zahid
views