TRACKER - Für euch programmiert!

Hallo,

Hatte gerade mal etwas langeweile und habe einen Tracker für euch programmiert:

• Eine einzelne Datei.
• Komplett in HTML, JavaScript und CSS.
• Dieser läuft auf eurem PC oder Smartphone (auch ohne Internetverbindung).
• Damit könnt ihr alles Tracken was Ihr so wollt.
• Komplett responsive.
• Kostenlos für jeden & offener Quellcode (kann also nach euren Wünschen angepasst werden).
• Kann auch auf einem Webspace hochgeladen werden um öffentlich erreichbar zu sein.

Wie erstelle ich neue Daten?

Öffnet einfach die Datei mit beliebigem Editor, ändert oder erweitert die Daten, speichern, fertig & in einem Browser öffnen.

Die betroffenen Zeilen sind im Code kommentiert (die Reihenfolge ist egal, wird automatisch sortiert):

// INFO: Format einhalten: Komma am Ende jeder Zeile – außer bei der letzten!
{ name: "Planzen getoppt", date: "2025-08-01 10:00:00", active: 1 },
{ name: "Pflanzen umgetopft", date: "2025-07-05 09:00:00", active: 1 },
{ name: "Samen gekeimt", date: "2025-06-25 08:00:00", active: 1 },
{ name: "Goodpeace hat dies für dich erstellt", date: "2025-08-07 10:41:00", active: 1 }

active einfach auf 0 setzen dann wird der Eintrag nicht mehr anzeigt.

Hier legt ihr einfach die Maximale Anzahl der Einträge fest:

const maxEntries = 25; // INFO: Maximale Anzahl der angezeigten Einträge

Solltet ihr Fehler findet, einfach melden

Die Datei selbst lässt sich nach dem entpacken aber im Browser öffnen?

Hab leider kein iPhone zum testen aber normal geht das schon mit einem normalen Text-Editor zb

iPhone etwas umständlicher (wie soll's auch anders sein) 🤣 Variante B und C sollte definitiv funktionieren.

Zitat

Auf einem iPhone ist das etwas umständlicher als auf einem PC, weil iOS nicht einfach erlaubt, beliebige lokale HTML-Dateien direkt im Safari-Browser per file:// zu öffnen.

Aber es gibt ein paar Möglichkeiten, wie du trotzdem eine HTML-Datei bearbeiten und lokal ansehen kannst.

1. Bearbeiten

Texteditor-Apps mit HTML-Unterstützung

Beispiele:

Textastic Code Editor (kostenpflichtig, sehr gut für HTML/CSS/JS)

Koder (kostenlos, einfacher)

Buffer Editor

Shortcut-Weg

Du kannst die Datei in der Dateien-App speichern.

Zum Bearbeiten kannst du jede App nehmen, die Textdateien unterstützt (z. B. Textastic, Pretext, Kodex).

2. Öffnen im Browser

Da Safari file://-Links nicht unterstützt, musst du einen Trick verwenden:

Variante A: Direkt in der Editor-App anzeigen

Viele Code-Editoren haben eine "Preview"-Funktion, die dir die HTML-Datei mit integriertem Browser rendert.

Vorteil: Kein Upload nötig.

Beispiel: In Textastic einfach index.html öffnen → "Preview" tippen.

Variante B: Lokaler Webserver auf dem iPhone

Installiere eine App wie Koder oder Textastic → diese starten einen kleinen lokalen Webserver.

Die App gibt dir dann eine URL wie → diese kannst du in Safari öffnen.

Vorteil: Funktioniert auch mit JS und CSS ohne Einschränkungen.

Variante C: Cloud-Zwischenlösung

Lade die HTML-Datei zu iCloud Drive, Dropbox oder Google Drive hoch.

Öffne sie dort mit „In Safari öffnen“ → die Datei wird über HTTPS geladen.

Nachteil: Nicht wirklich "offline", aber schnell.

💡 Mein Tipp

Für schnelles Testen auf dem iPhone:

Kodex (kostenlos) → Datei in Dateien-App speichern → in Kodex öffnen → Vorschau starten.

Wenn du öfter an HTML arbeitest: Textastic → mehr Features, schnellerer Workflow.

Alles anzeigen

Du hast die Datei aber schon vorher runtergeladen? Nach dem runterladen (keine wie das unter iPhone geht), muss die Datei entpackt werden

Oder was genau klappt nicht?

TRACKER.zip entpacken

Zitat

Auf dem iPhone kannst du ZIP-Dateien direkt ohne extra App entpacken, wenn du iOS 13 oder neuer hast.

So geht’s:

Methode 1 – Direkt in der Dateien-App

Öffne die Dateien-App.

Navigiere zu dem Ordner, in dem deine ZIP-Datei liegt (z. B. „Auf meinem iPhone“ oder iCloud Drive).

Tippe einmal auf die ZIP-Datei – sie wird automatisch entpackt und ein gleichnamiger Ordner erscheint.

Methode 2 – ZIP aus Mail oder Safari entpacken

Wenn du eine ZIP-Datei in Mail, WhatsApp oder Safari öffnest, wähle „In Dateien sichern“ → Speicherort wählen → dann in der Dateien-App entpacken (wie in Methode 1).

Alles anzeigen

Strange sonst noch jemand das Problem unter iOS?

Bin gerade nicht am PC, eventuell ein onlinetool nutzen:

Home - unzip-online

Unzip Files Online (No Registration Required!)

Open and extract zip files online for free including password protected files. NO upload/downloading. no usage limits. Quick and secure!

www.ezyzip.com

Ansonsten Versuch ich die Datei morgen nochmals normal hochzuladen ohne ZIP.

Direktlink ohne ZIP:

Download TRACKER.html | LimeWire

Download TRACKER.html on LimeWire

limewire.com

Hab die TRACKER.html nochmal extern hochgeladen.

Die Datei scheint bei dir jedoch nicht zu laden (iPhone zu streng), musst wahrscheinlich wie oben beschrieben öffnen.

Unter Android geht's jedenfalls direkt ohne Webserver oder ähnlichem 💪

In dem Dreh, ist nur eine HTML Datei mit paar Zeilchen Code

Damit kannst du irgendwelche Daten + Uhrzeiten festlegen und der Tracker zählt dann die Tage hoch, so kannst du zB Dokumentieren was du was und wann gemacht hast, kann für alles mögliche an Tracking benutzt werden

Wie Tracker2? 😅