Dark Mode

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

websealevel/awesome-fr

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

616 Commits

Repository files navigation

Ressources gratuites pour les programmeur*euses, designeur*euses web, independant*es, bidouilleur*euses et autres interesse*es

We're Using GitHub Under Protest

Pour en savoir plus rendez-vous a cette section.

This project is currently hosted on GitHub. This is not ideal; GitHub is a proprietary, trade-secret system that is not Free and Open Souce Software (FOSS).

En quelques mots

Une liste d'outils et de ressources (sites web, ebooks, podcasts, videos, blogs, articles, conferences, guides, programmes, etc.) gratuites plutot orientes web (en tout cas initialement, ce qui tend a changer au cours du temps).

Cette liste n'est pas exhaustive par choix (il y'a des choses qui ne m'interessent pas plus que ca et d'autres ressources que je trouve moins pertinentes).

Ce depot contient (est) evidemment des opinions (de moins en moins) sur certains sujets

Des limites de la francophonie

La liste en elle-meme est francophone, cependant de nombreuses ressources repertoriees ici sont (malheureusement) uniquement disponibles en anglais.

Il serait idiot de ne selectionner que des ressources ayant l'amabilite d'etre traduites en francais. L'accessibilite aux francophones reste neanmoins une priorite sur ce depot (au meme titre que la gratuite) et permettra au moins de proposer un panorama en francais de differentes ressources.

Un effort est fait pour mettre en avant des ressources francophones et retrouver des ressources traduites en francais (par exemple pour les livres) quand cela sera possible*.

*Une traduction n'est pas qu'une operation automatique, il en resulte bien souvent un livre different du livre de depart. Aussi il est parfois difficile de la recommander aveuglement.

Conseils d'utilisation

Servez-vous de ce depot comme d'une banque de marque-pages. Grace a la table des matieres, trouvez quelque chose qui peut vous aider ou vous interesser.

Spoiler alert : vous n'avez pas besoin - et de toute maniere n'aurez pas assez d'une vie - d'apprendre, de lire ou de maitriser tout ce qui est expose ici. Naviguez la conscience tranquille vers ce qui vous parait utile ou vous attire. Ce depot donne du vertige aussi a son auteur, et ce dernier est pris dans le douloureux paradoxe d'ajouter du bruit au bruit pour toutes celles et ceux qui cherchent a demarrer en programmation et/ou dans le developpement web.

Par souci de simplicite et d'accessibilite, ce depot va continuer a grandir dans un fichier bien a plat. C'est comme dans une brocante, faut faire un tour pour voir. Mais bon, il y'a quand meme une table des matieres, la recherche par mot-clef et des hyperliens pour faciliter la navigation.

Contribuez et partagez

Des liens morts ? Une typo ? Une ressource que vous trouvez pertinente n'est pas presente ici et vous voulez la partager ?

Proposez votre contribution via l'ouverture d'une issue ou d'une Pull Request. Avant de soumettre une suggestion, merci de lire Comment contribuer au depot ?

No time to lose !

Table des matieres

  • Ressources gratuites pour les programmeur*euses, designeur*euses web, independant*es, bidouilleur*euses et autres interesse*es
    • We're Using GitHub Under Protest
    • En quelques mots
    • Des limites de la francophonie
    • Conseils d'utilisation
    • Contribuez et partagez
    • Table des matieres
    • Comme evaluer la sante d'un depot ?
    • Environnements d'apprentissage interactifs
      • Document Object Model (DOM)
      • git
      • CSS grid
      • JS
      • Algorithmes
    • SEO
    • API publiques
      • Divers
      • Opendata/France
    • Cote client, Frontend
      • Agregateurs de ressources pour le front
      • Templates
      • Typographies/Fonts
      • Palettes de couleurs
      • Pack d'icones/favicons
      • Classic gif
      • Images: photos, illustrations, svg
      • Generateurs/Templates CSS
      • Generateur d'assets au format SVG
      • Motifs
      • Animations CSS (keyframes API) ou JS
      • Composants, extraits de code
      • Gradients
      • Generateur de mise en page / layouts
      • Courbes de Bezier
      • JS
      • Backgrounds
      • Pixel art
      • Agregateurs de design, inspiration
      • Composants
      • UI/UX
      • Sitemap
      • Quelques references tierces
      • Apprendre le web design
      • Check, check, check
        • Code
        • Est-ce-que j'ai oublie un truc ?
        • Accessibilite
        • Perfs et config
        • Analyse de texte
        • Contraste
    • WordPress
      • Un mot
      • Doc officielle wordpress.org
      • Articles
      • Livres de developpement Wordpress
      • Episodes de podcasts sur Wordpress
      • Podcasts dedies a Wordpress
      • Formations
      • Starter themes
      • Banque de themes
      • Plugins recommandes
      • Articles sur la pratique de WordPress et son evolution vers le FSE
    • Hebergement gratuit
    • Mots de passe
      • Gestionnaire de mots de passe
      • Generateur de mots de passe
    • Git
    • Deploiement
    • DevOps
    • Tests
    • Mouvement "NoCode", outils visual code (no-code ou low-code)
    • Quitter Github
    • Logiciels open-source et logiciels libres (free software)
    • Capture/Edition video
    • Principes generaux et fondamentaux
    • Standards
      • Organismes
      • SGML
      • XML
        • Un mot sur le XML
        • Apprendre le XML et ses standards associes
        • Applications XML de prestige
      • Standard SQL et bases de donnees relationnelles
      • Securite des applications web / Audit
    • Reseau
    • Protocoles
      • TCP/IP
      • SSH
      • HTTP
      • BitTorrent
      • Misc
    • OS
    • Infrastructure
    • Request For Comments (RFC), drafts et W3C
    • Unix
    • Taches planifiees
    • REST, Architecture of the World Wide Web
    • Specification OpenAPI
    • Specifiques a un langage/ecosysteme
      • PHP
      • C
      • JavaScript
      • Docker et conteneurs
    • Suivi de projets
    • Gestion de projet, gestion de l'apprentissage et des connaissances d'equipe
    • Dessin et diagrammes
    • Quelques SGBD
    • Modelisation de bases de donnees relationnelles
    • Outils de conception de base de donnees
    • Analyse, conception : UML et alternatives
    • Outils d'administration (et conception parfois) de base de donnees
    • Architecture logicielle
    • Maintenabilite
    • Developpement informatique et science academique
    • Developpement informatique et ecologie (ecoconception)
    • Programmation fonctionnelle
      • General
      • Haskell
      • Clojure
      • Elm
      • Racket, le langage-oriented programming language
    • Langages Assembleur
    • Rich Hickey
    • Defis
    • Markdown
    • Presentations (slides) avec Markdown
    • CV
    • Ecriture technique
      • Outils d'ecriture et de publication
      • Apprentissage
    • Expressions regulieres (regex)
    • Boite a outils
      • sed
      • sloccount
      • rclone
      • wwb (et descendants)
      • Manipulation de fichiers, documents
        • Convertir des documents, editer des pdf
        • Compresser, optimiser des documents (images, pdf etc..)
        • Capture video, audio
    • IA Generatives
    • Android
    • Langages/technos a decouvrir
      • Du bruit au bruit
      • SmallTalk
      • Assembleur
      • Prolog
      • Scheme (Lisp dialect)
        • Installtion
      • Tcl/Tk
      • Mumps/M
    • RGPD
    • Blog design
    • Livres
      • Quelques classiques (liste non exhaustive, en construction...)
      • Software design, architecture logicielle
      • Specifications, design
      • Base de donnees
      • Architecture de l'information/Recherche d'information
      • Securite des applications web
      • Sysadmin
      • HTTP
      • Perl
      • Test
      • Functional programming
        • Clojure
        • Common Lisp
        • Scheme
        • Haskell
      • Algorithmes
      • Rust
      • Developpement de jeux videos
      • Generation procedurale et game design
      • IA, LLMs
    • Hacker culture, Unix
    • Education, outils/langages pour initier a la programmation
    • Compilateurs, interpreteurs
    • Mathematiques, mathematiques et informatique et autres aspects bas niveau
    • Ressources pour formateur*trices
    • En vrac
      • Articles, News, Billets de blog
        • IA generatives, LLMs : reflexions et ressources utiles
        • Partage d'experiences, argumentaires, essais
        • Design
        • Misc et a classer
      • Papiers
      • Blogs
      • Podcasts
      • Cours
      • Conferences, videos et series
      • La verite par l'humour
      • Generation procedurale
      • Game Developers Conference (GDC)
      • Chaines YouTube
      • Playlists
    • Fondamentaux, radical
    • Contribuer a des projets open-source
    • Rester informe*e
    • Prendre soin de soi
    • Prendre soin de sa machine
    • Geometrie, art generatif, algorithmes, procedural
    • Correction
    • Depots
      • General
      • Securite
      • Outils "no code", "low code" ou plutot visual code
      • Cote client (Front-end)
      • Developpement de jeux videos
      • Applications web et reseaux a heberger soi-meme
      • Conferences
      • Revues et magazines informatiques
      • Machine learning
      • Specifique a une techno
        • PHP
        • Java
        • JS
        • Typescript
        • Vue.js
        • Node.js
        • Flutter
      • Projets open-source
      • Design et architecture logicielle
      • Apprendre
      • API web publiques
      • Divers
      • Lecture : articles, livres techniques (informatique, mathematiques)
    • Trouver des livres techniques d'occasion pas cher
    • Vivre de son travail
      • Vendre des templates
      • Vendre des articles
      • Trouver du boulot a distance (remote)

Comme evaluer la sante d'un depot ?

Quelques conseils pour se faire une idee de la sante d'un depot ou d'une bibliotheque, a savoir est-ce que j'en ai vraiment besoin ? Si oui, pourquoi ? Est-ce que ce depot est maintenu ou abandonne ? Est-ce qu'il y a une communaute derriere active et prete a depanner ? Est-ce que cette dependance de mon projet va casser dans 6 mois ?

Aller sur le depot puis :

  • Regarder s'il y a une documentation. S'il n'y en a pas, fuyez !
  • Regarder si la documentation est a jour. Si ce n'est pas le cas, vous allez souffrir.
  • Regarder la date du dernier commit
  • Regarder le nombre d'issues ouvertes et a quelles dates les dernieres ont ete ouvertes. Qu'il y ait un grand nombre d'issues en soit n'est pas un probleme. Au contraire, cela temoigne de l'activite du depot, de son usage et peut-etre de son utilite. Ce qui compte c'est est-ce qu'on repond a ces issues, sont-elles traitees ?
  • Regarder le nombre de Pull Requests en attente, idem que pour les issues
  • Regarder depuis combien de temps les contributeurs du depot n'ont pas repondu a une issue
  • Regarder le nombre de contributeur*ices
  • Mesurer le temps de reaction a l'ouverture d'une issue (utile et bien formulee !)
  • Essayer de trouver une communaute en ligne (site, wikis, IRC, Discord etc...) Dites bonjour, si on vous repond pas mieux vaut passer son chemin.
  • Est-ce que le projet (ses livrables) est versionne ? C'est important pour savoir exactement de quelle version depend notre projet, traquer les changements retrocompatibles ou non etc..
  • Regarder le nombre de stars/fav (attention, metrique pas toujours pertinente)

Environnements d'apprentissage interactifs

Document Object Model (DOM)

git

  • learngitbranching, apprendre git via une appli web interactive. Excellent site web.

CSS grid

JS

Algorithmes

SEO

API publiques

Divers

Opendata/France

Cote client, Frontend

Agregateurs de ressources pour le front

  • uxtools.co, un hub des outils, tendances, design pour les designer. Organisent des sondages tous les ans.
  • devtooly, repertorie tout un tas de ressources frontend par categories
  • webcode.tools, collection d'outils en ligne pour le developpement web (generateurs de code)

Templates

Templates HTML5/CSS3 a telecharger, utiliser, modifier :

Typographies/Fonts

Les designers se moqueront de vous si vous utilisez le mot typographie ou typeface au lieu de police de caracteres ou font, et inversement. C'est du pur mepris de classe, comme lorsqu'on on vous corrige sur la difference entre URI et URL. Ne vous laissez pas faire.

Mais sachez en gros que la typographie, ou Typeface, c'est le design et la Font c'est l'implementation de ce design en informatique.

  • wakamai, upload votre font pour connaitre ses proprietes
  • typescale, creer facilement un systeme de tailles de font a suivre
  • typography principles, un guide pour apprendre les principes de la typo
  • fontjoy, trouver facilement des combinaisons de fonts qui fonctionnent
  • google-type, trouver facilement des combinaisons de fonts qui fonctionnent
  • fontsquirrel, bibliotheque de fonts libres pour usage commercial
  • fontsinuse, bilbiotheque de typos
  • fontfabric, tester rapidement ses fonts
  • FontZone, une archive de fonts telechargeables et gratuites
  • fontshare
  • Typeoff.de, le blog de Dan Reynolds, un designer et historien des typographies

Quelques lectures utiles sur des aspects techniques de la typographie :

Palettes de couleurs

Pack d'icones/favicons

Des icones, des icones et encore des icones. Faites votre choix :

Classic gif

Images: photos, illustrations, svg

Generateurs/Templates CSS

Generateur d'assets au format SVG

Motifs

Animations CSS (keyframes API) ou JS

Experimenter et creer des animations CSS

Composants, extraits de code

  • Magic UI, composants
  • shadcn/ui, composants
  • codepad, code snippets dans tout un tas de langages et composants pour le front (html,css,js)
  • snipplr
  • web code tools, des outils cles en mains pour le developpement web
  • code my ui, inspirations et code snippets pour le web design/ui
  • cssui, composants interactifs en CSS (sans JS)

Gradients

Generateur de mise en page / layouts

Courbes de Bezier

JS

Backgrounds

Pixel art

Agregateurs de design, inspiration

Composants

UI/UX

  • figma, actuellement le meilleur editeur de design (webapp/desktop) gratuit
  • checklistdesing, une collection des meilleures pratiques de design web
  • laws of UX, une autre collection des meilleures pratiques en design web, tres bien faite, avec un resume de ce qu'il faut retenir sur chaque post
  • design principles
  • uiplaybook, un dictionnaire des composants webs (fonction, bonnes pratiques, implementation etc..)
  • UX challenges, exercices d'UX
  • future learn, apprendre l'ux, maintenu par Accenture
  • baselinehq, un bootcamp gratuit produit par des professionnels
  • springboard, apprendre l'ux/ui
  • UXMTYHS, collection des erreurs de conception en UX avec des explications sur le pourquoi
  • Google UX Design
  • Decathlon figma, Decathlon a ouvert au domaine public tout son systeme de design

Sitemap

  • octopus, un outil en ligne pour construire le sitemap (architectures des pages, composants) de son projet

Quelques references tierces

Apprendre le web design

Check, check, check

Code

Est-ce-que j'ai oublie un truc ?

  • Landing Page Checklist, des ressources pour votre landing page et s'assurez de n'avoir rien oublie d'important
  • Front-end checklist
  • unused-css, detecte le CSS non utilise sur une page web
  • Checklist Design, une collection des meilleurs pratiques de design. Pour chaque composant, cochez une a une les cases d'un checklist pour voir si vous n'avez rien oublie (page login, page 404, flot de paiement, logo etc... )
  • faviconcheck, verifier comment rend vos favicons sur differents os, navigateurs ou themes

Accessibilite

L'accessibilite du web est la problematique de l'acces aux contenus et services web par les personnes handicapees et plus generalement par tous les utilisateurs, quels que soient leurs dispositifs d'acces ou leurs conditions d'environnement.

Perfs et config

  • pingdom, tester le temps de chartement d'une page et obtenir un diagnostic
  • pingtest, ping un nom de domaine depuis plusieurs positions sur le globe
  • whatsmydns.net, visualiser la propagation sur les serveurs DNS de votre enregistrement DNS
  • intodns, verifier votre config DNS (serveur web, serveur mail,etc.)
  • WebPageTest, un projet open-source soutenu par Google avec un focus sur le network. Au top
  • measuring page weight, un article (en anglais sorry, j'essaierai de trouver un article equivalent en fr) qui discute de la facon dont est calcule le poids d'une page et la recherche d'un standard. Liste egalement tous les outils populaires pour faire des mesures

Analyse de texte

  • word-counter, donne des metriques sur un texte (nombre de mots, caracteres, paragraphes etc..)

Contraste

WordPress

Un mot

En 2021 on comptait environ 455 000 000 sites WordPress. Cela represente au moins 30% du web, mais en realite plutot 40% (estimation haute).

WordPress est un framework parfaitement adapte pour gerer et publier du contenu sur Internet. C'est un outil versatile qui peut etre adapte pour toute taille de projet. Si WordPress peut etre utilise pour tout faire, il n'est pas toujours la solution la plus adaptee !

Ce framework existe depuis 2004, dans le monde du logiciel libre c'est une eternite.

WordPress est developpe et pense pour l'utilisateur final (celui qui publie et gere le contenu), et non pour le developpeur. Les utilisateurs se moquent bien de nos outils tant qu'ils ont ce qu'ils demandent. WordPress, a l'instar de LibreOffice ou autre, est devenu un standard de gestion de contenu en ligne que beaucoup de personnes non-techniciennes connaissent bien, utilisent quotidiennement et demandent. C'est donc un enorme avantage de capitaliser dessus pour les futurs utilisateurs de votre application web.

Doc officielle wordpress.org

Tres bien faite, mais peut parfois demander un peu d'experience pour s'y retrouver. Ne pas oublier que de documenter un immense framework qui evolue sans cesse est un immense challenge en soi.

Articles

Livres de developpement Wordpress

A telecharger sur pdfdrive:

Episodes de podcasts sur Wordpress

Podcasts dedies a Wordpress

Formations

Starter themes

Banque de themes

Plugins recommandes

Le plus recommande est de limiter au maximum l'usage de plugins pour vos themes. Cela dit certains plugins stables et bien maintenus sont souvent de la partie pour des sites en production

  • Advanced Custom Fields, et non SCF !
  • ewww image optimizer
  • bulletProof Security, bonne alternative a WordFence
  • carbon fields, alternative gratuite a ACF Pro
  • fakerpress, generateur de faux contenu pour tester son theme
  • RankMath, plugin SEO, bonne alternative a Yoast
  • BuddyPress, plugin pour ajouter une couche reseau social a votre site
  • bbPress, gestionnaire de forums/fils de discussion
  • W3 Total Cache, un plugin pour optimiser les performances de Wordpress, completement agnostique de l'hebergeur. Mise en cache des pages webs etc... Au final, ameliore l'experience utilisateur et le SEO de votre site. Verifiez que votre hebergeur ne vous propose pas deja un plugin de mise en cache maison avant de l'installer sur votre site en prod

Articles sur la pratique de WordPress et son evolution vers le FSE

Hebergement gratuit

  • Neocities, Neocities est un hebergeur web ayant pour objectif de faciliter la creation de sites internet personnels afin d'offrir une alternative aux reseaux sociaux. Il s'inscrit dans la continuite du legendaire Geocities, un ancien service d'hebergement web gratuit fonde en 1994, ferme en 2009
  • GitHub Pages, GitHub offre la possibilite d'heberger un site statique

Mots de passe

Gestionnaire de mots de passe

  • KeePassXC, les navigateurs proposent de sauvegarder vos mots de passe. Mais ils ne sont pas concus pour ca et ce n'est pas l'ideal d'un point de vue securite. Mieux vaut utiliser un gestionnaire de mots de passe sur votre machine pour les acces sensibles. KeePassXC est un gestionnaire de mots de passe multiplateforme et open-source. Il stocke vos mots de passe dans une base de donnees cryptee et respecte les standards. Il offre egalement tout un tas d'autres fonctionnalites. Il vient meme avec une extension pour votre navigateur favori qui se connecte a votre base de donnees de mots de passe et (essaie) de remplir automatiquement les formulaires de login.

Generateur de mots de passe

  • xkpasswd, creer des mots de passes securises ET faciles a retenir (si vous devez le faire)

Git

  • inside .git, comic strip de Julia Evans sur le systeme de fichiers interne de git
  • Conventional Commits, une specification pour ajouter une signification lisible par l'humain et par la machine aux messages de commit, pour s'en servir de base a des outils d'automatisation

Deploiement

  • FileZilla, le client ftp/sftp open source par excellence (evitez deployer en ftp sur un projet complexe, il y a de meilleures alternatives pour moins de charge mentale). Depanne toujours et fonctionne tres bien pour des sites web simples.
  • Capistrano, un outil pour deployer automatiquement sur un serveur distant, avec gestion de version, rollbacks etc... Pour un deploiement sans stress

DevOps

"DevOps is a meaningful term"

Tests

Mouvement "NoCode", outils visual code (no-code ou low-code)

  • No Code Summit, conference organisee par l'Union Francaise des Professionnels du NoCode qui federe et represente les professionnels du NoCode et du LowCode
  • No-Code France, association et espace communautaire francophone dedie au No-Code (slack, chaine YouTube, veille, meetups)
  • Makerpad, communaute consacree au NoCode (tutoriels, posts, veille), cree en 2018
  • Webflow University, des cours sur le developpement de site webs avec Webflow
  • Bubble Academy, la source principale de guides pour developper avec Bubble
  • La gazette du No-Code, un media 100% NoCode dediee au NoCode (portraits, actualities, interviews, tests d'outils, etc.)

Quitter Github

Le 29 Juin 2022, le software freedom conservancy a publie un article incitant a abandonner GitHub pour se tourner vers des plateformes d'hebergement de codebase plus respectueuses de l'open-source et des utilisateurs.

L'article mentionne les raisons tres claires de cette initiative et alerte sur la derive du logiciel proprietaire GitHub. GitHub a porte un coup de grace en monetisant l'outil copilot entraine sur les depots des utilisateurs sous licence libre (mais non sur les codebases de Windows) et en laissant lettre morte les revendications et questions adressees par la communaute.

Souscrivant a la vision et aux arguments du software freedom conservancy, cette liste sera migree prochainement vers une autre plateforme.

Des alternatives existent et vont se creer. Voici une liste de plateformes alternatives

Sinon vous pouvez mettre en place vous meme votre hebergement de gestionnaire de projets a l'aide de ces outils

Logiciels open-source et logiciels libres (free software)

  • gnu.org, le site officiel de l'OS GNU/Linux et par extension du mouvement du logiciel libre. Vous y trouverez toutes les informations pratiques sur le libre
  • opensourcealternative, trouver une solution alternative open-source a ...
  • degooglisons-internet, remplacer tous vos services tiers proprietaires par du libre (partage de fichiers, communication...)
  • Framasoft, association d'education populaire soutenant plusieurs projets open-source dont Framalibre
  • flop!EDT, gestionnaire d'emploi du temps personnalise open-source
  • Framalibre, l'annuaire des logiciels libres
  • librejs, une extension pour navigateur pour bloquer uniquement l'execution du JavaScript non libre
  • Le piege JavaScript, Richard Stallman (traduction fr), article de Richard Stallman traduit en francais sur les problemes que posent l'execution de code Javascript dans le navigateur vis a vis du logiciel libre et de son ethique
  • En quoi l'open source perd de vue l'ethique du logiciel libre, article originellement publie par Richard Stallman sous le titre Why Open Source Misses the Point of Free Software. Pour bien comprendre les differences philosophiques et pratiques dans des cas tres concrets entre les deux mouvements

Capture/Edition video

  • Pitivi, tres bon editeur video open-source, simple a utiliser, avec beaucoup de fonctionnalites avancees et puissant (notamment a l'export impeccable)
  • unscreen, retirer l'arriere plan d'une video en ligne (automatique)
  • ffmpeg, collection de logiciels libres maintenus depuis les annees 2000 pour manipuler les flux audio et video. Indispensable
  • HandBrake, un converteur video open source pour convertir et compresser vos videos en utilisant les meilleurs algorithmes de compression
  • Shrink my video!, un outil en ligne pour compresser facilement vos videos (preferer handbrake pour faire tout le travail en local si possible)
  • SimpleScreenRecorder, un tres bon logiciel, simple et complet, de capture video de son ecran et du son, parfait pour enregistrer des screencasts et des tutos.
  • OBS Studio, logiciel libre d'enregistremetn video et de streaming en direct multiplateforme

Principes generaux et fondamentaux

Standards

source

"The good thing about standards is that there are so many to choose from." (Andrew Tanenbaum)

Organismes

Une liste non exhaustive d'organismes qui implementent et maintiennent les standards ouverts dans differents domaines de l'informatique.

  • OASIS OPEN, groupe de collaboration (individus, entreprises, gouvernements, etc.) en charge de l'implementation et de la maintenance de standards informatiques ouverts, comme DITA, DocBook, OData, OpenDocument, etc. Voir tous les projets ici.
  • W3C, le World Wide Web Consortium, en charge de maintenir et developper les standards ouverts du Web.
  • WHATWG, le Web Hypertext Application Technology Working Group est un groupe de collaboration qui travaille sur la standardisation des navigateurs webs (voir ici les standards sur lesquels ce groupe travaille) et des standards associes comme le protocole WebSocket, le Storage, XMLHttpRequest, etc. C'est un groupe qui a ete forme en 2004, suite a un atelier organise par le W3C, par des personnes travaillant chez Apple, Mozilla et Opera. Il a ete cree en reponse au fait que le W3C partait un peu en cavalier seul sur le futur du standard HTML avec XHTML (qui au final a donne HTML5) sans prendre assez en compte l'etat de l'industrie du developpement informatique. Il represente surtout le cote industrie du web et les vendor de navigateur web, et cherche a accelerer le developpement des standards pour les implementer rapidement, pour le meilleur et pour le pire (surtout le pire). Aujourd'hui Google et Microsoft ont rejoint ce groupe et il travaille en collaboration avec le W3C dont certains membres en font egalement partie.
  • Internet Engineering Task Force (IETF), L'Internet Engineering Task Force (IETF), elabore et promeut des standards Internet, en particulier les standards qui composent la suite de protocoles Internet (TCP/IP). L'IETF produit la plupart des nouveaux standards d'Internet. Le but du groupe est generalement la redaction d'une ou plusieurs Request for comments (RFC), nom donne aux documents de specification a la base d'Internet.
  • Open Container Initiative (OCI), gouvernance pour maintenir et garantir des standards ouverts sur les formats de conteneurs et de leurs environnement d'execution. En font partie Docker Inc., Red Hat, Google, etc.
  • Web Developer Experience (WebDX) Community Group, groupe de travail de la W3C regroupant les principaux editeurs de navigateurs web (Mozilla, Microsoft, Apple, Google ) pour creer un ensemble connu de fonctionnalites securisees. Le travail de ce groupe se retrouve sous la forme du Web Platform Baseline, un ensemble d'informations claires sur la compatibilite des navigateurs avec les fonctionnalites du web (actuelles et a venir) que l'on peut utiliser en securite (en production). Ces informations se retrouvent sur la MDN Web Docs.
  • MDN Web Docs, documentation open-source et collaborative de l'ensemble des technologies du web (CSS, HTML, Javascript, Wasm, Web API). C'est le projet de documentation de la plateforme de developpement web. Maintenue par le groupe de travail Open Web Docs (OWD)
  • Interop, groupe de travail specialise dans l'interoperabilite entre les navigateurs (implementations des standards du web). Ce groupe maintient notamment une suite de tests cross-browsers

SGML

SGML est un metalangage a balise pour definir des langages a balise (markup langages). SGML est a l'origine de tous les langages a balise, comme HTML ou XML qui en sont des applications.

XML

Un mot sur le XML

Le standard XML (eXtensible Markup Language) est extremement puissant pour construire des documents robustes, echangeables et faciles a maintenir (lire et ecrire) dans le temps. Contrairement aux idees recues, il n'est pas mort et n' a pas vocation a etre remplace par JSON car les deux standards n'ont pas du tout la meme histoire, ni les memes ambitions. Loin de la...

XML est un format universel pouvant etre lu facilement par des humains et par des machines. XML est ne en 1998 du standard SGML (qui a donne l'application HTML, un sous-ensemble du standard SGML, plus simple et plus permissif adapte au web). XML est egalement une simplification du standard SGML.

Son but initial etait de faire office de standard pour conserver les documents numeriques dans un format independant des machines, des OS ou des supports physiques. L'idee du W3C etait de creer un standard qui permettra de lire votre document sur une techno inconnue dans 2000 ans. C'est un projet fascinant. Il etait avant tout destine a des documents narratifs (rapports, articles, catalogues). Il est base sur la separation stricte du contenu et de la forme.

Les developpeurs s'en sont empares ensuite pour faire du maintien d'enregistrement pour leurs applications, ce qui n'avait pas ete envisage dans sa conception initiale.

XML s'accompagne d'autres standards comme

  • XPath, un standard qui permet de requeter la structure XML pour naviguer dans la structure de donnees et la manipuler
  • XQuery, un standard qui permet de requeter l'abre via un langage declaratif (le pied) comme le SQL
  • XSLT, standard plus avance que le CSS pour mettre en forme les donnees XML pour la publication (vers un autre fichier XML, le web, le papier, etc.). Permet egalement de modifier l'affichage d'elements, de les reorganiser etc...
  • DTD, pour la validation des donnees par un schema
  • et d'autres encore (XML Schema, etc.)...

Tous ces standards font d'XML un outil a avoir dans sa poche lorsque l'on a besoin d'echanger ou de construire des structures de donnees complexes et validables, ou de produire des documents independemment de leurs usages (web, presentation, impression papier, etc.).

Apprendre le XML et ses standards associes

Applications XML de prestige

  • Docbook, application XML dediee a la publication de documents, principalement des articles et des livres d'informatique mais pas que. Le projet a originellement ete developpe par l'editeur O'Reilly pour ses editeurs, il est aujourd'hui maintenu par OASIS OPEN, un groupe de collaboration travaillant et maintenant des standards
  • Dita Open Toolkit, implementation open-source du standard Dita, the Darwin Information Typing Architecture, projet egalement maintenu par OASIS OPEN. C'est un framework de documentation et de publication technique ou l'on va pouvoir developper et maintenir une source de verite pour la publier vers differents formats (PDF, HTML, Markdown, etc.)

Standard SQL et bases de donnees relationnelles

Securite des applications web / Audit

Reseau

Protocoles

TCP/IP

SSH

HTTP

BitTorrent

Misc

OS

Infrastructure

  • Load Balancing, un article bien fait avec visualisations sur les repartiteurs de charge (load balancer) et les differentes strategies d'implementation

Request For Comments (RFC), drafts et W3C

Des documents decrivant les aspects et specifications techniques d'Internet. La source, et des lectures arides mais tres interessantes quand on prend le temps de fouiller certaines sections. Certains d'entre eux definissent des standards.

Unix

Taches planifiees

REST, Architecture of the World Wide Web

Specification OpenAPI

Specifiques a un langage/ecosysteme

PHP

  • php.watch, news PHP, articles, changements a venir. Le blog officiel qui suit le developpement de PHP
  • PHP: The Right Way reference accessible aux standards modernes de PHP
  • The PHP Foundation, groupe de travail sur l'ecosysteme PHP. En savoir plus.
  • PHP-FIG, le PHP Framework Interop Group, a l'origine des PSR
  • packagist, depot principal des composants PHP
  • pecl, le repertoire officiel des extensions de PHP (Modernisation de la distribution et maintenance envisagee par la communaute et initiee par la PHP Foundation et Derick Rethans)
  • PHP Usergroup, trouvez des usergroups PHP pres de chez vous
  • Afup, association francaise des utilisateurs de PHP
  • PHP Documentor, produire de la documentation directement a partir des sources
  • FrankenPHP, un serveur PHP moderne ecrit en C et Go, maintenu par Kevin Dunglas, qui permet d'utiliser HTTP 1.1, 2 et 3, et supporte des reponses HTTP multiples. Remplace PHP-FPM
  • NativePHP, framework PHP pour deployer des applications desktop, maintenu par Marcel Pociot. Attention, outil toujours en alpha (2023)
  • psalm, analyseur statique de code, notamment inspire de Hack
  • phpStan, l'analyseur statique (at compile time) du code PHP par excellence. Find bugs without writing tests
  • phpCodeSniffer, l'outil par excellence pour appliquer des standards de maniere semiautomatise a son code source. Compose de deux programmes: phpcs pour sniffer les erreurs dans votre code et phpcbs pour corriger automatiquement ce qui peut l'etre.
  • phpBench, un framework de benchmark pour PHP, inspire de PHPUnit
  • Le blog de Fabien Potencier
  • Le blog de Kevin Dunglas, membre core de Symfony, mainteneur de FrankenPHP et du protocole Mercure (entre autres). Un grand developpeur et contributeur de l'ecosysteme PHP notamment, plein d'humilite
  • Functional Programming in PHP
  • PHP Quality Assurance

Voir le depot dedie a la veille PHP.

C

JavaScript

  • p5js, une librairie JavaScript open-source pour le code creatif. Avec un focus pour rendre le code accessible et inclusif pour les artistes, designers, formateurs, debutants.
  • leaflet, le projet open-source pour developper des cartes interactives et mobile-friendly.
  • openlayers, bibliotheque pour couvrir les besoins en carthographie
  • jquery, jquery est le parfait exemple de bibliotheque bien faite. On lit souvent qu'elle est morte. Il y a de quoi rire. Jquery n'est pas mort, jquery est partout. Jquery a eu un role majeur dans l'evolution du standard de JS. La bibliotheque est tellement solide et populaire qu'il a meme ete suggere d'embarquer jquery (en cache) dans tous les navigateurs pour le futur standard HTML6. Idealement, dans un monde parfait, jquery devrait disparaitre tout comme JavaScript devrait disparaitre du navigateur. En effet, les besoins de JS reculent toujours d'avantage a chaque nouvelle version du HTML. En attendant, ce n'est pas demain la veille alors autant s'y mettre pour au moins 3 raisons (a) jquery est partout, si vous travaillez sur du legacy code vous allez tomber dessus, (b) c'est hyper pratique et puissant et la surcouche n'eloigne pas trop du DOM, on apprend des choses sur le DOM qui seront toujours utiles meme dans un monde post-jquery, meme dans un univers vanilla JS (c) ca permet aussi de prototyper rapidement des interfaces dynamiques meme si on decide ensuite de passer sur un framework JS (d) ca demande quand meme de comprendre le vanilla JS. Voici un tout petit depot ou l'on a selectionne l'essentiel du fonctionnement de jquery pour bien comprendre comment cette bibliotheque fonctionne. (source de l'image)
  • Vanilla JS, le site web qui promeut le vanilla JS

Docker et conteneurs

Suivi de projets

  • Mattermost, alternative open source a Trello, outil de workflow, travail collaboratif, suivi de taches, etc.

Gestion de projet, gestion de l'apprentissage et des connaissances d'equipe

Dessin et diagrammes

  • Umlet, meilleur outil crossplatform pour realiser des diagrammes UML rapidement, faciles a partager et editer (dans l'esprit UML 1)
  • dia, programme opensource et crossplatform pour dessiner des diagrammes structures
  • excalidraw, dessiner des diagrammes rapidement avec un look and feel fait-main, en local ou sur le web
  • minimator, un editeur graphique SVG minimaliste dans le navigateur. Dessinez a l'aide d'une grille et exportez facilement votre svg
  • dddraw, un editeur graphique SVG gratuit en ligne
  • nomnoml, un outil pour script le rendu de diagrammes UML

Quelques SGBD

  • PostgreSQL, le choix a faire lorsqu'on part sur une base de donnees relationnelle. Projet open-source maintenu depuis 30ans, le SGBD qui va le plus loin sur l'implementation du standard SQL
  • Dalibo, l'expertise PostgreSQL, ressources gratuites pour se former sur PostgreSQL
  • ClickHouse, base de donnees relationnelle orientee colonnes. Optimise pour l'OLAP. Verifiez bien avant de vous en servir pour votre projet que ce systeme soit adapte a votre cas d'utilisation
  • Datomic, un SGBD developpe par Rich Hickey. En plus de concevoir la base de donnees comme une valeur ce modele incorpore le temps de maniere native. Depuis avril 2023, Datomic est accessible gratuitement
  • SQLite, un SGBDR qui contrairement a la plupart des autres systemes n'utilise pas l'architecture client/serveur et permet de disposer d'une base de donnees relationnelles dans un simple fichier. On peut utiliser DB Browser for SQLite pour avoir un gestionnaire et inspecteur de bases de donnees avec GUI.

Modelisation de bases de donnees relationnelles

Outils de conception de base de donnees

  • AnalyseSI, un outil open-source distraction-free base sur Merise 1 pour modeliser une base de donnees (MCD) et produire un MPD et scripts SQL
  • Oracle SQL Developer Data Modeler, outil graphique complet et plus complexe pour la conception de base de donnees, propose par Oracle. La documentation accessible depuis le logiciel est de bonne qualite, le blog d'helifromfinland est rempli d'articles utiles sur l'outil

Analyse, conception : UML et alternatives

Outils d'administration (et conception parfois) de base de donnees

  • dbeaver, multiplateforme, multi-sgb, open-source que demande le peuple
  • adminer, une alternative open-source a phpMyAdmin (aussi open source) qui commence a etre charge historiquement. Plus leger, plus performant, plus securise, plus user-friendly. Prend en charge les base de donnees MySQL, SQLite, PostgreSQL, MS SQL et Oracle
  • pgAdmin, le systeme d'administration open-source le plus pousse pour Postgresql
  • pspg - Postgres Pager, pspg est un navigateur Unix pour naviguer dans les tables d'une base de donnees relationnelle

Architecture logicielle

Maintenabilite

Developpement informatique et science academique

Developpement informatique et ecologie (ecoconception)

Voir aussi les approches radicales et les fondements du web

Programmation fonctionnelle

General

Haskell

Voir ce bouquin de reference.

Clojure

Elm

Elm est un langage/ecosysteme fonctionnel pour developper des applications web. Il compile vers Javascript. Elm possede peut etre le compilateur le plus human-friendly au monde

Racket, le langage-oriented programming language

Langages Assembleur

Rich Hickey

Et oui, Rich Hickey a le droit a sa propre section. Allez directement voir ce depot, le job est deja fait avec talent pour recenser tous ses travaux.

Defis

Apprenez a coder via des defis

  • Root Me, testez vos competences en hacking
  • Sad Servers, like leetcode for linux
  • codewars, affutez votre lame en realisant/publiant des katas
  • codinGame, on ne presente plus cette plateforme
  • Flexbox froggy, apprendre CSS flexbox via des challenges
  • Flexbox defense, un tower defense ou l'on joue en CSS
  • Knights of the Flexbox Table, un jeu pour apprendre Tailwind CSS
  • Guess CSS, deviner le HTML/CSS utilises dans des puzzle games
  • Tenix, challenges originaux et corriges pedagogiques pour decouvrir de nouveaux concepts et progresser. PHP, javascript et Python.

Markdown

Le Markdown est tout simplement le meilleur format pour creer de la documentation sur tout ce que vous faites sur votre machine. C'est un langage a balises leger. Facile a lire, facile a ecrire. Il a ete pense originellement pour ecrire pour le web.

Facile a apprendre, facile a exporter vers tout un tas de formats markup (HTML, PDF, LaTeX, XML, etc.). C'est le markup ultime pour ecrire, prendre des notes, partager et surtout creer une base de connaissances, que ce soit en local ou sur le web. Markdown refait apprecier le gout du web : content first, les hyperliens et un processus de publication simple et facile.

Markdown est un "standard (volontairement) incomplet" ce qui a laisse la place a de nombreuses implementations differentes.

  • Liste des implementations Markdown, les differentes implementations ou parsers Markdown
  • CommonMark, une specification Markdown creee en 2004 par John Gruber et Aaron Swartz, implementee dans de nombreux langages de programmation
  • Apprendre CommonMark en quelques minutes
  • MultiMarkdown, superset de Markdown qui permet de produire des document complets bien formes. Ajoute des features utiles manquantes a Markdown, notamment la gestion de meta-donnees et tout ce qui touche a la connectivite entre documents Markdown
  • marpit, framework minimal pour creer des presentations en Markdown.
  • Mark Doc, superset et framework Markdown, open-source, oriente publication de contenu. L'outil a ete developpe par Stripe, pour developper et maintenir sa documentation structuree, complexe et de qualite.
  • Babel Mark 3, la specification originale de Markdown (proposee par John Gruber) n'etant pas complete, de nombreuses implementations de Markdown existent avec leurs specificites. Babel Mark 3 vous permet de comparer le resultat (HTML) de nombreuses implementations de Markdown

Presentations (slides) avec Markdown

  • pandoc, creer une presentation directement avec pandoc
  • Marp, creer ses diapos dans un ecosysteme full Markdown. Reutiliser ainsi facilement le contenu structure de vos presentations pour les publier en PDF ou HTML, ou inversement. Base sur Marpit,
  • poc Marp, un depot simple qui sert de reference sur l'usage de Marp
  • Revealjs, un autre outil, plus lourd mais permettant de