I built PresentationApp because I had a presentation to give at work, and what I wanted to show didn't fit in a normal slide deck.

I needed to show websites and play videos fullscreen. Slides were part of the talk, but so were the things I had actually built. Getting all of that to work together in a PowerPoint-style presentation was awkward enough that I decided to build my own.

The idea was simple: one presentation could hold images, video, and live website demos in the same flow. A website could be something I clicked through during the talk. A video could have all the screen space it needed. I could move between those formats without leaving the presentation.

PresentationApp became a browser-based deck that supports those slide types. The project includes the viewer, a deck definition file, and the images and videos the presentation uses. It can also build a static version for hosting, so the presentation can run outside my development setup.

One detail matters when you put real websites into a presentation: some site features don't work inside an embedded frame. Login is one example. The viewer has an option to open a demo in a separate tab, so there's a fallback when a site needs its own browser context.

This project came from a very specific need. I had work to present, and I wanted the presentation to handle that work without getting in the way. Building a small tool around it gave me control over how I showed it.

It also belongs in my development story because the reason was concrete. I could point to the friction, describe what I needed, and build something focused enough to do that one job.

Bringing an existing deck into the viewer

The project also includes a Google Slides exporter. I could keep authoring in a familiar tool and still use a custom viewer. The exporter turns each slide into an image and builds a deck description that tells the viewer what each slide needs.

A normal slide stays an image. A slide tied to a website carries a demo URL. An inserted video can be exported as a video file or referenced through an appropriate embed. These are different kinds of content, so the viewer needs enough information to pick the right behavior as I move through the deck.

That split keeps the responsibilities clear. The deck description says what belongs on each slide. The viewer handles navigation and display. Media files stay as ordinary assets that travel with the presentation. I didn't have to build a separate page for every slide.

Making a demo usable during a presentation

Embedding a website creates an interaction problem as well as a layout problem. I need to move through the deck, but a live website needs to receive clicks and keyboard input. The viewer has controls to enter and leave an interactive demo mode, so each of those actions has a clear place.

It also stops the previous slide's media when the presentation moves on. A video or embedded page still playing behind the next slide would confuse people during a live talk. The fullscreen controls and video handling serve the same goal: make the presentation behave predictably while I'm showing people my work.

On the local server side, video range requests matter because I may need to jump to a particular part of a clip. Starting from the beginning and skipping ahead are different requests. Handling those details is what makes video feel like a normal part of the presentation.

The reason I built PresentationApp was small and specific: I wanted a better way to show websites and fullscreen videos at work. The exporter, the deck format, the viewer controls, and the media handling all came from that need.