Author: Merlin C.

Tutoriels

Gestionnaires de mots de passe : la solution ultime…

Si vous lisez ceci, c’est que vous comprenez très probablement déjà le problème majeur avec les mots de passe. En effet, choisir un mot de passe à la fois robuste et facile à retenir n’est pas toujours évident.

Pour pallier à ce problème, un service existe : les gestionnaires de mots de passe. Vous abandonnerez l’option « Mot de passe oublié » définitivement et n’aurez plus à vous reprocher d’utiliser le même mot de passe sur des sites différents ! Ces coffres-forts numériques vous permettront de stocker tous vos mots de passe dans un seul et unique endroit et vous libéreront le cerveau de nombreux problèmes. Certains services proposent des niveaux de sécurité supplémentaires tels que l’authentification à deux facteurs qui permettra d’assurer une sécurité optimale à vos comptes.

Si laisser vos mots de passe entre les mains d’une application dont vous n’avez jamais entendu parler, rassurez-vous. Vos données et mots de passe ne peuvent être déchiffrées qu’avec un mot de passe dit « maître » que vous aurez défini préalablement, ce qui signifie que vous seul y avez accès, et non le développeur de l’application.

De nombreux services propose le déverrouillage par lecteur d’empreintes digitales ou reconnaissance faciale via votre téléphone ou PC, ce qui vous évite d’avoir à saisir le mot de passe principal. Vous ne devez cependant pas l’oublier, auquel cas vous perdriez l’accès à vos identifiants.

L’avantage d’un gestionnaire de mots de passe par rapport à un navigateur Web qui stocke les identifiants est qu’il fonctionne généralement sur tous les appareils et navigateurs Web, ce qui vous permet d’accéder à vos identifiants sur tous vos appareils. De plus, les mots de passe stockés sur votre navigateur sont souvent très simple à récupérer, notamment si un pirate possède un accès à votre machine.

Tout comme la majorité des navigateurs, les gestionnaires de mots de passe possède une fonction de remplissage automatique, ce qui vous évite d’avoir à entrer vos mots de passe à chaque reconnexion.

Quel gestionnaire de mots de passe choisir ?

Il existe de type de gestionnaires de mots de passe, certains sont des logiciels dit « propriétaires », d’autres sont « libres ». Les gestionnaires de mots de passe « libres » sont généralement plus appréciés par les adeptes de cybersécurité car les utilisateurs peuvent vérifier que leurs données sont correctement protégés.

Liste non exhaustive de gestionnaires de mot de passe libres :

Liste non exhaustive de gestionnaires de mot de passe propriétaires :

Vous pouvez retrouver ici, une liste de gestionnaires de mot de passe indiquant et comparant leurs principales fonctionnalités.

Illustration de l’article par vectorjuice / Freepik

Tutoriels

Comment héberger une page web gratuitement avec Cloudflare ?

Trouver un hébergeur de site web est une étape primordiale pour rendre votre site accessible sur Internet. Cela permet de le mettre en ligne de façon publique et permet aux visiteurs de pouvoir y accéder n’importe où et n’importe quand. En effet, un hébergeur va vous permettre de rendre votre site accessible 24h/24 ! Dans ce tutoriel, vous découvrirez comment héberger votre site, de façon totalement gratuite, grâce à CloudFlare Pages !

Cloudflare Pages, c’est quoi ?

Cloudflare est un de package de solutions pour les sites Web. Il agit autant en matière de sécurité que de performance. Néanmoins, les services de Cloudflare se diversifient de plus en plus ! Dans ce tutoriel par exemple, nous allons utiliser le service Cloudflare Pages. Cloudflare Pages va ici nous permettre de mettre en ligne notre site web. A noter que Cloudflare Pages ne supporte que les pages web HTML statique (ceci incluant les pages faites à partir de Framework JavaScript).

Héberger son site

Pour commencer, inscrivez-vous sur le site de Cloudflare. Une fois inscrit(e), vous serez automatiquement redirigé(e) vers la page d’ajout de site. Si vous n’avez pas encore de domaine, Cloudflare propose depuis peu l’enregistrement de domaine directement depuis sa plateforme. Cette étape est facultative sachant que Cloudflare Pages propose un sous-domaine gratuit (exemple.pages.dev). Une fois sur la page ci-dessous, cliquez sur l’onglet Pages du menu latéral.

Page d'accueil du tableau de bord Cloudflare

Une fois sur l’onglet Pages du tableau de bord, cliquez sur Create a project afin de démarrer la procédure.

Onglet Pages du tableau de bord Cloudflare

Vous aurez ici le choix entre 3 possibilités pour importer votre site web :

  • Importation via Git (GitHub ou GitLab)
  • Importation directe des fichiers du site (ZIP)
  • Importation via interface de ligne de commande (CLI)

Nous allons dans ce tutoriel utiliser l’importation via fichier .zip, mais la documentation du site peut vous aider à réaliser la manipulation via les autres méthodes proposées.

Page de sélection d'importation de site Cloudflare Pages

Avant de pouvoir téléverser les fichiers de votre site web, vous allez devoir choisir un nom pour votre projet. A noter que ce nom sera utilisé comme sous-domaine par défaut pour votre site.

Choix du nom et création du projet Cloudflare Pages

Une fois avoir choisi le nom que vous souhaitez, vous pouvez dès à présent téléverser les fichiers de votre site web, via un dossier ou un fichier .zip compressé.

Téléversement de fichiers sur Cloudflare Pages

Les fichiers de votre site web sont désormais téléversés.

Vous pouvez dès à présent déployer votre site web !

Pour accéder à votre site, rendez-vous sur la page dont vous avez choisi le nom précédemment à travers le processus de déploiement Cloudflare Pages. Dans le cas présent, il s’agit de la page NSI42.pages.dev.

Et voilà ! Vous savez désormais comment héberger une page web gratuitement avec Cloudflare.

Pour ceux qui veulent aller plus loin, nous allons désormais apprendre à connecter notre site à un nom de domaine personnalisé !

BONUS : Mise en place d’un nom de domaine personnalisé

Pour profiter d’un nom de domaine personnalisé pour votre site, il va tout d’abord vous falloir vous en procurer un. Depuis peu, Cloudflare propose des offres d’enregistrement de noms de domaine. Une fois votre domaine enregistré et ajouté sur Cloudflare, rendez-vous sur l’onglet Custom domains depuis votre espace Cloudflare Pages.

Une fois sur l’onglet, cliquez sur sur le bouton ci-dessous.

Vous pouvez dès à présent entrer votre nom de domaine personnalisé que vous vous êtes procuré précédemment.

Une fois le nom de domaine ajouté, vous devez configurer vos enregistrements DNS afin de faire pointer celui-ci vers le sous-domaine Cloudflare de votre site. Pour se faire, recopiez la configuration suivante.

Une fois le nom de domaine ajouté, vous pourrez désormais y accéder via votre domaine personnalisé !

Et voilà ! Vous savez désormais héberger une page web gratuitement avec un nom de domaine personnalisé grâce à Cloudflare Pages.

cloudflare-logo Tutoriels

Sécuriser son site avec un certificat SSL avec CloudFlare.

  • par

Sécuriser son site contre le piratage est indispensable de nos jours. Notamment afin de protéger ses utilisateurs de différents types attaques (Ex : MAN IN THE MIDDLE [MITM], qui consiste à interférer les données échangées entre le client et le serveur).

Ce tutoriel va vous apprendre à installer un certificat SSL (chiffrement des données transmises au site) grâce au service CloudFlare (sur un serveur Web sous PLESK).

Découverte de CloudFlare

CloudFlare est une entreprise américaine qui propose un réseau de distribution de contenu (ou CDN), des services de sécurité Internet et des services distribués de serveur de noms de domaine, entre le visiteur et le fournisseur de services d’hébergement de l’utilisateur de CloudFlare ; le système fonctionne comme un serveur proxy inversé pour les sites Web.

(Source : Wikipedia)

Ajout du nom de domaine à CloudFlare

Dans ce tutoriel, nous allons utiliser le nom de domaine tutoriel-cloudflare.site.

Pour commencer, inscrivez-vous sur le site de CloudFlare. Une fois inscrit(e), vous serez automatiquement redirigé(e) vers la page d’ajout de site. Si vous n’avez pas encore de domaine, CloudFlare propose depuis peu l’enregistrement de domaine directement depuis sa plateforme.

Ajout de son site sur CloudFlare

N.B : Si vous venez d’enregistrer votre domaine, il se peut qu’il faille attendre quelques minutes avant la confirmation de celui-ci.

Erreur : votre domaine n’est pas enregistré

Une fois ajouté, il vous faudra choisir une offre. Dans notre cas, l’offre gratuite suffira amplement à suivre le tutoriel.

Choisir son offre CloudFlare

Une fois votre offre sélectionnée, CloudFlare va vous proposer de gérer vos DNS actuellement enregistrés. Si vous venez d’enregistrer votre domaine, votre service d’enregistrement de domaine a probablement dû ajouter des DNS par défaut, je vous conseille donc de tous les retirer à l’aide de l’option « Delete« .

Zone DNS CloudFlare

L’étape suivante va être de modifier les serveurs de nom de votre domaine. Si vous ne savez pas comment faire, je vous conseille de taper « Namecheap change nameserver » (en remplaçant les termes en italique par votre fournisseur de domaine).

CloudFlare : changer ses serveurs de nom

Ajouter votre domaine à Plesk

Une fois votre domaine ajouté à CloudFlare, il va vous falloir ajouter celui-ci à Plesk (panel de gestion présumé de votre hébergeur web).

Plesk : ajouter votre domaine

Une fois le domaine ajouté sur Plesk, il va falloir faire pointer celui-ci vers l’IP de votre site. Pour ce faire, il faudra récupéré l’IP de votre site via Plesk. On peut la retrouver en bas des options de gestion de votre domaine (voir ci-dessous).

Plesk : trouver l’IP de son site

Une fois l’IP de votre site récupérée, rendez-vous sur l’onglet DNS de CloudFlare afin d’y ajouter les DNS suivant (en remplaçant tutoriel-cloudflare.site par votre domaine et 1.1.1.1 par l’IP de votre site) :

CloudFlare : Zone DNS

Installation d’un certificat SSL CloudFlare Origin

Nous allons désormais passer à l’installation d’un certificat SSL CloudFlare Origin qui va permettre un chiffrement de bout en bout lors de transferts de données entre vos utilisateurs et votre site.

Pour ce faire, il faut vous rendre dans l’onglet SSL/TLS de CloudFlare afin d’activer le mode d’encryptage complet et strict. Une fois activé, rendez vous dans l’onglet Origin Server afin de générer le certificat requis à installer sur Plesk.

Afin de procéder à la configuration du certificat, cliquez simplement sur le bouton prévu à cet effet (voir ci-dessous).

Procédez ensuite à la création du certificat en conservant les paramètres de configuration par défaut.

Une fois le certificat créé, vous aurez désormais en votre possession le certificat Origin, ainsi que la clé privée. Je vous invite à conserver ces documents précieusement car aucune copie ne pourra être récupérable par la suite.

Une fois noté, rendez-vous sur Plesk afin d’y ajouter le certificat que vous venez de générer.

Remplissez ensuite les informations demandées avant d’insérer le certificat et la clé privée générés précédemment.

Vous aurez ensuite besoin du certificat CloudFlare Origin RSA, celui-ci est disponible dans la documentation CloudFlare. Vous pouvez également le copier depuis ICI.

Une fois les 3 champs remplis, vous pouvez désormais charger le certificat.

Une fois le certificat installé, commencez par sécuriser la messagerie (voir ci-dessous).

Rendez-vous ensuite dans les paramètres d’hébergement de votre site afin d’activer le certificat SSL.

Sélectionnez le certificat précédemment ajouté puis confirmer les changements.

Et voilà ! Votre site est désormais chiffré de bout en bout par le protocole HTTPS en SSL/TLS.

Gameplay SardJump Projets

SardJump un DoodleJump en python

DoodleJump est un jeu intemporel datant d’une dizaine d’années. Sardoche est un streamer professionnel. On a décidé de relier les deux en un seul et unique jeu extraordinaire.

Introduction

La création du jeu se fait en trois grandes étapes :

  1. Création de la fenêtre
  2. Création des objets
  3. Lancement du jeu

Création de la fenêtre

Initialisation des modules et du jeu

import pygame
from pygame.locals import *
import sys
import random

WHITE = (255, 255, 255)

class SardJump (object):
    def __init__(self):
      return

On importe le module pygame ainsi que d’autres modules basiques tels que random et sys, puis on défini la class SardJump dans laquelle on définira les fonctions.

Création de la fenêtre et choix des dimensions. 

 def __init__(self):
        self.screen = pygame.display.set_mode((800, 600))
 def run(self):
        global score
        clock = pygame.time.Clock()
        self.generatePlatforms()
        while True:
            self.screen.fill(WHITE)
            self.screen.blit(self.background,(0,0))
            FONT = pygame.font.Font('assets/fonts/Optimus.otf', 30)
            text = FONT.render("Score : " + str(score),False,(255,255,255)).convert_alpha()
            clock.tick(60)

            for event in pygame.event.get():
                if event.type == QUIT:
                    sys.exit()

On gère l’affichage et la taille de l’écran avec « self.screen = pygame.display.set_mode((800, 600)) », on gère ce qui est affiché tant que l’écran et actif et on utilise la fonction « pygame.event.get() » pour fermer l’écran.

Création des objets

Charger les images dans le jeu

def __init__(self):
        pygame.font.init()
        self.screen = pygame.display.set_mode((800, 600))
        self.playerRight_1 = pygame.image.load("assets/right_1.png").convert_alpha()
        self.playerRight = pygame.image.load("assets/right.png").convert_alpha()
        self.playerLeft = pygame.image.load("assets/left.png").convert_alpha()
        self.playerLeft_1 = pygame.image.load("assets/left_1.png").convert_alpha()
        self.plateform = pygame.image.load("assets/plateform.png").convert_alpha()
        self.background = pygame.image.load("assets/bg.png").convert()

Tout d’abord, pour commencer on importe les images en indiquant leur chemin d’accès.

Définition des variables nécessaires au bon fonctionnement du jeu

        self.cameray = 0
        self.playerx = 400
        self.playery = 400
        self.xmovement = 0
        self.jump = 0
        self.direction = 0
        self.gravity = 0
        
        self.platforms = [[400, 500]]
        self.score = 0

On crée dans la fonction __init__ les variables nécessaires au fonctionnement du jeu, donc, le suivi de la caméra, les positions du joueur, les sauts automatiques, la gravité, la position des plateformes et enfin le score.

Système de mouvement.

def updatePlayer(self):
        global score
        if self.playerx > 850:
            self.playerx = -50
        elif self.playerx < -50:
            self.playerx = 850
        self.playerx += self.xmovement
        if self.playery - self.cameray <= 200:
            self.cameray -= 10

On crée la fonction « updatePlayer(self) » dans laquelle seront mises toutes les modifications sur le personnage comme la téléportation de droite à gauche.

key = pygame.key.get_pressed()
        if key[K_RIGHT]:
            if self.xmovement < 10:
                self.xmovement += 1
                self.direction = 0
        elif key[K_LEFT]:
            if self.xmovement > -10:
                self.xmovement -= 1
                self.direction = 1

On attribue les touches droite et gauche aux mouvements du personnage.

if not self.jump:
            self.playery += self.gravity
            self.gravity += 1
        elif self.jump:
            self.playery -= self.jump
            self.jump -= 1

Cette partie de la fonction updatePlayer(self) permet de créer une gravité donc lorsque le personnage ne saute pas il tombe, mais le problème et qu’il faut qu’il y ai un point de collision pour sauter dessus. C’est la qu’on va créer les fonctions en lien avec les plateformes.

Création des plateformes

def generatePlatforms(self):
y = 700
        while y > -100:
            x = random.randint(0, 900)
            self.platforms.append((x, y))
            y -= 50

def drawPlatforms(self):
        for plat in self.platforms:
            regenerate = self.platforms[1][1] - self.cameray
            if regenerate > 600:
                self.platforms.append(
                    (random.randint(0, 700), self.platforms[-1][1] - 50))
                self.platforms.pop(0)
            self.screen.blit(
                    self.plateform, (plat[0], plat[1] - self.cameray))

On génère aléatoirement les plateformes avant de les afficher.

def updatePlatforms(self):
        for p in self.platforms:
            rect = pygame.Rect( p[0], p[1], self.plateform.get_width() - 10, self.plateform.get_height())
            player = pygame.Rect(self.playerx, self.playery, self.playerRight.get_width() - 10, self.playerRight.get_height())
            if rect.colliderect(player) and self.gravity and self.playery < (p[1] - self . cameray):
                self.jump = 15
                self.gravity = 0

On crée un effet collision avec le personnage et les plateformes qui lui permettra de sauter dessus sans tomber.

Système de score et mort

        if self.playery - self.cameray <= 200:
            self.cameray -= 10
            score += 1

Le score est calculé en fonction de l’avancement dans la partie. Lorsque la caméra monte, le score augmente également.

            FONT = pygame.font.Font('assets/fonts/Optimus.otf', 30)
            text = FONT.render("Score : " + str(score),False,(255,255,255)).convert_alpha()
    		
      		self.screen.blit(text, (550, 50))

On crée le texte du score dans la boucle du jeu et on ne l’affiche qu’après la création et l’affichage des autres éléments (fond, plateformes et personnage) afin que celui-ci soit au premier plan.

Lancement du jeu

self.drawPlatforms()
self.updatePlatforms()
self.updatePlayer()
self.screen.blit(text, (550, 50))
pygame.display.flip()
pygame.display.set_caption("SardJump")

On appelle toutes les fonctions dans la fonction run puis on lance le jeu avec SardJump().run().

Conclusion 

Pour pouvoir jouer à cette version du jeu SardJump, téléchargez le code par l’intermédiaire du lien ci-dessous. Les commandes sont assez intuitives : les flèches gauche/droite pour se déplacer, et les flèches haut/bas pour changer de skin de plateforme. Les paliers de skins de personnage sont à 1.000 et 10.000 points.
Amusez-vous bien !

SardJumpTélécharger SardJump 1.0 Alpha