AfroLingo

AfroLingo is a cross-platform (iOS/Android/Web) African language-learning app designed for micro-learning. It combines structured lessons and progress tracking with real-time experiences (chat, presence, in-app notifications) using Socket.IO, Postgres (Prisma), Redis, and Firebase Auth.

Table of Contents

1. Introduction
2. About
3. Tech Stack
4. Features
5. Architecture
6. Screenshots
7. Quick Start
8. Snippets
9. Links

Introduction

This repository contains both:

• Client: Expo + React Native app in the Client/ directory.
• Server: Node.js (Express) API + Socket.IO realtime server in the Server/ directory.

The client talks to the server over HTTP (REST endpoints under /api) and subscribes to realtime updates via Socket.IO.

About

AfroLingo’s goal is to help learners reconnect with African languages and cultural context through:

• Bite-sized lessons and practice activities
• Progress + XP tracking
• Tutor discovery and 1:1 messaging (real-time)
• Community experiences (UI prototype demonstrating scalable feature structure)

This README is written to be useful in understanding how the project works.

Tech Stack

• Client: React Native (Expo), Expo Router, TypeScript, Firebase (Auth), Socket.IO client
• Server: Node.js, Express, TypeScript, Socket.IO, Zod
• Database: PostgreSQL
• ORM: Prisma
• Realtime infra: Redis (presence, rate limiting, Socket.IO adapter)

Features

Learning + progress

1. Lessons / units / stories / grammar tips / practice activities
2. Progress tracking and XP/streak mechanics

Onboarding + personalization

3. Onboarding flow and preference storage (theme + notification preferences)

Tutors + 1:1 realtime chat

4. Tutor discovery served by the backend
5. 1:1 chat with persisted threads/messages in Postgres (Prisma)
6. Realtime delivery over Socket.IO with read/unread tracking

Community (prototype UI)

7. A prototype-only Community tab implemented with mock data (no backend dependencies) demonstrating UI/UX and feature organization.

For the detailed Community summary, see Client/README_COMMUNITY.md.

Architecture

High-level flow

1. The app authenticates with Firebase Auth.
2. HTTP requests go to the Express API (configured via EXPO_PUBLIC_API_BASE_URL).
3. Socket.IO connections include a Firebase ID token in the handshake.
4. The server verifies the token using Firebase Admin, then joins rooms (per-user and per-group).
5. Durable data lives in Postgres (via Prisma).
6. Redis provides presence, rate limiting, and Socket.IO scaling support.

Realtime examples

• In-app notifications: notification:new
• Tutor chat: tutor_chat:message:new
• Groups: message + presence/typing patterns

Screenshots

Onboarding:

Home / Dashboard:

Lesson / Practice:

Tutors + 1:1 Chat:

Add 1:1 chat screenshots here (optional).

Community:

Quick Start

Follow these steps to run the full project locally.

Prerequisites

• Node.js 18+
• PostgreSQL (local or remote)
• Redis (recommended)
• A Firebase project for Auth

1) Clone the repository

git clone https://github.com/vroymv/AfroLingo.git
cd AfroLingo

2) Configure environment variables

Client

cd Client
cp .env.example .env

Set at minimum:

• EXPO_PUBLIC_API_BASE_URL (must include /api, e.g. http://localhost:3000/api)
• the EXPO_PUBLIC_FIREBASE_* variables

Server

cd ../Server
cp .env.example .env

Set at minimum:

• DATABASE_URL
• REDIS_URL (recommended)
• Firebase Admin credentials (GOOGLE_APPLICATION_CREDENTIALS OR FIREBASE_PROJECT_ID + FIREBASE_CLIENT_EMAIL + FIREBASE_PRIVATE_KEY)

3) Start the backend

cd Server
npm install
npm run db:generate
npm run db:migrate
npm run db:seed
npm run dev

4) Start the client

Open a second terminal:

cd Client
npm install
npm start

Then open iOS Simulator / Android Emulator / Web from the Expo CLI.

Snippets

Example API base URL (Client)

# Client/.env
EXPO_PUBLIC_API_BASE_URL=http://localhost:3000/api

Example database config (Server)

# Server/.env
DATABASE_URL=postgresql://postgres:postgres@localhost:5432/afrolingo?schema=public
REDIS_URL=redis://localhost:6379

Socket auth (concept)

The Socket.IO server expects a Firebase ID token sent during the handshake (client-side implementation details vary by screen):

// concept only
// io("http://localhost:3000", { auth: { token: "<firebase-id-token>" } })

Links

• Client docs: Client/docs/
• Community summary: Client/README_COMMUNITY.md
• Server docs: Server/DATABASE_GUIDE.md