Création d’une application Web avec Python et React - Partie 1 (Backend)

Daouda Diallo
Code d'Ivoire
Published in
3 min readJul 12, 2018

Dans ce tutoriel nous allons mettre en place une application qui va nous permettre de lister et créer des étudiants.

Nous allons utiliser une architecture 3 tiers pour notre application:

BACKEND (REST API) : PYTHON — FLASK

BASE DE DONNEES : MYSQL

FRONTEND: REACT

BACKEND

OUTILS

MYSQL

SCHEMA BASE DE LA DONNEES

Ci-dessous le schéma de notre base de données, nous avons 3 tables t_matiere, t_etudiant et t_note.

CREATION BASE DE DONNEES

Nous allons utiliser PHPMYADMIN pour importer notre base de données:

http://localhost/phpmyadmin

TELECHARGER LA BASE DE DONNEES SUR GIT ET L’IMPORTER DANS PHPMYADMIN

Nous allons ensuite télécharger le schéma de notre base de données sur git (ci-dessous le lien du dépôt git) et l’importer dans phpmyadmin.

PYTHON

INSTALLATION

Pour installer PYTHON 3, cliquez sur le lien ci-dessous :

VERIFICATION

Pour vérifier que PYTHON est bien installé, tapez cette commande :

python --version

CREATION DU PROJET

Exécuter la commande ci-dessous pour créer le répertoire de notre projet PYTHON.

mkdir NoteProjetPython

INSTALLER LES DEPENDANCES

Ensuite nous allons installer les dépendances dont nous avons besoin :

Flask : Cette librairie sera utilisée pour exposer nos services web (rest api).

mysqlclient: Cette librairie va nous permette de communiquer avec notre base de données mysql.

python-docx: Cette librairie permet de générer un fichier word, nous l’utilisons pour générer les bulletins des étudiants.

pip3 install Flask mysqlclient python-docx

MISE EN PLACE DU MODULE ETUDIANT

Nous créons un fichier database.py.

C’est dans ce fichier que nous communiquons avec une base de données MYSQL.

La ligne 5 du code ci-dessous va nous permettre de nous connecter à notre base de données mysql.

Nous avons 2 méthodes :

getetudiants : Cette méthode ramène la liste de toutes les étudiants enregister dans notre base de données.

createetudiant: Cette méthode nous permet de créer un nouvel étudiant.

EXPOSITION DES SERVICES WEB — app.py

Ici nous avons 2 routes :

get: Nous utilisons la méthode getetudiants du fichier database.py pour ramener la liste des étudiants.

post: La méthode createetudiant du fichier database.py qui nous permet de créer un étudiant.

LANCER LE PROJET

Exécuter la commande ci-dessous pour lancer notre projet.

python app.py

STRUCTURE DU PROJET

TESTER LES SERVICES AVEC CURLS

Nous pouvons tester nos services grâce à CURL :

La première commande nous permet de tester le service récupération de tous les étudiants et la dernière permet la création d’étudiant.

curl -i -H “Accept: application/json” -H “Content-Type: application/json” -X GET http://localhost:5000/api/v1.0/etudiantcurl -X POST  -H "Accept: Application/json" -H "Content-Type: application/json" http://localhost:5000/api/v1.0/etudiant -d '{"matricule":"1234","nom":"test", "prenom": "test"}'

TESTER LES SERVICES AVEC POSTMAN

Nous pouvons aussi utiliser POSTMAN pour tester nos services , ci-dessous un exemple;

GITHUB

Lien GitHub du projet :

Après le clone du dépôt, vous devez exécuter les commandes ci-dessous :

python app.py

AMELIORATION

Créer les méthodes Update et Delete Etudiant.

--

--

Daouda Diallo
Code d'Ivoire

Software Engineer/ Objectif Libre Developer | Co-founder and CTO of @legafrik. I game e-sport, football, and open source #js #typescript #angular #node