Aujourd'hui nous allons parler de Snapp! Une application qui permet de raccourcir des liens, l'interface est très simple d'utilisation et la prise en main est immédiate. C'est bien pensé! Vraiment.
Si vous souhaitez permettre à d'autre personnes d'utiliser votre instance Snapp, c'est tout à fait possible. Si non vous pouvez tout aussi bien empêcher les inscriptions.
Il y avait un petit souci au niveau du support du port 587 pour le SMTP et un souci de caractères dans le mot de passe, le dev est super réactif et a corrigé ça très rapidement, ce qui me permet de vous proposer son travail.
Merci à lui, en plus les échanges étaient vraiment très sympas!
⚡ Caractéristiques
- Interface utilisateur intuitive: Snapp offre une interface conviviale pour un raccourcissement facile des liens.
- Authentification sécurisée: profitez de sessions sécurisées pour votre utilisateur. Leurs informations sont protégées.
- Codes courts personnalisés: personnalisez vos codes courts pour rendre vos liens mémorables et faciles à partager.
- Dates d'expiration: gérez la durée de vie des liens avec les dates d'expiration. Vous pouvez définir des dates d'expiration pour plus de sécurité ou laisser les liens rester actifs indéfiniment.
- Liens secrets: améliorez la sécurité avec des liens secrets, vous permettant de partager avec un public sélectionné à l'aide de secrets uniques.
- Analyses d'utilisation: accédez à des analyses détaillées et anonymes pour vos liens.
- Snapp fournit des informations sur les engagements de liens.
- Métriques étendues: intégrez Snapp à votre Umami Analytics auto-hébergé ou basé sur le cloud pour des métriques avancées.
- Vérification de la réputation des URL: assurez la sécurité des liens grâce aux vérifications de la réputation de l'API VirusTotal.
- Langues: Disponible dans 6 langues, dont le français.
💾 L'installation
- Créez votre compose.yml dans le dossier ou vous comptez installer Snapp:
sudo nano compose.yml
- Collez ça dedans en prenant soin d'adapter ports et volumes suivant votre configuration:
version: '3.9'
services:
snapp:
image: uraniadev/snapp:latest
ports:
- 9999:3000
environment:
ADMIN_USERNAME: admin
ADMIN_EMAIL: zarev@belginux.com
ADMIN_PASSWORD: admin
DATABASE_MYSQL_URL: 'mysql://root:password@mariadb:3306/snappdb'
TOKEN_SECRET: hf1qB8PhqJK60B
ORIGIN: https://snapp.mondomaine.com
DATABASE_PROVIDER: mysql
depends_on:
mariadb:
condition: service_healthy
networks:
- snapp
mariadb:
image: mariadb:latest
environment:
MYSQL_ROOT_PASSWORD: password
MYSQL_DATABASE: snappdb
volumes:
- ./db:/var/lib/mysql
networks:
- snapp
healthcheck:
test: ['CMD', 'healthcheck.sh', '--su-mysql', '--connect', '--innodb_initialized']
start_period: 1m
start_interval: 10s
interval: 1m
timeout: 5s
retries: 3
networks:
snapp:
external: false
Veillez à changer:
- ADMIN_USERNAME: admin => Remplacez admin par votre nom d'utilisateur.
- ADMIN_EMAIL: zarev@belginux.com => Remplacez zarev@belginux.com par votre adresse e-mail.
- ADMIN_PASSWORD: admin => Remplacez admin par un mot de passe fort.
- DATABASE_MYSQL_URL: 'mysql://root:password@mariadb:3306/snappdb' => Remplacez password par un mot de passe en évitant les caractères spéciaux.
- TOKEN_SECRET: hf1qB8PhqJK60B => Il va falloir remplacer hf1qB8PhqJK60B par un token que vous allez générer avec cette commande:
openssl rand -base64 32
Ce qui donne:
Collez le token obtenu à la place de hf1qB8PhqJK60B.
- ORIGIN: https://snapp.mondomaine.com => Remplacez https://snapp.mondomaine.com par votre domaine complet.
- MYSQL_ROOT_PASSWORD: password => Remplacez password par le mot de passe choisi précédemment.
On va déployer l'application:
docker-compose up -d
ou avec docker-compose V2:
docker compose up -d
Rendez-vous sur votre domaine/sous-domaine:
https://snapp.mondomaine.com
👤 Connexion avec le compte administrateur
Lorsque vous lancez Snapp pour la première fois, connectez-vous avec le compte administrateur que vous avez choisi en cliquant sur AUTH, en bas à gauche de la page Web:
Vous arriverez sur ce formulaire:
- Nom d'utilisateur => Entrez le nom d'utilisateur que vous avez choisi plus haut.
- Mot de passe => Entrez le mot de passe que vous avez choisi plus haut.
Cliquez sur Se connecter pour terminer.
🇮🇹🇧🇪 Changer la langue
Vous avez le loisir de changer la langue de votre instance Snapp facilement.
Cliquez sur SETTINGS:
Ensuite rendez-vous ici:
- Theme => Choisissez le mode sombre ou clair.
- Language => Choisissez la langue souhaitée.
🔗 Créer un lien raccourci
Cliquez sut TABLEAU dans le menu de gauche:
Cliquez sur + Raccourcir une URL:
Ce formulaire va apparaître:
- URL originale => Indiquez l'URL d'origine que vous voulez raccourcir.
- Shortcode => Indiquez un code court, qui sera placé juste après l'URL de votre instance snapp. Si votre instance est https://snapp.mondomaine.com, le code court, imaginons, bel, sera indiqué comme ça: https://snapp.mondomaine.com/bel.
- Définir un secret => Si vous souhaitez protéger votre lien par un mot de passe, cochez cette option et configurez le mot de passe.
- Définir une expiration => Définissez une date d'expiration en cochant cette option.
- Usage limité => Définissez combien de fois le lien peut-être utilisé avant expiration.
- Notes => Si vous souhaitez ajouter une note à votre lien.
Lorsque vous êtes satisfait, cliquez sur Enregistrer:
Ce qui donne:
Si vous avez défini un secret:
Lorsque vous cliquez sur le lien raccourci dans l'interface de Snapp:
Vous avez accès à ceci:
- Visites => Retrouvez ici les statistiques des visites de votre lien.
- QR Code => Partagez votre lien par QR Code.
- Modifier le Snapp => Permet d'éditer votre lien avec tous les paramètres qui s'y rapportent.
Si vous modifier votre Snapp, n'oubliez pas d'enregistrer en cliquant sur Enregistrer, dans le fond de la page:
⚙️ Paramètres
Explorons un peu les paramètres qui ne sont pas forcément repris dans le reste du tutoriel.
Cliquez sur PARAM.:
Dans la partie Panneau d'administration:
- Activer les inscriptions => Si vous souhaitez que des utilisateurs puissent d'inscrire sur votre instance, cochez ce paramètre.
- Désactiver la page d'accueil => Si vous ne souhaitez pas activer le page d'accueil, cochez ce paramètre.
- Autoriser HTTP non sécurisé => Si vraiment vous voulez autoriser le HTTP.
- Activer les limites => Activez ou non la limite API.
Nul besoin de valider vos choix dans cette partie, c'est en auto-save, après avoir validé un choix, il est automatiquement sauvé.
📧 Configurer le serveur mail
Si vous avez votre propre serveur mail, vous connaissez déjà les informations de celui-ci qu'il faudra indiquer plus bas.
Si vous n'avez pas votre propre serveur mail il est possible d'utiliser ceux de Gmail, Outlook, Informaniak,.. Je vous invite à lire l'article suivant pour avoir les informations nécessaires:
Pour configurer votre serveur mail, cliquez sur PARAM.:
Descendez jusqu'à la partie Serveur SMTP:
- Serveur => Indiquez le host du serveur SMTP.
- Utilisateur => Indiquez votre adresse e-mail complète.
- De => Vous pouvez indiquez la même adresse mail que celle de votre utilisateur ou une adresse du style noreply@...
- Port => 587 de préférence.
- Mot de passe => Indiquez le mot de passe de votre adresse e-mail.
Cliquez sur Envoyer un e-mail de test pour vérifier le bon fonctionnement:
🔑 Modifier le mot de passe par e-mail
Rendez-vous sur PARAM.:
Cliquez sur 🔑 Récupérer le mot de passe:
Vous allez recevoir un e-mail comme ceci:
Cliquez sur Change my password, ce qui vous revoie vers le site:
- Mot de passe => Choisissez un nouveau mot de passe fort.
- Confirmer le mot de passe => Confirmez ce mot de passe.
Pour terminer, cliquez sur Récupérer le mot de passe. Cela vous renvoie vers votre instance:
👥 S'inscrire sur votre instance Snapp
Si vous n'avez pas désactivé la page d'accueil, l'utilisateur devra cliquer sur AUTH:
Ensuite il arrive sur le formulaire où il devra cliquer sur Signup page...
...pour entrer les informations souhaités de son compte utilisateur:
Il devra ensuite cliquer sur Sign up pour terminer. Le nouvel utilisateur sera redirigé vers l'instance.
Bien entendu vous pourrez attribuer un rôle à votre utilisateur en vous cliquant sur l'onglet UTIL.:
Ensuite cliquez sur le crayon dans la fiche de l'utilisateur concerné:
Dans la partie Rôle, choisissez le rôle :
Sans oublier d'enregistrer à la fin: