Déploiement d'applications Full-Stack sur une infrastructure gratuite

Nous avons construit un système de gestion de l'apprentissage (LMS) pour G3HUB. La stack : React 18, Node.js 20 et PostgreSQL 15.

Nous n'avions pas de VPS. Nous n'avions pas de budget cloud. Nous n'avions qu'un compte d'hébergement mutualisé cPanel et une échéance.

La plupart des tutoriels partent du principe que vous avez un serveur dédié. Nous avons dû trouver un moyen de faire communiquer différents services entre eux pour 0 $ par mois.

L'Architecture

• Frontend : React + Vite (hébergé sur cPanel) • Backend : Node.js + Express (hébergé sur le forfait gratuit de Render) • Base de données : PostgreSQL (hébergée sur le forfait gratuit de Supabase)

Les Obstacles et les Solutions

1. L'hébergement mutualisé bloque les bases de données Nous avons essayé d'exécuter l'API Node.js sur cPanel. Cela a échoué car l'hébergeur bloquait les connexions sortantes vers PostgreSQL sur le port 5432. Solution : Déplacer l'API vers Render. Render autorise ces connexions.

2. Erreurs de déploiement de monorepo Render ne parvenait pas à comprendre nos dépendances de workspace pnpm comme @workspace/db. Solution : Nous avons utilisé esbuild pour tout regrouper dans un seul fichier de 6,4 Mo. Nous avons ensuite utilisé un package.json minimal ne contenant que les dépendances externes. Cela a rendu l'API autonome.

3. Le problème de CORS et de proxy Le module Apache mod_proxy sur l'hébergement mutualisé était restreint. Nous ne pouvions pas facilement rediriger les appels API du frontend vers Render. Solution : Nous avons utilisé un proxy cURL en PHP. Le frontend appelle le script PHP local. Le script PHP transmet la requête à Render. Cela permet de contourner les problèmes de CORS et les restrictions de pare-feu.

4. Erreurs de certificat SSL Le gestionnaire de pool de connexions (connection pooler) de Supabase a causé des erreurs SSL dans Node.js. Solution : Nous avons défini la variable d'environnement NODE_TLS_REJECT_UNAUTHORIZED=0.

Répartition des coûts

• cPanel : 0 $ (Existant) • Render : 0 $ (Forfait gratuit) • Supabase : 0 $ (Forfait gratuit) • Total : 0 $/mois

Points clés pour les ingénieurs

  • Testez la connectivité sortante tôt. Vérifiez si votre serveur peut réellement communiquer avec votre base de données avant d'écrire le code.
  • Utilisez esbuild pour les monorepos. Un seul fichier bundle est bien plus facile à déployer qu'une structure de dossiers complexe.
  • Utilisez UptimeRobot. Le forfait gratuit de Render s'endort après 15 minutes. Un simple ping permet de le maintenir actif.
  • Évitez les caractères spéciaux dans les mots de passe de base de données. L'utilisation de @ ou ! dans une chaîne de connexion provoque d'interminables problèmes d'encodage d'URL.

Si vous en avez les moyens, achetez un VPS à 5 $. Cela lève tous ces obstacles. Mais si vous avez 0 $, un routage créatif rend les applications de production possibles.

Source : https://dev.to/oyohedmond/deploying-a-full-stack-lms-on-shared-hosting-render-free-the-hard-way-4ke0

Communauté d'apprentissage optionnelle : https://t.me/GyaanSetuAi