Task Tracker

A small mobile app for managing a list of tasks. Built with Expo, React Native, and TypeScript.

Features

• View tasks — List all tasks with title and completion state
• Add tasks — Input + Add button; empty or whitespace-only entries are rejected with feedback
• Toggle completion — Checkbox per task to mark complete/incomplete
• Filter — Tabs: All | Active | Completed
• Persistence — Tasks saved locally with AsyncStorage and survive app restarts

Setup

1. Install dependencies:

   yarn install

2. Start the app:

   npx expo start

3. Run on a device or simulator:

   • Press a for Android emulator
   • Press i for iOS simulator
   • Or scan the QR code with Expo Go on your phone

Libraries used

Library	Purpose
Expo	Tooling, build, and dev experience
React Native	Cross-platform UI
TypeScript	Type safety and maintainability
Expo Router	File-based navigation
@react-native-async-storage/async-storage	Local persistence for tasks

Architecture overview

• Theme — Central light/dark theme in theme/ (colors, ThemeProvider, useTheme()). Follows system color scheme.
• Components — Reusable UI (Button, TextInput, Container) and task-specific pieces (TaskItem, TaskInput, TaskList, FilterTabs, EmptyState). Styles in co-located .styles.ts files.
• State — React state only; useTasks() hook holds task list, filter, and AsyncStorage load/save.
• Persistence — Key @TaskTracker:tasks; JSON array of { id, title, completed }. Load on mount, save when tasks change.

Future improvements

• Delete task
• Edit task title
• Categories or tags
• Cloud sync or backup