Ich habe eine Open-Source-App zur Angstverfolgung entwickelt

Als Entwickler sind uns Stress und Angst nicht fremd. Der Druck, Fristen einzuhalten, die Frustration beim Debugging und die ständige Notwendigkeit, Neues zu lernen, können ihren Tribut fordern. Obwohl es viele Apps für psychisches Wohlbefinden gibt, hat mich eine quälende Frage immer wieder beschäftigt: Wohin gehen meine Daten? Ich wollte ein Tool, das nicht nur wirksam ist, sondern auch meine Privatsphäre respektiert. Deshalb habe ich MindfulTrack erstellt, eine Open-Source-Anwendung, die Menschen dabei hilft, ihre Angstauslöser in einer sicheren, privaten Umgebung zu verfolgen und zu visualisieren.

In diesem Artikel führe ich Sie durch die Entwicklung von MindfulTrack. Wir werden die datenschutzorientierte Architektur erkunden, den technologischen Stack untersuchen, der sie antreibt, und wie Sie zu diesem sinnvollen Projekt beitragen können. Dies ist mehr als nur eine Projektvorstellung; es ist eine Einladung, ein Tool zu entwickeln, das Menschen wirklich helfen kann, mit der Gewissheit, dass ihre sensiblen Daten in ihrer Obhut bleiben.

Voraussetzungen:

• Ein grundlegendes Verständnis von React (Next.js) und serverlosen Funktionen.
• Vertrautheit mit Git und GitHub.
• Node.js und npm (oder yarn) auf Ihrem Rechner installiert.

Das Problem verstehen

Viele bestehende Apps für psychische Gesundheit sind geschlossen und werbefinanziert, was einen potenziellen Interessenkonflikt bei Benutzerdaten schafft. Ihre persönlichsten Gedanken und Gefühle können zu einem Produkt werden. Die Herausforderung bestand darin, eine Anwendung zu erstellen, die:

• Vollständig privat ist: Alle Daten sind benutzereigen und verschlüsselt.
• Zugänglich ist: Kostenlos nutzbar und leicht für den persönlichen Gebrauch bereitzustellen.
• Erkenntnisse liefert: Hilft Benutzern, Muster in ihrer Angst durch einfache Visualisierungen zu erkennen.
• Gemeinschaftsgetrieben ist: Offen für Beiträge und Verbesserungen von der Entwicklergemeinschaft.

MindfulTrack adressiert diese Probleme, indem es Datenschutz in den Mittelpunkt stellt, und nutzt einen modernen Tech-Stack, der sowohl leistungsstark als auch kosteneffektiv für individuelles Hosting ist.

Voraussetzungen für Beiträge

Um mit Beiträgen zu MindfulTrack zu beginnen, benötigen Sie:

• Ein GitHub-Konto: Um das Repository zu forken und Pull-Requests einzureichen.
• Node.js: Version 18.0 oder höher.
• Ein Vercel-Konto: Für einfache Bereitstellung und Hosting Ihrer eigenen Instanz.
• Eine PostgreSQL-Datenbank: Sie können eine kostenlose von Anbietern wie Supabase oder Vercel Postgres erhalten.

Um das Projekt lokal einzurichten, klonen Sie das Repository und installieren Sie die Abhängigkeiten:

git clone https://github.com/your-github-username/mindfultrack.git
cd mindfultrack
npm install

Schritt 1: Die Grundlage – Next.js-Frontend

Was wir tun: Aufbau einer responsiven und interaktiven Benutzeroberfläche mit Next.js.

Implementierung:

Der Kern der Anwendung ist mit Next.js gebaut, gewählt wegen seiner ausgezeichneten Entwicklererfahrung, Performance und hybriden Rendering-Fähigkeiten.

• pages/index.js: Das Hauptdashboard, auf dem Benutzer ihre Angstlevel und zugehörigen Auslöser protokollieren können.
• pages/trends.js: Eine Seite zur Visualisierung der gesammelten Daten im Zeitverlauf.
• components/: Wiederverwendbare React-Komponenten für Dinge wie Schaltflächen, Modals und Diagramme.

Hier ist ein vereinfachter Blick auf die Auslöser-Protokollierungskomponente:

// components/TriggerLogger.js
import { useState } from 'react';

export default function TriggerLogger() {
  const [anxietyLevel, setAnxietyLevel] = useState(5);
  const [triggers, setTriggers] = useState('');

  const handleSubmit = async (e) => {
    e.preventDefault();
    // API-Aufruf zum Speichern der Daten kommt hier hin
    console.log({ anxietyLevel, triggers });
  };

  return (
    <form onSubmit={handleSubmit}>
      <label htmlFor="anxietyLevel">Angstlevel (1-10)</label>
      <input
        type="range"
        id="anxietyLevel"
        min="1"
        max="10"
        value={anxietyLevel}
        onChange={(e) => setAnxietyLevel(e.target.value)}
      />
      <textarea
        placeholder="Was sind Ihre Auslöser?"
        value={triggers}
        onChange={(e) => setTriggers(e.target.value)}
      />
      <button type="submit">Eintrag protokollieren</button>
    </form>
  );
}

Wie es funktioniert:

Diese Komponente nutzt den useState-Hook von React, um den Zustand des Formulars zu verwalten. Wenn der Benutzer das Formular absendet, wird die handleSubmit-Funktion diese Daten letztendlich an einen sicheren API-Endpunkt senden.

Schritt 2: Das Gehirn – Next.js-API-Routen und PostgreSQL

Was wir tun: Erstellung eines sicheren Backends zum Speichern und Abrufen von Benutzerdaten mit Next.js-API-Routen und einer PostgreSQL-Datenbank.

Implementierung:

Next.js-API-Routen bieten eine nahtlose Möglichkeit, ein serverloses Backend zu erstellen. Wir erstellen einen Endpunkt zur Verarbeitung der Übermittlung von Angstprotokollen.

// pages/api/log.js
import { Pool } from 'pg';

const pool = new Pool({
  connectionString: process.env.POSTGRES_URL,
});

export default async function handler(req, res) {
  if (req.method === 'POST') {
    const { anxietyLevel, triggers } = req.body;
    // Hier würden Sie auch die Benutzer-ID aus einer sicheren Sitzung erhalten
    try {
      await pool.query(
        'INSERT INTO anxiety_logs (level, triggers) VALUES ($1, $2)',
        [anxietyLevel, triggers]
      );
      res.status(200).json({ message: 'Protokoll erfolgreich gespeichert' });
    } catch (error) {
      res.status(500).json({ error: 'Speichern des Protokolls fehlgeschlagen' });
    }
  } else {
    // Andere HTTP-Methoden behandeln oder einen Fehler zurückgeben
    res.setHeader('Allow', ['POST']);
    res.status(405).end(`Methode ${req.method} nicht erlaubt`);
  }
}

Wie es funktioniert:

Diese API-Route verbindet sich mit einer PostgreSQL-Datenbank unter Verwendung der pg-Bibliothek. Sie lauscht auf POST-Anfragen und fügt das neue Angstprotokoll in die Tabelle anxiety_logs ein. Die Datenbank-Verbindungszeichenfolge wird sicher in einer Umgebungsvariable gespeichert.

Schritt 3: Datenschutzorientiertes Design

Dies ist der wichtigste Aspekt von MindfulTrack. Hier sind einige der datenschutzorientierten Entscheidungen:

• Keine Drittanbieter-Tracker: Die App enthält keine Analysen oder Werbetracker.
• Datenverschlüsselung: Die Verbindung zur PostgreSQL-Datenbank ist verschlüsselt.
• Benutzereigene Daten: Das ultimative Ziel ist es, Benutzern zu ermöglichen, alle ihre Daten leicht zu exportieren oder zu löschen.
• Selbsthosting gefördert: Durch klare Bereitstellungsanweisungen werden Benutzer ermutigt, ihre eigene Instanz von MindfulTrack zu hosten, was ihnen die volle Kontrolle über ihre Daten gibt.

Alles zusammenfügen

Mit dem Frontend, Backend und der Datenbank verbunden, bietet die Anwendung eine nahtlose Erfahrung. Ein Benutzer kann:

1. Die bereitgestellte Anwendung besuchen.
2. Sich sicher anmelden (Authentifizierung kann mit einer Bibliothek wie NextAuth.js für zusätzliche Sicherheit implementiert werden).
3. Seinen Angstlevel und Auslöser auf der Hauptseite eingeben.
4. Seine historischen Daten auf der Seite „Trends" anzeigen, visualisiert mit einer Bibliothek wie Chart.js.

Wie Sie beitragen können

Ich glaube an die Kraft der Gemeinschaft und lade Sie ein, zu MindfulTrack beizutragen. Ob Sie ein erfahrener Entwickler sind oder gerade erst anfangen, es gibt viele Möglichkeiten zu helfen:

• Fehler melden: Einen Fehler gefunden? Eröffnen Sie ein Issue im GitHub-Repository.
• Funktionen vorschlagen: Haben Sie eine Idee für eine neue Funktion? Lassen Sie uns dies im Issues-Bereich diskutieren.
• Code schreiben: Forken Sie das Repository, erstellen Sie einen neuen Branch und reichen Sie einen Pull-Request mit Ihren Verbesserungen ein.
• Dokumentation verbessern: Klare Dokumentation ist unerlässlich. Helfen Sie, sie zu verbessern.

Sie finden das Projekt auf GitHub: [Link zu Ihrem GitHub-Repository hier]

Fazit

MindfulTrack ist mehr als nur ein Codierungsprojekt; es ist eine Aussage darüber, welche Art von Technologie wir entwickeln sollten – Tools, die Benutzer stärken und schützen. Durch die Open-Source-Veröffentlichung dieser Anwendung hoffe ich, eine Ressource zu schaffen, die von der Gemeinschaft für die Gemeinschaft aufgebaut wird.

Ich ermutige Sie, das Projekt zu überprüfen, und freue mich auf Ihr Feedback und Ihre Beiträge.

Ressourcen

• Next.js-Dokumentation
• Vercel Postgres
• NextAuth.js für Authentifizierung
• Prinzipien für Datenschutz durch Design

Kurzübersicht

Häufig gestellte Fragen

F: Woher weiß ich, ob dies auf mich zutrifft? A: Besprechen Sie Ihre persönliche und familiäre Krankengeschichte mit Ihrem Arzt, um Ihre individuellen Risikofaktoren zu bewerten und geeignete nächste Schritte zu bestimmen.

F: Was sollte ich meinen Arzt fragen? A: Gute Fragen sind: „Was bedeuten meine Ergebnisse?", „Was sind meine Optionen?", „Welche Lebensstiländerungen würden helfen?" und „Wann sollte ich nachuntersuchen?"

F: Gibt es Lebensstiländerungen, die helfen können? A: Die meisten Gesundheitszustände profitieren von grundlegenden Maßnahmen: ausgewogene Ernährung, regelmäßige körperliche Aktivität (150+ Minuten/Woche), качественный Schlaf (7-9 Stunden), Stressbewältigung und Vermeidung von Tabak.

Medizinischer Haftungsausschluss

Dieser Artikel dient ausschließlich zu Bildungszwecken und stellt keine medizinische Beratung dar. Konsultieren Sie immer einen qualifizierten Arzt, bevor Sie Entscheidungen über Ihre Gesundheit, Behandlung oder Pflege treffen. Individuelle Umstände variieren, und was für eine Person angemessen ist, ist möglicherweise nicht für eine andere Person geeignet.

Wenn Sie einen medizinischen Notfall haben, rufen Sie sofort 911 (oder Ihre lokale Notrufnummer) an.