Configurer un serveur VPS

Découvre comment configurer un VPS sécurisé avec Docker pour héberger ton application React Router 7. Guide simple et complet pour un hébergement performant.

4 min read
Déverrouillez votre potentiel

avec React Router 7

Vous en avez marre de...

❌ perdre du temps à chercher des informations éparpillées
❌ ne pas avoir de retour sur votre progression
Assistant IA spécialisé

Posez vos questions 24/7 à notre IA experte en React Router 7

Quiz interactifs

Validez vos acquis avec des quiz personnalisés et un feedback instantané

9 modules
53 leçons
Accès à vie
460.75€

Pourquoi un VPS et pas un PaaS ?

L’objectif de cette étape est simple : disposer d’une machine 100 % à toi pour exécuter Docker, PostgreSQL et autant d’applications React Router 7 que tu veux – le tout pour ± 7 €/mois. Contrairement à Vercel ou Netlify (excellents pour un seul projet), un VPS t’offre :

  • un processeur dédié (2 vCPU) et 8 Go de RAM ;
  • 100 Go de SSD pour plusieurs bases et conteneurs ;
  • la liberté d’héberger un SMTP ou un cron sans surcoût.

C’est exactement ce que j’utilise pour le site d’Algomax et une dizaine de side-projects.

1 • Commander le serveur

  1. Va sur hostinger.com → Services → Hébergement VPS.
  2. Choisis le plan KVM 2 (2 vCPU / 8 Go RAM / 100 Go SSD).
  3. Clique sur « Installer » et suis le guide.

Options retenues

ÉtapeChoix
EmplacementFrance (latence minimale pour les visiteurs FR)
OSUbuntu 24.04 (la doc Docker est la plus complète)
Scanner de logicielsdésactivé (inutile + économie de RAM)
Mot de passe rootgénéré dans Bitwarden, mais on ne l’utilisera presque plus

2 • Créer un utilisateur non-root

On évite de se connecter en root : trop risqué.

Terminal
1
# connexion initiale en root

2
ssh root@<IP_VPS>

3


4
# ajoute un compte perso

5
adduser virgile

6
usermod -aG sudo virgile   # lui donner les privilèges admin

3 • Générer et installer une clé SSH

Terminal
1
# sur ta machine locale

2
ssh-keygen -t ed25519 -f ~/.ssh/hostinger -C "Mac Studio Algomax"

Laisse la passphrase vide ⇒ pas de mot de passe à chaque connexion.

Terminal
1
# toujours local

2
cat ~/.ssh/hostinger.pub
Terminal
1
# dans la session root du VPS

2
su - virgile

3
mkdir -p ~/.ssh

4
nano ~/.ssh/authorized_keys

Colle la clé, Ctrl + X, y, sortie.

La prochaine connexion se fera sans mot de passe.

4 • Mettre à jour Ubuntu

Terminal
1
sudo apt update -y

2
sudo apt full-upgrade -y   # kernel + libs

Redémarrage (optionnel) :

Terminal
1
sudo reboot

Reconnecte-toi :

Terminal
1
ssh virgile@<IP_VPS>

5 • Installer Docker + Docker Compose

install-docker.sh
1
curl -fsSL https://get.docker.com | sudo bash

2
sudo apt install docker-compose-plugin -y

Test rapide :

Terminal
1
docker run --rm hello-world

Donner l’accès à Docker à ton user

Terminal
1
sudo usermod -aG docker virgile

2
exit                    # quitte la session

3
ssh virgile@<IP_VPS>    # reconnecte-toi

4
docker ps               # plus de “permission denied”

6 • Vérifier la santé du serveur

Terminal
1
htop

Tu dois voir 2 cœurs, ~ 7 Go libres, 100 Go de disque.

7 • Sécuriser encore (optionnel mais conseillé)

  1. Édite sshd_config pour interdire root et le login par mot de passe.
    Terminal
    1
    sudo nano /etc/ssh/sshd_config

    2
    # …

    3
    PermitRootLogin no

    4
    PasswordAuthentication no
  2. Redémarre le service :sudo systemctl restart sshd.
  3. Teste dans un nouvel onglet :ssh virgile@<IP_VPS> – si ça marche, bravo, ton VPS n’accepte plus que ta clé.

8 • Check-list avant déploiement

✔︎État
🟢Accès SSH sans mot de passe (virgile)
🟢sudo fonctionne (mise à jour système)
🟢docker run hello-world passe
🟢docker ps sans sudo (groupe docker)
🟢Root et login par mot de passe désactivés (optionnel fort)

9 • Ce que nous venons de faire

  • Louer un VPS (Hostinger KVM 2)
  • Créer un utilisateur admin non-root
  • Installer une clé SSH pour les connexions automatiques
  • Mettre à jour Ubuntu, installer Docker & Compose
  • Tester le fonctionnement avec hello-world
  • Sécuriser la machine (login SSH + groupes)

10 • Et maintenant ?

Dans la prochaine leçon nous allons :

  1. écrire le Dockerfile de production pour React Router 7 + Prisma ;
  2. configurer Caddy en reverse-proxy HTTPS automatique ;
  3. lier le nom de domaine à l’adresse IP du VPS.

À tout de suite !

Premium
Quiz interactif
Testez vos connaissances et validez votre compréhension du module avec notre quiz interactif.
1

Comprendre les concepts fondamentaux

Quelle est la principale différence entre les composants client et serveur dans React ?

Les composants client s'exécutent uniquement dans le navigateur
Les composants serveur peuvent utiliser useState
Les composants client sont plus rapides
Il n'y a aucune différence significative
2

Optimisation des performances

Quelle technique est recommandée pour éviter les rendus inutiles dans React ?

Utiliser React.memo pour les composants fonctionnels
Ajouter plus d'états locaux
Éviter d'utiliser les props
Toujours utiliser les class components
3

Architecture des données

Quel hook permet de gérer les effets de bord dans un composant React ?

useEffect
useState
useMemo
useContext
4

Gestion des erreurs

Comment implémenter la gestion des erreurs pour les requêtes API dans React ?

Utiliser try/catch avec async/await
Ignorer les erreurs
Toujours afficher un message d'erreur
Rediriger l'utilisateur
5

Déploiement et CI/CD

Quelle est la meilleure pratique pour déployer une application React en production ?

Utiliser un service CI/CD comme GitHub Actions
Copier les fichiers manuellement via FTP
Envoyer le code source complet
Ne jamais mettre à jour l'application

Débloquez ce quiz et tous les autres contenus premium en achetant ce cours

Dans cette leçon