Skip to content

Instantly share code, notes, and snippets.

View fwalzel's full-sized avatar

Florian Walzel fwalzel

View GitHub Profile
@fwalzel
fwalzel / html5-video.html
Created December 7, 2023 14:02
Embed scaling Html5 Video with constrained proportions, autoplaying
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Embed scaling Video, constraied proportions</title>
</head>
<body>
<div style="width: 100%; position: relative;">
<div style="padding-bottom: calc(100% * 720 / 1280); position: relative;">
<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent;">
@fwalzel
fwalzel / README.md
Last active January 28, 2025 18:38
Running a Vue.js App as a Stand-alone Executable (Mac / Windows)

Running a Vue.js App as a Stand-alone Executable (Mac / Windows)

This gist describes how to bundle a built Vue.js project – the dist folder – together with a local web server in a stand-alone executable (no Node.js installation needed on the client).

Problem

When we want to present a completed Vue project to a third party (a client, a collaborator, etc.), we cannot just send the dist folder and explain how to open the index.html file. This won’t work because Vue presupposes a web server to run (at least as long as we don't manipulate the publicPath configuration). Setting up a whole web hosting environment, organizing a domain name, and securing it with a server lock, among other things, can be a bit much. On the other hand, explaining someone with no technical background how to install Node.js and run a local web server just to see our project is equally inconvenient. This can be a problem.

Solution