Skip to content

Déploiement de l’Application SmartHub

Le déploiement est une étape cruciale pour mettre en ligne notre application. Il implique le frontend, le backend et la base de données, chacun sur des plateformes adaptées pour garantir performance, sécurité et scalabilité.

1. Déploiement du Frontend

Le frontend de SmartHub, écrit en React + TypeScript, a été déployé sur Vercel.

Étapes principales :

  1. Connexion au dépôt GitHub : Il suffit de lier le projet au dépôt officiel de votre application. Vercel détecte automatiquement le framework (React/TypeScript) et configure la build.
  2. Configuration des variables d’environnement (si nécessaire) : Par exemple pour les URLs du backend ou les clés publiques accessibles côté client. Vercel offre un panneau sécurisé pour gérer ces variables.
  3. Build et déploiement automatique : Après chaque push sur le dépôt GitHub, Vercel déclenche automatiquement la build et le déploiement. L’URL publique est générée et votre frontend est accessible immédiatement.

Avantages : Déploiement rapide, fiable, support natif pour React/TypeScript et prévisualisations automatiques pour chaque pull request.

2. Déploiement du Backend

Le backend, écrit en Java avec Spring Boot, est le cœur de notre application. Il a été déployé sur Render.

Étapes principales :

  1. Préparation de l’application : Tous les fichiers application.properties ou application.yml doivent être sécurisés. Les valeurs sensibles (clés API, mots de passe, URLs de base de données, tokens LLM) doivent être placées dans les variables d’environnement de Render et non en dur dans le code.

  2. Dockerisation du backend : Créez un Dockerfile pour packager votre application Spring Boot :

```dockerfile FROM openjdk:17-jdk-alpine VOLUME /tmp COPY target/smarthub-backend.jar smarthub-backend.jar ENTRYPOINT ["java","-jar","/smarthub-backend.jar"]

Déploiement sur Render

Créez un nouveau service Web sur Render et choisissez le déploiement via Docker.

Configurez les variables d’environnement essentielles (URL base de données, clés API, tokens LLM…).

Déclenchez le build et le déploiement.

Sécurité et performance

Toutes les clés et secrets doivent être appelés via System.getenv("NOM_VARIABLE").

Les paramètres comme le temps de réponse, le pool de connexions, et le nombre de threads sont configurés dans application.properties pour optimiser la performance.

Avantages : Backend sécurisé, scalable, performant et intégré au frontend et à la base de données.

3. Base de Données

La base de données est essentielle pour le fonctionnement de SmartHub.

PostgreSQL hébergé gratuitement sur Railway.

Railway offre : création automatique, URL et credentials sécurisés, sauvegardes automatiques et accès SQL direct.

Étapes :

Créez un projet sur Railway.

Configurez PostgreSQL et récupérez l’URL, le nom d’utilisateur et le mot de passe.

Ajoutez ces valeurs comme variables d’environnement dans Render pour le backend.

Testez la connexion depuis l’application Spring Boot.

Avantages : Base de données sécurisée, fiable et facile à relier au backend.

4. Architecture Finale du Déploiement

```text Frontend (React + TypeScript) ---> Vercel │ ▼ Backend (Spring Boot) ---> Render │ ▼ Base de données (PostgreSQL) ---> Railway

Le frontend communique avec le backend via API.

Le backend accède à la base de données pour stocker et récupérer les informations.

Toutes les clés sensibles sont sécurisées dans les variables d’environnement.

5. Avantages du Déploiement

Scalable : Chaque composant peut évoluer indépendamment.

Maintenable : Architecture claire et modulable.

Performance optimisée : Paramètres de Spring Boot et Vercel ajustés pour des temps de réponse rapides.

Sécurité : Secrets et clés protégés via variables d’environnement.

Automatisation : Déploiement continu via GitHub, Vercel et Render.

✨ Conclusion Finale

Le déploiement de SmartHub démontre la solidité et la modernité de notre architecture :

Un frontend performant et moderne sur Vercel.

Un backend sécurisé et scalable sur Render.

Une base de données fiable et automatique sur Railway.

Votre application est maintenant entièrement opérationnelle, prête à évoluer, à être testée et à être améliorée.

Félicitations ! Vous venez de clôturer le projet SmartHub avec succès. 🎓

Vous pouvez désormais explorer, tester et ajouter de nouvelles fonctionnalités :

Création de modèles IA pour recommandations de cours.

Amélioration du moteur de recherche intelligent via NLP.

Intégration d’un chatbot interactif pour assister les étudiants.

Le projet SmartHub est maintenant prêt pour une exploitation complète et des évolutions futures.

Bonne continuation dans votre quête de savoir et dans le développement de solutions innovantes !

Technologies Utilisées

Démos du projet

Vous pouvez découvrir le projet via plusieurs ressources :