J’ai commencé à utiliser w3c validator.
J’ai appris :
`<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, shrink-to-fit=no, user-scalable=0" />`
Le user-scalable=0
et le maximum-scale=1.0
empêche l’utilisateur de zoomer la page or certains utilisateurs ont besoin de zoomer. C’est une norme d’accessibilité. Selon Olivier les deux choses importantes c’est width=device-width
et initial-scale=1.0
. Et user-scalable=0
c’est clairement à éviter. C’était à la mode pour faire genre t’es dans une appli mais pas sur le web. Or c’est une très mauvaise pratique.
DOCTYPE
est d’activer le mode standard total. Les anciennes versions du standard HTML donnaient une sémantique plus riche au DOCTYPE mais aucun navigateur n’a utilisé le DOCTYPE pour autre chose que pour choisir entre le mode quirks et l’un des modes standards.J’ai lu un article sur les OOCSS (Objet oriented CSS) et un autre.
J’ai commencé à suivre un cours sur les API.
Je participe au Webinar du Wagon sur les APIs.
It’s an interface, used by programs, to interact with an application.
Pour faire une métaphore. Dans un restaurant pour commander de la nourriture on passe par le serveur (l’interface) pour avoir notre repas. On ne cuisine pas son propre repas.
Pour commander on regarde le menu (la documentation de l’API) et le prix (free/or not).
curl
= keyword to say we want to launch the url that follow.json
= data type given back by apisxml
= an other data typeun site où on peut chercher des APIs
### Exemple avec MapBox API.
[Mapbox API](https://www.mapbox.com/)
search in the documentation what we want to do : geocoding (How translate adress into gps coordinates). Geocoding : Airnbnb contact the api given the adress and saying please give me the gps coordinates.
the API does `forward geocoding`.
### Exemple avec Twilio API
compagny proposing an api which send text message to someone (used by uber)
### Exemple avec Stripe API
allows you to have a payement system on your website.
Webhooks is an event which triggers a bit of code.
You are cooking in your kitchen. How do you your visitor are here? You install a doorbell. Each time a guest arrived the doorbell rings.
The doorbell is the webhook.
Everytime a user does a purchasse on your plateform your receive an email sying a user bying something on our plateform.
Each time a payement is made stripe stocks the informations of the custumers
capture lead informations and push
Typeform : create a form
Trello create board with list. in each list we can add card. We can do 3 list : - to do - work in progress - done
Zapier = it’s a middleware.
J’ai lu un article sur les unités Viewport en CSS.
J’ai avancé le site de Clément.
J’ai commencé à débrousailler le terrain pour l’hébergement Web du site sur OVH, l’offre KimSufi Web est suffisante pour un site vitrine. On aura 1Go pour stocker l’ensemble du site + 100Mo pour stocker toutes les informations du formulaire dans la base de données.
Pour commencer j’ai mis le site en ligne avec GitHub Pages. ça a permi de répérer certains bugs noramment d’affichage sur smartphone.
J’ai utilisé le W3C validator et répéré plusieurs bug du fichier SVG sur la page index.html notamment des id duplicate.
J’ai commencé l’installation de Python, Django et Pip pour l’atelier DjangoGirls et j’ai mis en place la venv (virtual environnement. Sorte de virtual box mais qui ne charge pas tout un système d’explotation.)
J’ai continué de travailler le responsive du site de Clément.
Participation à l’atelier DjangoGirls Paris pour s’initier au langage Python avec le framework Django.
J’ai continué le Tutoriel DjangoGirls :
J’ai appris à utiliser Git en ligne de commande :
git init
$ git config --global user.name "Your Name"
$ git config --global user.email you@example.com
git status
git add --all .
git commit -m "mon commit"
$ git remote add origin https://github.com/<your-github-username>/my-first-blog.git
git push -u origin master
Participation à l’atelier DjangoGirls Paris pour s’initier au langage Python avec le framework Django.
Je continue le Tutoriel DjangoGirls :
Début du cours de PHP avec Nicolas Hennette! 🎉
travail sur :
- `<?php echo 'Hello world'; ?>`
- `<?php include "accueil.php"; ?>`
- `<?php
$addition = $entier + 5;
$multiplication = $entier * $decimal;
$division = $entier / 3;
$soustraction = $entier - 21;
$modulo = 7 % 2;
?>`
- `echo gettype($ma_variable);
18h/21h45 atelier DjangoGirls session2 : approfondissement du tutoriel et questions à Raphaël.
Cours de Php
La concaténation :
$rue = "6 rue Sauffroy";
$cp = "75017";
$ville = "Paris";
$adresse_espace_1 = $rue . " " . $cp . " " . $ville;
Travail sur les templates, include, config et url.
Cours de Php
Exercice sur les fonctions liées aux chaînes de caractères. Utilisation du manuel officiel Php.
- `strlen` calcule le nombre de caractère dans ma chaine (la taille d'une chaine)
- `str_replace` la fonction qui permet de remplacer le mot "dolor" dans la chaine par le mot "porte"
- `str_shuffle` la fonction qui mélange les lettres d'une chaine
- `strrev` inverse la chaine (la premiere lettre de la chaine se retrouve à la fin)
- `strpos` retourner la place du mot "elit" dans une chaine
- `strip_tags` effacer les tags HTML de ma chaine
- `strtoupper` mettre la chaine en majuscule
- `substr` Récupérer seulement les 10 premiers caractères de ma chaine
- `substr` Récupérer seulement les 10 dernier caractères de ma chaine
- `trim` effacer les espaces en début et en fin de chaine
les constantes :
- define('TEMPERATURE_EBULLITION_EAU',100);
// on écrit (par convention) les constantes en majuscule. On peut notamment écrire l’url du site avec define
plutôt qu’en tant que variable car l’url ne doit pas changer selon les pages du site.
if/else
, switch
, &&
(and) et ||
(or)`<?php
$fruit = "amande";
switch ($fruit) {
case 'kiwi' :
case 'banane' :
echo 'J\'aime les fruits exotiques <br>';
break; // obligatoire pour sortir du switch
case 'pomme' :
case 'poire' :
echo 'J\'aime les fruits classiques <br>';
break;
case 'amande' :
echo 'J\'aime les graines <br>';
break;
default : // cas par défaut : aucun des précédents cas n'a été validé.
echo 'J\'ai l\'impression que je n\'aime pas trop les fruits<br>';
break;
}
?>`
EXO : réécrire le dernier switch avec des if / else pour avoir le même résultat
`<?php
$fruit = "amande";
if ($fruit == 'kiwi' || $fruit == 'banane') {
echo 'J\'aime les fruits exotiques';
}
else if ($fruit == 'pomme' || $fruit == 'poire') {
echo 'J\'aime les fruits classiques';
}
else if ($fruit == 'amande') {
echo 'J\'aime les graines';
}
else {
echo 'J\'ai l\'impression que je n\'aime pas trop les fruits';
}
?>`
Cours de Php
Travail sur les fonctions
Cours PHP
Cours grid css avec Laila
Cours Git “faire une pull request avec Laila :
J’ai refactorisé ma fonction affichagePath en utilisant les data-attributes, suivant les conseils de Laila et Yannick
AVANT REFACTORISATION :
`function RendreVisible(classPath) {
let l = `${classPath}line`;
let t = `${classPath}text`;
let tb = `${classPath}textbis`;
let a = `${classPath}arrow` ;
document.querySelector(l).style.visibility="visible";
document.querySelector(t).style.visibility="visible";
document.querySelector(tb).style.visibility="visible";
document.querySelector(a).style.visibility="visible";
}`
APRES REFACTORISATION :
`function RendreVisible(classPath) {
document.querySelectorAll('[data-color="' + classPath + '"]').forEach(function(path){
path.style.visibility="visible";
});
};`
Laila m’a conseillé une écriture plus moderne pour perfectionner la concaténation de variables :
`function RendreVisible(classPath) {
document.querySelectorAll(`[data-color="${classPath}"]`).forEach(function(path){
path.style.visibility="visible";
});
};`
Cours de PHP (correction du formulaire $_GET et commencement de la méthode $_POST)
Remote avec Laila :) :
Réussir à mettre en place un slideshow avec setTimeout et clearTimeOut.
une fonction récursive est une fonction qui s’appelle elle même.
attention dans setTimeout de ne pas dire à la fonction appelée à être exécutée de s’exécuter! Sinon on créé un “maximum call stack exceeded”. - ex : setTimeout(mafonction, 2000) est ok - ex2: setTimeout(mafonction(), 2000) pose problème car setTimeout dit à “mafonction” de s’exécuter mais les () après “mafonction” disent aussi à “mafonction” de s’exécuter!
Laila m’a conseillé de faire plusieurs pages js pour ne pas appeler inutilement un gros script sur une page html qui n’a besoin que d’une fonction js présente dans le fichier js. C’est plus performant et plus écologique! :)