Full-stack#typescript#react#nextui#supabasemp
TypeScript React Nextui Supabasemp
Cursor rules for TypeScript development with React, NextUI, and Supabase integration.
Use it with Cursor, or export as AGENTS.md / CLAUDE.md for other AI coding agents — pick a format below.
# Codebase Overview
This codebase appears to be part of a web application built using TypeScript, React, and various NextUI components. It is structured to support a landing page, authentication flows, and a dashboard for logged-in users. The application integrates with Supabase for backend services, including authentication and database interactions.
# Stack and Key Technologies
Frontend Framework: React
TypeScript: Used for type-safe code across the frontend.
NextUI: A React UI library used for building the UI components like buttons, modals, inputs, etc.
Supabase: An open-source Firebase alternative used for backend services like authentication, database, and storage.
Next.js: Likely used as the React framework, indicated by the usage of next/navigation and server utilities.
Iconify: For icons across the application.
Purpose and Functionality
## Authentication
The application includes a comprehensive authentication flow:
Login: Users can log in using email/password or GitHub OAuth. The login logic is handled in frontend/app/(landing-page)/login/action.ts.
Signup: New users can sign up with an email and password. The signup logic is also in frontend/app/(landing-page)/login/action.ts.
Logout: Users can log out, with the logic located in frontend/app/(landing-page)/logout/action.ts.
Email Confirmation: The application handles email confirmation through a callback route in frontend/app/auth/callback/confirm/route.ts.
## User Interface
Landing Page: Contains components like SubmitButton, LoginPage, and LogoutModal to facilitate user interactions.
Dashboard: For logged-in users, showing personalized content and a sidebar for navigation within the dashboard.
Error Handling: A generic error component is used to display errors and provide a retry mechanism.
## Navigation and Layout
Navbar: A responsive navbar for the landing page and possibly other public pages.
Sidebar: A collapsible sidebar for the dashboard, indicating a more complex, multi-page application structure for authenticated users.How to use: save the file at your project root (e.g.
.cursorrules or AGENTS.md) and your AI editor picks it up automatically.Related rules
Full-stack→
Next.js Supabase Todo App
Cursor rules for Next.js development with Supabase integration for a Todo app.
#nextjs#supabase#todo#app
Full-stack→
Next.js Tailwind TypeScript Appsmpt
Cursor rules for Next.js development with Tailwind CSS and TypeScript integration.
#nextjs#tailwind#typescript#appsmpt
Full-stack→
Next.js Vercel Supabase
Cursor rules for Next.js development with Vercel and Supabase integration.
#nextjs#vercel#supabase