The latest articles on DEV Community by Vladimir Zhuravlev (@thehemen). https://dev.to/thehemen https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3949106%2Fb1222bfa-c465-4ac3-a4e1-dfd7a3eeff4e.png https://dev.to/thehemen en Vladimir Zhuravlev Sun, 24 May 2026 13:48:12 +0000 https://dev.to/thehemen/i-built-ai-web-platform-7ek https://dev.to/thehemen/i-built-ai-web-platform-7ek <p>Hi everyone! I’d like to share my project - AI Web Platform.</p> <p>It’s a full-stack platform for creating AI-generated video projects with a scene-based workflow. Users can create a project, generate or edit scripts, split them into scenes, generate videos, images with different AI models, manage a timeline, and add music, speech, or sound effects.</p> <p>The platform is built with Vue, FastAPI, SQLite, WebSockets, and modular AI model integrations, including video, image, music, TTS, and sound-generation APIs. The main idea is to make AI video production more structured, editable, and convenient for creative workflows.</p> <p>Happy to share more details or discuss possible use cases.</p> <p>Here's the repository.<br> </p> <div class="ltag-github-readme-tag"> <div class="readme-overview"> <h2> <img src="https://assets.dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"> <a href="https://github.com/thehemen" rel="noopener noreferrer"> thehemen </a> / <a href="https://github.com/thehemen/ai_platform" rel="noopener noreferrer"> ai_platform </a> </h2> <h3> </h3> </div> <div class="ltag-github-body"> <div id="readme" class="md"> <div class="markdown-heading"> <h1 class="heading-element">Video Generation Platform</h1> </div> <p>A full-stack application for AI-powered video generation with FastAPI backend and Vue.js frontend.</p> <div class="markdown-heading"> <h2 class="heading-element">Features</h2> </div> <ul> <li>User authentication and personal workspaces</li> <li>OpenAI-powered script generation</li> <li>Multi-scene video projects with editable timelines</li> <li>Multiple video generation models (Fal.ai Seedance v1.5 Pro)</li> <li>WebSocket real-time updates</li> <li>Video preview and export functionality</li> </ul> <div class="markdown-heading"> <h2 class="heading-element">Architecture</h2> </div> <ul> <li> <p><strong>Backend</strong>: FastAPI (Python)</p> <ul> <li>RESTful API with JWT authentication</li> <li>WebSocket support for real-time updates</li> <li>SQLite database for data persistence</li> <li>Modular video API integration system</li> <li>OpenAI integration for script generation</li> </ul> </li> <li> <p><strong>Frontend</strong>: Vue 3 + Vite</p> <ul> <li>Pinia for state management</li> <li>Vue Router for navigation</li> <li>Axios for API communication</li> <li>WebSocket integration</li> </ul> </li> </ul> <div class="markdown-heading"> <h2 class="heading-element">Setup</h2> </div> <div class="markdown-heading"> <h3 class="heading-element">Prerequisites</h3> </div> <ul> <li>Docker and Docker Compose</li> <li>OpenAI API key</li> <li>Fal.ai API key</li> </ul> <div class="markdown-heading"> <h3 class="heading-element">Configuration</h3> </div> <ol> <li> <p>Copy the environment file template:</p> <div class="highlight highlight-source-shell notranslate position-relative overflow-auto js-code-highlight"> <pre>cp .env.example environment</pre> </div> </li> <li> <p>Edit <code>environment</code> file and add your API keys:</p> <div class="snippet-clipboard-content notranslate position-relative overflow-auto"><pre class="notranslate"><code>OPENAI_API_KEY=your_openai_api_key_here FAL_API_KEY=your_fal_api_key_here SECRET_KEY=your-secret-key-change-this </code></pre></div> </li> </ol> <div class="markdown-heading"> <h3 class="heading-element">Running with Docker</h3> </div> <ol> <li> <p>Build and start the containers:</p> <div class="highlight highlight-source-shell notranslate position-relative overflow-auto js-code-highlight"> <pre>docker-compose up --build</pre> </div> </li> <li> <p>Access the application:</p> <ul> <li>Frontend: <a href="http://localhost:5173" rel="nofollow noopener noreferrer">http://localhost:5173</a> </li> <li>Backend API: <a href="http://localhost:8001" rel="nofollow noopener noreferrer">http://localhost:8001</a> </li> <li>API Documentation…</li> </ul> </li> </ol> </div> </div> <div class="gh-btn-container"><a class="gh-btn" href="https://github.com/thehemen/ai_platform" rel="noopener noreferrer">View on GitHub</a></div> </div> <p>Good luck!</p> ai chatgpt aivideo python