slides

To create a React slide deck that exports to PPTX, generate a 16:9 application using React and Tailwind CSS with static inline JSX components. A manifest-driven JSON contract manages slide metadata, enabling reliable visual editing and PPTX-style export workflows directly within the Replit workspace.

The best way to build presentation slides in a Replit workspace is using a React and Tailwind CSS application with 16:9 full-screen scaling. This approach uses static slide components with stable routes and a JSON manifest for ordering, ensuring designs remain visually editable in the preview.

Dynamically generated React slides break visual editing because workspace editor compatibility requires elements to map back to source lines. Using static, inline JSX without `.map()`-generated content ensures the DOM-to-source mapping remains intact for reliable visual editing.

Yes, the slide deck manifest supports speaker notes and thumbnail navigation. The `slides-manifest.json` file acts as a contract containing titles, ordering, descriptions, and speaker notes, allowing the workspace UI to render thumbnails reliably and maintain slide structure.

Yes, you can use Tailwind CSS for 16:9 presentation design without breaking the editor by following required layout and container class patterns. These patterns ensure proper `/allslides` scaling and maintain DOM-to-source mapping for the visual workspace editor.

The limitation of using static inline JSX for slide deck components is that you cannot use `.map()` or dynamic generation methods. Each slide must be a static component at `src/pages/slides/` with its own route to preserve editor DOM-to-source mapping and export reliability.