Site d'aide autour des technos du Web

Quelques petits sites sympa que j'ai trouvé en papillonnant et qui nous permet d'apprendre.


Tout d'abord, un petit codepen appelé "JavaScript Array Explorer".

Ce dernier, est très sympa, car il nous permet, en nous posant des questions toute simple de montrer des exemples de code ES6 pour produire l'effet escompter (en cela avec une petite animation bien sympathique).




Maintenant, c'est plus un guide, mais ce lien permet de nous donner une liste des frameworks frontend de "structuration" actuelle, en nous donnant notamment sa catégorisation dans les différents paradigmes, ainsi qu'un paragraphe illustrant les détails et les liens importants associés au framework.




Maintenant, je vais vous présenter trois sites, fais par la même personne.

Le premier, HTML reference, est un site qui liste toutes les balises HTML, en les regroupant par catégories (formulaires, sémantiques, etc...), mais aussi en nous donnant au premier coup d'oeil une information sur le rôle et l'alignement de l'élément.




Et quand nous entrons dans une balise, nous avons le détail, sa liste d'attributs et des exemples en live action. Vraiment bien fait.






Le site CSS reference est exactement calqué sur le même principe que précédemment, mais pour le CSS.



Avec le détail d'une propriété CSS.



Pour ce site, j'avoue que ce qui est dommage est:
  • Il manque pas mal de propriétés (notamment les grid, filter, ...)
  • On n'a pas l'information autour du "repaint".

En effet, il faut savoir que lorsque nous appliquons / modifions une propriété CSS, l'impact sur l'affichage peut être influencé fortement, soit par un simple rafraîchissement d'une zone ou de toute la page (ce qui peut avoir des pertes de performances non négligeables).

Pour cela, il faut utiliser en complémentaire le site CSS triggers qui nous illustrent cela très bien, et en fonction des navigateurs en plus:




Enfin, le dernier site est MarkSheet.

Ici, nous sommes sur un site vraiment pour revoir les bases du développement Web. Cela explique ce qu'est un navigateur, cela explique le protocole HTTP et du coup entre dans les notions fondamentales (mais tellement nécessaire) de HTML, CSS, et JavaScript



Enjoy !




Commentaires

Enregistrer un commentaire

Posts les plus consultés de ce blog

ISO: liens & outils utiles

Image
Voici quelques normes ISO à connaître et que vous aurez à faire face dans vos développements. Et quelques liens / outils permettant de s'assurer que nous faisons correctement leurs intégrations Code Pays https://countrycode.org/ est super site qui permet de lister les pays du monde avec leur country code (en mode number et iso): Et par pays, nous pouvons avoir des informations supplémentaires, comme le format téléphone, la position géographique, la time zone, la monnaie, etc: Ce site du coup regroupe les country code: En ISO 3166 name (où un nom est attribué à un pays) En ISO 3166 numeric (où un chiffre numérique est attribué à un pays) En ISO 3166-1 alpha-2 (code en 2 alpha majuscule) En ISO 3166-1 alpha-3 (code en 3 alpha majuscule) Ainsi que les langues. Tout cela est d'ailleurs regroupés dans ce fichier téléchargeable . Code langue / locale Là, nous tombons dans un des plus grands soucis d'un développeur: co...
Lire la suite

NodeJs et SSL: une petite analyse

Le but de cet article est de faire un petit tour d'horizon de l'usage de SSL dans nos applications NodeJs, en l'occurence, quand nous souhaitons faire une application Web, une API REST, ou les deux. Nous allons avoir 6 étapes pour de réalisation d'un serveur NodeJs, avec à chaque fois 12 clients: Un client NodeJs sans certificats SSL - strictSSL à false Un client NodeJs sans certificats SSL - strictSSL à true Un client NodeJs avec un certificat SSL client non fiable - strictSSL à false Un client NodeJs avec un certificat SSL client non fiable - strictSSL à true Un client NodeJs avec un certificat SSL server non fiable - strictSSL à false Un client NodeJs avec un certificat SSL server non fiable - strictSSL à true Un client NodeJs avec un certificat SSL client fiable - strictSSL à false Un client NodeJs avec un certificat SSL client fiable - strictSSL à true Un client NodeJs avec un certificat SSL serveur fiable - strictSSL à false...
Lire la suite

Créer sa commande slack en quelques minutes

Image
Le but de cet article est de vous montrer que très simplement, nous pouvons créer une commande personnalisée pour Slack. Ici, nous allons afficher des chats :)" Tout d'abord, nous allons nous créer des comptes sur: Slack:  https://slack.com Heroku:  http://www.heroku.com/ qui permettra d'héberger notre service REST pour Slack Gitlab: https://gitlab.com  qui permet évidemment d'héberger notre code, mais qui pourra de manière automatiser déployer notre application sur Heroku à chaque commit (et cela, même en mode "gratuit") Concentrons-nous tout d'abord sur Heroku et Gitlab. Créons un compte Heroku. Une fois cela fait, aller dans votre compte :. Vous verrez alors une section nommée "API key": Cliquez sur "Reveal" pour voir la valeur et conservez la bien en mémoire. Ensuite, sur en retournant sur votre dashboard d'applications Heroku , cliquez sur "New" et créez une nouvelle application. Dans...
Lire la suite