- Create TypeScript interfaces (Role, RoleWithVoice, RolesResponse, GenerateRequest) - Implement detectRoles() function for role detection - Implement generateAudiobook() function for audio generation - Implement checkHealth() function for backend health checks - Add comprehensive error handling for network failures - Use VITE_API_BASE_URL environment variable for configuration - Add ApiError class for structured error handling Requirements: 9.6, 9.7
Text to Audiobook Frontend
React TypeScript frontend for the Text to Audiobook application.
Setup
Prerequisites
- Node.js 20.19+ or 22.12+
- npm or yarn
Installation
- Install dependencies:
npm install
- Create environment file:
cp .env.example .env
- Update
.envwith your backend URL (default:http://localhost:8000)
Development
Start the development server:
npm run dev
The application will be available at http://localhost:5173
Build
Build for production:
npm run build
Preview production build:
npm run preview
Project Structure
src/
├── api/ # API client modules
├── components/ # React components
├── App.tsx # Main application component
├── main.tsx # Application entry point
└── index.css # Global styles (Tailwind)
Environment Variables
VITE_API_BASE_URL- Backend API base URL (default: http://localhost:8000)