Scribd
Upload
4 views2 pages

Fullstack Task New Stack

The document outlines the objective to build a collaborative to-do list application using Next.js, Tailwind CSS, Supabase, TypeScript, TanStack Query, and Zustand, featuring GitHub OAuth authentication. Key requirements include real-time updates for task management, state management with Zustand, data fetching with TanStack Query, and a responsive UI. Optional features include task sharing with role-based access and real-time notifications for assigned tasks.

Uploaded by

yugigx6
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
4 views2 pages

Fullstack Task New Stack

The document outlines the objective to build a collaborative to-do list application using Next.js, Tailwind CSS, Supabase, TypeScript, TanStack Query, and Zustand, featuring GitHub OAuth authentication. Key requirements include real-time updates for task management, state management with Zustand, data fetching with TanStack Query, and a responsive UI. Optional features include task sharing with role-based access and real-time notifications for assigned tasks.

Uploaded by

yugigx6
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

Objective:

Build a collaborative to-do list application using Next.js, Tailwind CSS, Supabase, TypeScript, TanStack
Query, and Zustand. The app should include real-time updates and GitHub OAuth authentication in
addition to regular accounts (email – username – password).

Requirements:

1. Authentication with GitHub OAuth:

o Implement user authentication using Supabase and GitHub OAuth.

o Users should be able to log in and log out using their GitHub accounts.

o Store user information securely in Supabase.

2. Collaborative To-Do List:

o Create a simple to-do list where authenticated users can add, edit, and delete tasks.

o Implement real-time updates so that all connected users see changes (like adding or
deleting tasks) immediately.

o Use Supabase's real-time capabilities to achieve this.

*(Note)*: all users have access to other users’ tasks and can edit them and updates should be shown
in Realtime for all users.

3. State Management:

o Use Zustand for managing the application's global state.

o Ensure that the state is properly synchronized with Supabase and TanStack Query for
real-time updates.

4. Data Fetching & Caching:

o Use TanStack Query to fetch and cache tasks from Supabase.

o Implement optimistic updates so that the UI reflects changes immediately while


ensuring consistency with the backend.

5. UI/UX:

o Build a responsive and clean UI using Tailwind CSS.

o Provide feedback to users when actions are performed, such as adding or deleting a
task.

o Ensure that the application is accessible and follows best practices for web development.
6. Optional Bonus Feature:

Task Sharing & Collaboration:

o Implement role-based access where users can be assigned different permissions (e.g.,
view-only, editor).

o Implement a feature that allows users to assign tasks to each other.

o Add notifications with service workers and Javascript API you can find it here for users
when a task is assigned to them in real-time.

Deliverables:

 A GitHub repository with the full source code.

 A README file explaining the setup and how to run the application locally.

 A live deployment link (e.g., on Vercel) where the task can be tested.

You might also like