Khatisani/Xitsonga-tutor

A simple interactive learning tool that teaches young children body parts in Xitsonga. Built during the VibeCode Africa 2026 Marathon to promote underrepresented indigenous languages through educational technology. # Xitsonga-Tutor An interactive learning tool designed to teach young children the names of body parts in Xitsonga, ensuring underrepresented African languages have a vibrant place in modern educational tech. Built during the VibeCode Africa Coding Marathon (Thrive Development Initiative x GEBEYA, July 2026), this project targets screen time by turning mobile devices and tablets into tools for heritage and language learning. ## Features * **Interactive Learning:** Visual and interactive identification of human body parts. * **Native Xitsonga Audio & Text:** Direct focus on correct Xitsonga vocabulary and pronunciation. * **Kid-Friendly Interface:** Simple UI optimized for touch interaction on phones and tablets. * **AI Assistance:** Interactive prompts and feedback tailored for young learners. ## Why Xitsonga? Indigenous languages are heavily underrepresented in global digital resources. As screen time increases among young children, this project aims to bridge the digital gap by making sure kids can engage with tech that celebrates their native tongue and cultural heritage. ## Getting Started 1. **Install dependencies** ```bash npm install ``` 2. **Start development server** ```bash npm run dev ``` 3. **Build for production** ```bash npm run build ``` 4. **Preview production build** ```bash npm run preview ``` ## 🎨 Customization ### Adding New shadcn/ui Components This template is pre-configured with shadcn/ui. You can add more components by creating them in the `src/components/ui/` directory. ### Tailwind Configuration The Tailwind configuration is set up with shadcn/ui color variables. You can customize colors and other design tokens in: - `tailwind.config.js` - Tailwind configuration - `src/index.css` - CSS custom properties for themes ### TypeScript Configuration Path mapping is configured for clean imports: ```typescript import { Button } from "@/components/ui/button"; import { cn } from "@/lib/utils"; ``` ## 🌗 Dark Mode The template in …