ILD View Application
The ILD View application is a specialized viewer component of the ILD (Interactive Learning Design) platform. It provides a focused interface for consuming and interacting with learning content, optimized for content viewing and interaction.
Overview
The view application is designed to provide an optimal viewing experience for learning materials. It's built with performance and user experience in mind, ensuring smooth content delivery and interaction.
Technology Stack
- Frontend Framework: React 18
- Build Tool: Vite
- UI Framework: Mantine v7
- State Management: React Query
- Routing: React Router v6
- Type Safety: TypeScript
- HTTP Client: Axios
- Rich Text Editor: TipTap
- Date Handling: Day.js
- Local Storage: LocalForage
- Data Processing: PapaParse
Key Features
- Optimized content viewing
- Interactive learning materials
- Progress tracking
- Content navigation
- Media playback
- Interactive exercises
- Note-taking capabilities
- Bookmarking system
- Accessibility features
- Responsive design
Getting Started
Prerequisites
- Node.js (LTS version)
- npm or yarn package manager
Installation
- Clone the repository
- Install dependencies:
bash npm install
Project Structure
ild-view/
├── src/ # Source code
├── public/ # Static assets
├── dist/ # Build output
├── vite.config.ts # Vite configuration
├── tsconfig.json # TypeScript configuration
└── package.json # Project dependencies and scripts
Docker Support
The application includes Docker support for both development and production environments:
Dockerfile- Development environmentDockerfile.prod- Production environment
API Integration
The view application integrates with various ILD platform APIs:
- Content Delivery API
- Progress Tracking API
- User Interaction API
- Media Streaming API
- Analytics API
Contributing
Please refer to the main project's contributing guidelines for information on how to contribute to this application.
License
This project is part of the ILD platform and is subject to the same licensing terms as the main project.