OpenStock-Projektvorstellung

Projektübersicht

OpenStock ist eine moderne, quelloffene Aktienmarkt-Anwendung, die allen Nutzern kostenlose und offene Werkzeuge zur Marktverfolgung bereitstellen möchte. Sie dient als Open-Source-Alternative zu teuren Marktplattformen und unterstützt Echtzeit-Kursverfolgung, personalisierte Benachrichtigungen sowie detaillierte Unternehmensanalysen.

Kernphilosophie: Wissen sollte offen, kostenlos und zugänglich sein – Technologie gehört jedem.

Hauptfunktionen

🔐 Authentifizierung

• E-Mail/Passwort-basiertes Authentifizierungssystem mit Better Auth + MongoDB
• Geschützte Routen mittels Next.js-Middleware
• Vollständiges Benutzersitzungsmanagement

🔍 Globale Suche

• Schnelle Aktiensuche, unterstützt durch die Finnhub-API
• Anzeige beliebter Aktien im Leerlauf mit Debouncing bei Suchanfragen
• Aufruf des Kommandopanels per Tastenkürzel „Command + K“

⭐ Beobachtungsliste (Watchlist)

• Jede Benutzer-beobachtete Aktie wird in MongoDB gespeichert
• Jeder Aktiencode ist pro Benutzer eindeutig
• Einfaches Hinzufügen/Entfernen von Aktien

📊 Aktiendetails

• Symbolinformationen von TradingView
• Kerzen-, fortgeschrittene Charts, Baseline-Diagramme und technische Indikatoren
• Widgets für Unternehmensprofile und Finanzdaten

📈 Marktübersicht

• Heatmaps, Kursnotierungen und Schlagzeilen
• Nutzung eingebetteter TradingView-Widgets
• Echtzeit-Aktualisierung der Marktdaten

🎯 Personalisierter Onboarding-Prozess

• Erfassung des Wohnsitzlandes und der Anlageziele des Nutzers
• Risikotoleranz und bevorzugte Branchen
• Maßgeschneiderte Benutzererfahrung

📧 E-Mail & Automatisierung

• KI-generierte, personalisierte Willkommens-E-Mails (über Inngest mit Gemini)
• Tägliche Nachrichtenzusammenfassungen (geplante Aufgaben)
• Inhalte personalisiert basierend auf der Watchlist des Nutzers

🎨 Hochwertige Benutzeroberfläche

• shadcn/ui-Komponenten + Radix UI-Basisbausteine
• Tailwind v4 Design-System
• Standardmäßig dunkles Farbschema
• Responsives Design

Technologiestack

Kern-Technologien

• Next.js 15 (App Router)
• React 19
• TypeScript
• Tailwind CSS v4 (via @tailwindcss/postcss)
• shadcn/ui + Radix UI-Basiskomponenten
• Lucide Icon-Bibliothek

Authentifizierung & Daten

• Better Auth – E-Mail/Passwort-Authentifizierung mit MongoDB-Adapter
• MongoDB + Mongoose – Datenspeicherung
• Finnhub API – Aktiensymbole, Unternehmensprofile und Marktnachrichten
• TradingView – Einbettbare Chart-Widgets

Automatisierung & Kommunikation

• Inngest – Ereignisverarbeitung, geplante Aufgaben, KI-Inferenz (Gemini)
• Nodemailer – E-Mail-Versand (Gmail als Transport)
• next-themes – Theme-Umschaltung
• cmdk – Kommandopanel
• react-hook-form – Formularverarbeitung

Sprachverteilung

• TypeScript (~93,4 %)
• CSS (~6 %)
• JavaScript (~0,6 %)

Projektstruktur

app/
├── (auth)/                    # Authentifizierungsseiten
│   ├── layout.tsx
│   ├── sign-in/page.tsx
│   └── sign-up/page.tsx
├── (root)/                    # Hauptanwendungsseiten
│   ├── layout.tsx
│   ├── page.tsx
│   ├── help/page.tsx
│   └── stocks/[symbol]/page.tsx
├── api/inngest/route.ts       # Inngest-API-Endpunkt
├── globals.css
└── layout.tsx

components/
├── ui/                        # shadcn/Radix-Basis-Komponenten
├── forms/                     # Formularkomponenten
├── Header.tsx
├── Footer.tsx
├── SearchCommand.tsx
└── WatchlistButton.tsx

database/
├── models/watchlist.model.ts
└── mongoose.ts

lib/
├── actions/                   # Server-Aktionen
│   ├── auth
│   ├── finnhub
│   ├── user
│   └── watchlist
├── better-auth/
├── inngest/                   # Inngest-Client und Funktionen
├── nodemailer/               # E-Mail-Versandkonfiguration
├── constants.ts
└── utils.ts

scripts/
└── test-db.mjs               # Datenbankverbindungstest

types/
└── global.d.ts

public/assets/images/         # Logos und Screenshots

Schnellstart

Voraussetzungen

• Node.js 20+
• pnpm oder npm
• MongoDB-Verbindungsstring (MongoDB Atlas oder lokaler Docker-Container)
• Finnhub-API-Schlüssel
• Gmail-Konto (für E-Mail-Versand)
• Optional: Google Gemini-API-Schlüssel (für KI-generierte Inhalte)

Installationsanleitung

1. Repository klonen

git clone https://github.com/Open-Dev-Society/OpenStock.git
cd OpenStock

2. Abhängigkeiten installieren

pnpm install
# oder
npm install

3. Umgebungsvariablen konfigurieren

Erstellen Sie eine .env-Datei:

# Kernkonfiguration
NODE_ENV=development

# Datenbank
MONGODB_URI=your_mongodb_connection_string

# Better Auth
BETTER_AUTH_SECRET=your_better_auth_secret
BETTER_AUTH_URL=http://localhost:3000

# Finnhub
FINNHUB_API_KEY=your_finnhub_key
NEXT_PUBLIC_FINNHUB_API_KEY=
FINNHUB_BASE_URL=https://finnhub.io/api/v1

# Inngest AI (Gemini)
GEMINI_API_KEY=your_gemini_api_key

# E-Mail-Konfiguration
NODEMAILER_EMAIL=youraddress@gmail.com
NODEMAILER_PASSWORD=your_gmail_app_password

4. Datenbankverbindung prüfen

pnpm test:db

5. Entwicklungsserver starten

pnpm dev

6. Inngest starten (für Workflows und geplante Aufgaben)

npx inngest-cli@latest dev

7. Anwendung aufrufen

Öffnen Sie Ihren Browser unter http://localhost:3000

Docker-Bereitstellung

Das Projekt enthält eine Docker Compose-Konfiguration zum schnellen Starten der Anwendung und MongoDB:

# MongoDB starten
docker compose up -d mongodb

# Anwendung bauen und starten
docker compose up -d --build

Bei Verwendung von Docker lautet der MongoDB-Verbindungsstring:

MONGODB_URI=mongodb://root:example@mongodb:27017/openstock?authSource=admin

Daten & Integrationen

Finnhub API

• Bereitstellung von Aktiensuche, Unternehmensprofilen und Marktnachrichten
• Kostenlose Version liefert möglicherweise verzögerte Kurse
• Beachten Sie Rate-Limits

TradingView

• Bereitstellung einbettbarer Widgets für Charts, Heatmaps und Kursdaten
• Externe Bilder stammen von i.ibb.co

Better Auth + MongoDB

• E-Mail/Passwort-Authentifizierung
• MongoDB-Adapter für Sitzungsspeicherung
• Die meisten Routen sind geschützt, ausgenommen Login-/Registrierungsseiten

Inngest-Workflows

• Benutzererstellungsereignis → KI-generierte, personalisierte Willkommens-E-Mail
• Geplante Aufgabe (täglich um 12 Uhr mittags) → Versand täglicher Nachrichtenzusammenfassung
• Lokale Entwicklung mit npx inngest-cli@latest dev

E-Mail-Versand (Nodemailer)

• Verwendung von Gmail als Transportmethode
• Vorlagen für Willkommens-E-Mails und Nachrichtenzusammenfassungen vorhanden
• Für Produktionsumgebungen wird ein professioneller SMTP-Dienst empfohlen

Verfügbare Skripte

• pnpm dev – Startet den Entwicklungsserver (Turbopack)
• pnpm build – Erstellt Produktionsbuild
• pnpm start – Startet Produktionsserver
• pnpm lint – Führt ESLint aus
• pnpm test:db – Prüft Datenbankverbindung

Entwicklererfahrung

• TypeScript im Strict-Modus
• Tailwind CSS v4 (ohne separate Konfigurationsdatei)
• shadcn/ui-Komponentenbibliothek
• cmdk-Kommandopanel
• next-themes für Theme-Umschaltung
• lucide-react Icons

Manifest der Open Dev Society

Wir leben in einer Welt, in der Wissen hinter Bezahlschranken verborgen, Werkzeuge in Abonnementdiensten eingeschlossen, Informationen durch Voreingenommenheit verzerrt und Neulingen gesagt wird, sie seien „nicht gut genug“, um etwas zu bauen.

Unser Glaube:

• Technologie gehört jedem
• Wissen sollte offen, kostenlos und zugänglich sein
• Gemeinschaften sollten Neulinge mit Vertrauen statt Barrieren begrüßen

Unser Auftrag:

• Wirklich nützliche, freie Open-Source-Projekte zu erstellen
• Werkzeuge, die sowohl Profis als auch Studierende ohne Hindernisse nutzen können
• Eine Plattform für kostenloses Wissen, das immer frei bleibt
• Eine Gemeinschaft, die Anfänger leitet statt zu verurteilen
• Ressourcen, die auf Vertrauen statt Profit basieren

Unser Versprechen:

• Wissen niemals einzusperren
• Niemals Zugangsgebühren zu erheben
• Vertrauen niemals gegen Geld einzutauschen
• Auf Transparenz, Spenden und Gemeinschaftskraft zu basieren

Mitwirkungsrichtlinien

Jeder ist herzlich eingeladen mitzuhelfen – egal ob Student, autodidaktischer Entwickler oder erfahrener Ingenieur.

• Diskutieren Sie Ideen und Fehler über Issues
• Suchen Sie nach mit „good first issue“ oder „help wanted“ markierten Aufgaben
• Halten Sie Pull Requests fokussiert; UI-Änderungen bitte mit Screenshots versehen
• Seien Sie freundlich, unterstützen Sie Anfänger und lehnen Sie unnötige Hürden ab – das ist der ODS-Weg

Sicherheit

Falls Sie eine Sicherheitslücke entdecken:

• Erstellen Sie kein öffentliches Issue
• Senden Sie eine E-Mail an: opendevsociety@cc.cc
• Wir koordinieren eine verantwortungsvolle Offenlegung und beheben das Problem schnellstmöglich

Lizenz

OpenStock steht unter der AGPL-3.0-Lizenz. Wenn Sie es modifizieren, weiterverteilen oder bereitstellen (auch als Webdienst), müssen Sie Ihren Quellcode unter derselben Lizenz veröffentlichen und den ursprünglichen Autor angeben.

Danksagungen

• Finnhub – Für zugängliche Marktdaten
• TradingView – Für einbettbare Marktwidgtes
• shadcn/ui, Radix UI, Tailwind CSS, Next.js Community
• Inngest – Für zuverlässige Hintergrundaufgaben und Workflows
• Better Auth – Für einfache und sichere Authentifizierung
• Allen Beitragenden, die Open-Source-Werkzeuge möglich machen

Besonderer Dank gilt Adrian Hajdin (JavaScript Mastery), dessen hervorragendes Tutorial zu einer Aktienmarkt-Anwendung der Open Dev Society beim Bau von OpenStock entscheidend geholfen hat.

Gebaut auf Offenheit, für jeden, für immer kostenlos. — Open Dev Society

Projektadresse: https://github.com/Open-Dev-Society/OpenStock