Présentation du projet OpenStock

Aperçu du projet

OpenStock est une application open source moderne destinée au suivi des marchés boursiers, conçue pour offrir à tous des outils gratuits et ouverts de surveillance du marché. Il s'agit d'une alternative open source aux plateformes coûteuses, proposant le suivi en temps réel des cours, des alertes personnalisées et des analyses détaillées sur les entreprises.

Principe fondamental : La connaissance devrait être ouverte, gratuite et accessible, et la technologie devrait appartenir à chacun.

Fonctionnalités principales

🔐 Authentification

• Système d’authentification par e-mail/mot de passe basé sur Better Auth + MongoDB
• Routes protégées via les middlewares Next.js
• Gestion complète des sessions utilisateur

🔍 Recherche globale

• Recherche rapide d’actions, alimentée par l’API Finnhub
• Affichage des actions populaires en l’absence d’activité, avec requêtes anti-rebond (debounced)
• Raccourci clavier Command + K pour ouvrir le panneau de commandes

⭐ Liste de surveillance personnalisée

• Stockage dans MongoDB des actions suivies par chaque utilisateur
• Chaque symbole boursier est unique par utilisateur
• Ajout/suppression facile

📊 Détails des actions

• Informations sur les symboles boursiers fournies par TradingView
• Graphiques chandeliers/avancés, graphiques de base, indicateurs techniques
• Widgets présentant les profils d’entreprise et les données financières

📈 Vue d’ensemble du marché

• Cartes thermiques, cotations et actualités principales
• Widgets intégrés provenant de TradingView
• Mise à jour en temps réel des données du marché

🎯 Parcours d’onboarding personnalisé

• Collecte du pays de résidence de l’utilisateur et de ses objectifs d’investissement
• Évaluation de la tolérance au risque et préférences sectorielles
• Expérience utilisateur sur mesure

📧 E-mails et automatisation

• E-mails de bienvenue personnalisés générés par IA (appel à Gemini via Inngest)
• Résumés quotidiens d’actualités (tâches planifiées)
• Contenus personnalisés basés sur les actions suivies par l’utilisateur

🎨 Interface utilisateur raffinée

• Composants shadcn/ui + composants de base Radix UI
• Système de design Tailwind v4
• Thème sombre par défaut
• Design responsive

Stack technique

Technologies principales

• Next.js 15 (App Router)
• React 19
• TypeScript
• Tailwind CSS v4 (via @tailwindcss/postcss)
• Composants shadcn/ui + composants de base Radix UI
• Bibliothèque d’icônes Lucide

Authentification et données

• Better Auth – authentification par e-mail/mot de passe avec adaptateur MongoDB
• MongoDB + Mongoose – persistance des données
• API Finnhub – symboles boursiers, profils d’entreprises et actualités du marché
• TradingView – widgets graphiques intégrables

Automatisation et communication

• Inngest – gestion des événements, tâches planifiées, inférence IA (Gemini)
• Nodemailer – envoi d’e-mails (transport Gmail)
• next-themes – changement de thème
• cmdk – panneau de commandes
• react-hook-form – gestion des formulaires

Répartition par langage

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

Structure du projet

app/
├── (auth)/                    # Pages liées à l’authentification
│   ├── layout.tsx
│   ├── sign-in/page.tsx
│   └── sign-up/page.tsx
├── (root)/                    # Pages principales de l’application
│   ├── layout.tsx
│   ├── page.tsx
│   ├── help/page.tsx
│   └── stocks/[symbol]/page.tsx
├── api/inngest/route.ts       # Point de terminaison API Inngest
├── globals.css
└── layout.tsx

components/
├── ui/                        # Composants de base shadcn/Radix
├── forms/                     # Composants de formulaire
├── Header.tsx
├── Footer.tsx
├── SearchCommand.tsx
└── WatchlistButton.tsx

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

lib/
├── actions/                   # Actions côté serveur
│   ├── auth
│   ├── finnhub
│   ├── user
│   └── watchlist
├── better-auth/
├── inngest/                   # Client et fonctions Inngest
├── nodemailer/               # Configuration d’envoi d’e-mails
├── constants.ts
└── utils.ts

scripts/
└── test-db.mjs               # Test de connexion à la base de données

types/
└── global.d.ts

public/assets/images/         # Logos et captures d’écran

Démarrage rapide

Prérequis

• Node.js 20+
• pnpm ou npm
• Chaîne de connexion MongoDB (MongoDB Atlas ou Docker local)
• Clé API Finnhub
• Compte Gmail (pour l’envoi d’e-mails)
• Facultatif : clé API Google Gemini (pour la génération de contenu IA)

Étapes d’installation

1. Cloner le dépôt

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

2. Installer les dépendances

pnpm install
# ou
npm install

3. Configurer les variables d’environnement

Créer un fichier .env :

# Configuration principale
NODE_ENV=development

# Base de données
MONGODB_URI=votre_chaîne_de_connexion_mongodb

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

# Finnhub
FINNHUB_API_KEY=votre_clé_finnhub
NEXT_PUBLIC_FINNHUB_API_KEY=
FINNHUB_BASE_URL=https://finnhub.io/api/v1

# Inngest IA (Gemini)
GEMINI_API_KEY=votre_clé_api_gemini

# Configuration des e-mails
NODEMAILER_EMAIL=votre_adresse@gmail.com
NODEMAILER_PASSWORD=votre_mot_de_passe_application_gmail

4. Vérifier la connexion à la base de données

pnpm test:db

5. Démarrer le serveur de développement

pnpm dev

6. Lancer Inngest (pour les workflows et tâches planifiées)

npx inngest-cli@latest dev

7. Accéder à l’application

Ouvrir http://localhost:3000 dans votre navigateur

Déploiement avec Docker

Le projet inclut une configuration Docker Compose permettant de démarrer rapidement l’application et MongoDB :

# Démarrer MongoDB
docker compose up -d mongodb

# Construire et démarrer l’application
docker compose up -d --build

Lors de l’utilisation de Docker, la chaîne de connexion MongoDB doit être :

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

Données et intégrations

API Finnhub

• Fournit la recherche d’actions, les profils d’entreprises et les actualités du marché
• La version gratuite peut renvoyer des données différées
• Attention aux limites de taux (rate limits)

TradingView

• Fournit des widgets intégrables : graphiques, cartes thermiques, cotations, etc.
• Les images externes proviennent de i.ibb.co

Better Auth + MongoDB

• Authentification par e-mail/mot de passe
• Adaptateur MongoDB pour le stockage des sessions
• La plupart des routes sont protégées, sauf celles de connexion/inscription

Workflows Inngest

• Événement de création d’utilisateur → e-mail de bienvenue personnalisé par IA
• Tâche planifiée (tous les jours à midi) → envoi d’un résumé d’actualités
• En développement local : npx inngest-cli@latest dev

Envoi d’e-mails (Nodemailer)

• Utilise Gmail comme transport
• Modèles disponibles pour les e-mails de bienvenue et les résumés d’actualités
• Recommandé en production : utiliser un service SMTP professionnel

Scripts disponibles

• pnpm dev – démarrer le serveur de développement (Turbopack)
• pnpm build – construire pour la production
• pnpm start – démarrer le serveur de production
• pnpm lint – exécuter ESLint
• pnpm test:db – vérifier la connexion à la base de données

Expérience développeur

• Mode strict TypeScript
• Tailwind CSS v4 (sans fichier de configuration séparé)
• Bibliothèque de composants shadcn/ui
• Panneau de commandes cmdk
• Changement de thème avec next-themes
• Icônes lucide-react

Manifeste d’Open Dev Society

Nous vivons dans un monde où la connaissance est cachée derrière des murs payants, où les outils sont verrouillés dans des abonnements, où l’information est déformée par des biais, et où les débutants entendent qu’ils « ne sont pas assez bons » pour créer.

Nos convictions :

• La technologie devrait appartenir à chacun
• La connaissance devrait être ouverte, gratuite et accessible
• La communauté devrait accueillir les débutants avec confiance, non avec des barrières

Notre mission :

• Créer des projets open source gratuits et véritablement utiles
• Offrir des outils accessibles aussi bien aux professionnels qu’aux étudiants
• Construire une plateforme de savoir où l’apprentissage est toujours gratuit
• Bâtir une communauté qui guide plutôt que de juger les débutants
• Mettre à disposition des ressources gérées sur la base de la confiance, non du profit

Nos engagements :

• Ne jamais enfermer la connaissance
• Ne jamais facturer l’accès
• Ne jamais échanger la confiance contre de l’argent
• Fonctionner grâce à la transparence, aux dons et à la force de la communauté

Guide de contribution

Toutes les contributions sont les bienvenues ! Que vous soyez étudiant, autodidacte ou ingénieur expérimenté.

• Discutez idées et bugs via les Issues
• Cherchez les problèmes marqués « good first issue » ou « help wanted »
• Gardez vos PR ciblées ; joignez des captures d’écran pour toute modification d’interface
• Soyez bienveillants, accompagnez les débutants, rejetez les barrières – telle est la voie d’ODS

Sécurité

En cas de découverte d’une vulnérabilité de sécurité :

• Ne créez pas d’Issue publique
• Envoyez un e-mail à : opendevsociety@cc.cc
• Nous coordonnerons une divulgation responsable et corrigerons rapidement

Licence

OpenStock est publié sous licence AGPL-3.0. Si vous modifiez, redistribuez ou déployez ce logiciel (y compris en tant que service web), vous devez publier votre code source sous la même licence et mentionner les auteurs originaux.

Remerciements

• Finnhub – pour des données de marché accessibles
• TradingView – pour des widgets de marché intégrables
• Communautés shadcn/ui, Radix UI, Tailwind CSS, Next.js
• Inngest – pour des tâches et workflows backend fiables
• Better Auth – pour une authentification simple et sécurisée
• Tous les contributeurs ayant rendu possible ces outils open source

Un remerciement particulier à Adrian Hajdin (JavaScript Mastery), dont l’excellent tutoriel sur les applications boursières a grandement aidé Open Dev Society à concevoir OpenStock.

Construit dans l’ouverture, pour tout le monde, gratuitement et pour toujours. — Open Dev Society

URL du projet : https://github.com/Open-Dev-Society/OpenStock