Suggestion: self-hostable docker

[DeltaTangoLima]

Loving this project, and love your stance on not introducing an algorithm. Scrolling wikitok is already becoming a favourite time-filler for me.

Have you put any thought into developing a self-hostable docker image at all? I'm trying to cobble one together myself, but I'm the complete opposite of someone who knows anything about building/deploying React apps, so am getting lost pretty quickly.

Anyway, just a suggestion. Cheers.

[DeltaTangoLima]

OK, I think I've muddled through to a Dockerfile that works, but I'd really appreciate it if someone more knowledgeable than I is willing to chime in with their thoughts and suggestions. So far, this seems to work in my homelab:

FROM node:18-alpine

RUN apk add --no-cache curl && \
    mkdir release && \
    curl -L "https://github.com/IsaacGemal/wikitok/archive/refs/heads/main.tar.gz" | tar xvz --strip 1 -C ./release && \
    cd release/frontend && \
    npm install

WORKDIR release/frontend

EXPOSE 5173
CMD ["npm", "run", "dev", "--", "--host"]

Edit: so it seems the real issue is getting Vite to accept hostnames using dynamic environment variables through docker. So far, I've had to hard-code the desired hostname in my vite.config.ts, inside the export default section, thusly:

export default defineConfig({
...
  server: {
    allowedHosts: ['desired.fqdn.here']
  },
});

[56k-modem]

I am also trying to put this in Docker. How do you add the allowedHosts part to the config?

[DeltaTangoLima]

The only way was to fork this wikitok repo and use my fork with the following modified vite.config.ts file:

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import tailwindcss from "@tailwindcss/vite";
import { VitePWA } from "vite-plugin-pwa";

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    react(),
    tailwindcss(),
    VitePWA({
      registerType: "autoUpdate",
      manifest: {
        name: "WikiTok",
        short_name: "WikiTok",
        icons: [
          {
            src: "/wiki-logo.svg",
            sizes: "any",
            type: "image/svg+xml",
          },
        ],
        start_url: "/",
        display: "standalone",
        background_color: "#ffffff",
        theme_color: "#000000",
      },
    }),
  ],
  server: {
    allowedHosts: ['host.fqdn.here']
  },
});

That last server block is what I've added, where host.fqdn.here is the actual server address I want to use.

Of course, that also means adjusting the curl command in the Dockerfile to use the tarball from your forked repo - not this one.

[56k-modem]

Thank you!

[IsaacGemal]

What's the advantage of a self hosted docker container?

[DeltaTangoLima]

What's the advantage of a self hosted docker container?

I just wanted to do my bit to take pressure off the demo site the dev spun up. Plus, I can route my connection from the server via VPN.

[mxdpeep]

the best idea would be to put this onto Cloudflare Pages