Skip to content

StoryTeller is an experimental web application that creates short audio stories for pre-school kids.

License

Notifications You must be signed in to change notification settings

lgrammel/storyteller

Repository files navigation

Storyteller

StoryTeller is an experimental web application that creates short audio stories for pre-school kids.

Example Story

demo-recording.mp4

How it works

full

The main flow from the diagram can be found in generateStoryFlow. Most of the UI is implemented in index.tsx.

Development

  1. Install dependencies: npm i

  2. Setup .env with required keys and base url:

     NEXT_PUBLIC_BASE_URL="http://localhost:3001"
     OPENAI_API_KEY="sk-..."
     ELEVENLABS_API_KEY="..."
     LMNT_API_KEY="..."
     STABILITY_API_KEY="sk-..."
    

    You can get the API keys from the respective services:

  3. Start Fastify server (runs on port 3001): npm run fastify

  4. Start Next.js server for UI (runs on port 3000): npm run next

  5. Go to localhost:3000

Deployment

  1. Build the Next.js app: npm run build. This exports the app to the out folder, so it can be served by Fastify.

Deploy to Render

StoryTeller can be deployed as a Render web service.

  • Build command: npm i; npm run build
  • Start command: npm start
  • Configure the NEXT_PUBLIC_BASE_URL environment variable to the Render service URL (base url must not have trailing slash)
  • Add the API keys to the Render Environment settings.

Used Libraries and AI services

StoryTeller is built with the following libraries:

The following AI APIs are used:

Limitations

  • No persistent execution with error handling
  • No user accounts / persistent data (only storage of image and audio files)
  • No user authentication / authorization
  • Limited error handling on the client
  • Tested on Chrome Desktop (Mac). Other browsers & operating systems may not work.

About

StoryTeller is an experimental web application that creates short audio stories for pre-school kids.

Resources

License

Stars

Watchers

Forks