Start by asking the AI to create the authentication UI:
Copy
Add authentication to my app:1. Create a Login screen with: - Email input field - Password input field - "Sign In" button - "Don't have an account? Sign up" link at bottom2. Create a Sign Up screen with: - Email input field - Password input field - Confirm password field - "Create Account" button - "Already have an account? Sign in" linkUse the app's existing color scheme and design language.
Connect the auth screens to the backend:- When signing up: - Validate email format - Ensure passwords match - Create user account - Automatically log in after signup - Navigate to home screen- When logging in: - Validate credentials - Show error if invalid - Navigate to home screen on success - Keep user logged in across app restarts
This creates the necessary API endpoints in Specular: /api/auth/register, /api/auth/login, and /api/auth/me.
Add authentication protection:- If user is not logged in, show the Login screen- After logging in, show the Home screen- The user should not be able to access Home without logging in- Check auth status when app launches
Add a logout button in the Settings screen:- When tapped, show a confirmation: "Are you sure you want to log out?"- On confirm, clear the session and return to Login screen- On cancel, stay on Settings
Add a Profile screen that shows:- User's email address- Account creation date- "Edit Profile" button (placeholder for now)- Logout button at the bottomNavigate to Profile from a user icon in the header.
Once authentication is set up, associate data with users:
Copy
Update the tasks feature so each user only sees their own tasks.When creating a task, automatically associate it with the current user.When fetching tasks, only return the current user's tasks.