Supporting young cancer survivors' transition back to school
SchoolKit is a cross-platform application developed for the CS342: Building for Digital Health course at Stanford University (Winter 2026). It facilitates a smoother transition from cancer treatment back to school for young cancer survivors and their support systems — reducing anxiety, confusion, and feelings of isolation during reintegration.
| Platform | Link |
|---|---|
| Web | schoolkit-five.vercel.app/welcome |
| iOS | TestFlight (invite required) |
- Node.js (v18 or later)
- npm
- Expo CLI
- For iOS development: Xcode (macOS only)
- For Android development: Android Studio
-
Clone the repository:
git clone https://github.com/CS342/2026-SchoolKit.git cd 2026-SchoolKit -
Install dependencies (the
--legacy-peer-depsflag is required due to peer dependency conflicts between React 19 and some packages):npm install --legacy-peer-deps
-
Set up environment variables — create a
.envfile in the root directory:EXPO_PUBLIC_SUPABASE_URL=your_supabase_url EXPO_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key EXPO_PUBLIC_OPEN_AI_MODERATION_KEY=your_openai_key
| Command | Description |
|---|---|
npm start |
Start the Expo dev server |
npm run ios |
Start on iOS simulator |
npm run android |
Start on Android emulator |
npm run web |
Launch in browser at http://localhost:8081 |
npm run lint |
Run ESLint |
For mobile, scan the QR code with the Expo Go app on your device, or press i for iOS simulator / a for Android emulator.
- Email/password sign-up and sign-in with password strength validation
- Email confirmation flow
- Guest access (anonymous sign-in)
- Multi-step onboarding: name, role selection (student K–8, student high school, parent, staff), grade level, school journey status, topic preferences, and AI voice selection
- Web-optimized split layout for auth/onboarding pages
- Personalized topic recommendations based on user role and interests
- Topic cards with category-based icons and gradients
- Topic detail pages with in-depth educational content
- Understanding Cancer
- Finding Support
- Peer Support
- School-Life Balance
- Managing Symptoms
- Coping Away From Home
- School Nurse resources
- Help & Support page
- Community stories shared by other users
- Story creation with text input and tags
- Story detail view with moderation system and rejected stories tracking
- Save and organize favorite resources
- Segmented tabs: All, Saved, Downloaded
- Offline access to downloaded content
- Visual knowledge tree tracking learning progress
- Accomplishment badges for completed topics and milestones
- Personal journal entries for reflection
- Create, view, and manage journal entries
- Visual design editor with Konva canvas
- Design templates and custom creation
- Undo/redo support via Zustand + Zundo
- Shareable designs via unique token links
- Role-based user profiles
- Edit name, role, grade level, school status, and topic preferences
- Language selection
- Dark mode / light mode toggle
- About page and sign out
- Text-to-Speech for content read-aloud
- Language selection support
- Single shared codebase using React Native + Expo
- Responsive web layout with sidebar navigation on desktop/tablet and bottom tabs on mobile
- Platform-specific adaptations and dark mode support across all platforms
- Download content for offline access
- Network status detection and graceful degradation
| Layer | Technology |
|---|---|
| Framework | React Native 0.81 + Expo 54 |
| Routing | Expo Router (file-based) |
| Language | TypeScript 5.9 |
| UI | React 19 |
| Backend | Supabase (Auth, PostgreSQL, REST API) |
| AI | OpenAI API (content generation, moderation) |
| TTS | Expo Speech + ElevenLabs (fallback) |
| State | React Context + Zustand |
| Undo/Redo | Zundo + Immer |
| Canvas | Konva + react-konva |
| Animations | React Native Reanimated |
├── app/ # Screens and routes (Expo Router file-based routing)
├── components/ # Reusable UI components
├── constants/ # Theme, colors, and configuration
├── contexts/ # React Context providers (Auth, Onboarding, Theme)
├── features/ # Feature-specific modules
├── hooks/ # Custom React hooks
├── lib/ # Library utilities and clients
├── services/ # API and backend service layers
├── supabase/ # Supabase migrations and configuration
├── types/ # TypeScript type definitions
├── utils/ # General utility functions
└── assets/ # Images, fonts, and static assets
- Dr. Yosiah Yarbrough
- Nicole Fernandez-Vina
| Name | GitHub |
|---|---|
| Yuzhou Bian | yuzhoubian |
| Yihan Zhao | ehan1han |
| Janina Troper | troper01 |
| Lour Drick Valsote | lourdrickvalsote |
| Seyma Kilic | Solskilic |
| Nikita Gounder | nikita-gounder |
This project is developed as part of Stanford University's CS342 course.