Discover how others build real-world Next.js applications by examining their codebase.
Learning from others’ codebases can help you grow as a developer, gain inspiration for organizing your codebase, develop a specific feature, manage CI/CD, and much more. You can learn best practices and some practices to avoid in real-world scenarios. You can find new technologies that might better solve certain cases.
In this article, you will find a selection of open-source projects built using Next.js and App Router.
Unkey is an open-source API management platform for scaling APIs. Unkey provides API key management and standalone rate limiting.
The repository is a monorepo managed via Turborepo. It contains several apps:
Stack: Turborepo, Tailwind, tRPC, Planetscale, Drizzle ORM, Clerk, React Hook Form, Zod, Resend, Stripe, Mintlify
An open-source Calendly alternative. A scheduling solution that gives you full control of your events and data.
They are still in the process of migrating to App Router, which is a good example of how a large-scale app can be migrated to App Router incrementally.
The repository is a monorepo managed via Turborepo. The main app is located in apps/web. There, you can find that it has both app and pages folder. And many routes from pages are available in app/future folder.
Stack: Turborepo, Tailwind, tRPC, Prisma, Kysely Auth.js, React Hook Form, Zod, Zustand, Tanstack Query, Stripe
An open-source DocuSign alternative. A service for signing documents digitally.
The repository is a monorepo managed via Turborepo. It contains several Next.js apps:
Stack: Turborepo, Tailwind, tRPC, Prisma, Kysely Auth.js, React Hook Form, Zod, Resend, Stripe
TypeHero is a platform for enhancing your TypeScript skills via interactive code challenges.
The repository is a monorepo managed via Turborepo. It contains several Next.js apps:
Stack: Turborepo, Tailwind, Prisma, Auth.js, React Hook Form, Zod, Zustand, Tanstack Query, Resend
Dify is an open-source LLM app development platform. Dify’s interface combines AI workflow, RAG pipeline, agent capabilities, model management, observability features and more.
Stack: Tailwind, React Hook Form, Zod, Zustand, SWR
Dub.co is an open-source URL-shortening service and link management platform. An open-source alternative to Bitly.
The repository is a monorepo managed via Turborepo. The main app is located in apps/web.
Stack: Turborepo, Tailwind, Planetscale, Prisma, Auth.js, Zod, SWR, Upstash, Tinybird, Stripe, Mintlify
Noodle is a platform for managing everything related to students’ education, including note-taking, calendar, task management, grade calculator, flashcards, and more.
It’s an indie project and has still not been released yet. But it’s a good example of an app built using modern technologies.
Stack: Bun, Tailwind, tRPC, Drizzle ORM, Clerk React Hook Form, Zod, Tanstack Query, Resend
An all-in-one tool for freelancers, contractors, consultants, and solo entrepreneurs to manage their finances, track projects, store files, and send invoices.
The repository is a monorepo managed via Turborepo. It contains several apps:
Stack: Bun, Turborepo, Tailwind, Supabase, Upstash, React Hook Form, Zod, Zustand, Resend, Mintlify
An AI-powered search engine with a generative UI.
Stack: Bun, Tailwind, Vercel AI SDK, OpenAI, Tavily AI, Serper, Jina AI, Upstash
Supabase is an open-source Firebase alternative.
Supabase doesn’t use fully App Router, but their new apps use it. The repository is a monorepo managed via Turborepo. It contains several Next.js apps:
Stack: Turborepo, Tailwind, OpenAI, React Hook Form, Zod, Tanstack Query, Stripe
OpenStatus is an open-source synthetic and frontend performance monitoring service.
The repository is a monorepo managed via Turborepo. It contains several apps:
Stack: Turborepo, Tailwind, tRPC, Upstash, Tinybird, Turso, Drizzle ORM, Auth.js, React Hook Form, Zod, Stripe, Resend, Mintlify
An open-source e-commerce skateshop built with modern approaches and technologies.
It’s not a real-world application but a good example of how to develop a modern Next.js application.
Stack: Tailwind, Clerk, Upstash, OpenAI, Drizzle ORM, React Hook Form, Zod, Stripe, Resend
An open-source solution for collecting feedback and communicating updates.
The repository is a monorepo managed via Turborepo. It contains several apps:
Stack: Turborepo, Tailwind, Supabase, Tinybird, React Hook Form, Zod, SWR, Resend, Mintlify
An open Source JIRA, Linear and Asana alternative. Plane helps you track your issues, epics, and product roadmaps.
The repository is a monorepo managed via Turborepo. It contains several Next.js apps:
Stack: Turborepo, Tailwind, React Hook Form, SWR, MobX
egghead — a learning platform for front-end developers.
They are still in the process of migrating to App Router, which is a good example of how a large-scale app can be migrated to App Router incrementally.
Stack: Tailwind, tRPC, Prisma, Sanity, Formik, Zod, SWR, Tanstack Query, Upstash, Stripe
In this article, we explored several open-source projects built with Next.js 14 and App Router. These open-source projects serve as excellent learning resources, offering practical examples of how to leverage Next.js 14 and App Router to build robust, scalable applications. Whether you are looking to enhance your skills, find inspiration, or discover new tools, delving into these codebases will undoubtedly contribute to your growth as a developer.
Want to find more real-world projects? You can find more projects built with different technologies in my collection on GitHub.
Check out our newsletter
© 2024 Red Panda Technology (dba datarockets). All Rights Reserved.
