Pourquoi les jeunes sont devenus si nuls en informatique

Exactement le même constat, le même historique et les mêmes déductions...

EDIT: My two cent

là je suis en salle info:

  • 5 élèves sont incapables de se connecter à l'ENT: ils ne savent pas leur mot de passe, sont incapables de taper un captcha ou ne tapent qu'une des informations à chaque tentative (le captcha OU le login OU le passe)
  • une élève a un moniteur orienté un peu vers le haut: elle le regarde et sa copine me demande comment faire. Je leurs réponds :«comment résoudre ce problème ?» ... je m'occupe des autres... je reviens plus tard et le moniteur est toujours orienté vers le haut.
  • Tous les élèves voulant faire une majuscule passent par le verrouillage au lieu de shift... TOUS.
  • tous les élèves utilisant un ordi portable veulent une souris... ils sont incapables d'utiliser le touchpad alors QU'ILS FONT EXACTEMENT LES MÊMES MOUVEMENTS SUR LEUR TEL
  • côté collègues maintenant: malgré plusieurs messages, j'ai encore 6 ordinateurs qui n'ont pas été rebranchés à la station de chargement: le tiers des ordis portables. Les collègues s'en foutent...
  • côté infra à présent: depuis plusieurs années on a externalisé l'authentification et la gestion des sessions windows; par conséquent, avec la connexion au charbon de bois du collège, il faut 10-15 minutes pour que tous les ordis fonctionnent. Quand win ne se met pas à faire une MAJ.

Smooth Multi-Page Experiences with Just a Few Lines of CSS - HTMHell

Des transitions entre les pages en une ligne ?!

@view-transition {navigation: auto;}

Pas mal mais pas sur firefox pour le moment... https://caniuse.com/view-transitions

Un fallback que j'avais utilisé, jouer sur onload et l'opacité du body: https://snippetvamp.warriordudimanche.net/index.php?snippet=5EEB0F5F-C4F9-432E-97EE-558E4BA8E4B8

C'est loin d'être parfait mais bon...

/* Dans le Head */
<style type="text/css">body{opacity: 0;transition: opacity 1s}</style>

/* balise body */
<body onload="document.body.style.opacity=1" >

Via https://links.kalvn.net/shaare/65veMA

FolderSync - L'app Android indispensable pour synchroniser vos fichiers | Logiciels utiles | Le site de Korben

Synchroniser des fichiers entre Android et tout type de stockage externe (machines, FTP, clouds etc)

  • choix du type de synchro,
  • fréquence
  • dossiers à inclure et exclure
  • tâches de synchro multiples,
  • filtrages (avec regex)
  • chiffrement de transfert,
  • automatisation liée à Tasker

Je vais ptêt m'en servir pour synchro mes photos avec le FTP de ma freebox, pour voir...

RIDITLETEUR-slash pages

Les slashpages sont les pages normalisées qu'on trouve sur les blogs... /about, /contact etc.

J'en connaissais quelques unes mais y'en a plein !

Riditleteur - grafikart - la sécurité

Bon, l'avantage de la video, c'est que je peux l'écouter en faisant la cuisine... ou le ménage... ou les courses... et merde.

<FilesMatch "\.php *$">
     Order allow,deny
    Deny from all
</FilesMatch>

(...)

5 extraits CSS que tout développeur front-end devrait connaître en 2024

Il y a de ces trucs en CSS quand même...

Quelques notes perso ici...

:has()

styler le parent en fonction du nombre d'enfants

Pour modifier une grid par exemple...

main:has(> :nth-child(5)) {…}

styler un élément selon l'état d'une checkbox

Pour appliquer un darkmode 

html:has(#dark-mode:checked) {…}

styler un form dont au moins un des items est invalide

form:has(:user-invalid) .error {
  display: block;
}

L'imbrication CSS

Et moi qui pensais que ce n'était réservé qu'à des sass & consorts !

Voilà qui permettra de mieux organiser le code et le rendre plus lisible...

/*AVANT*/
.nesting {
  color: hotpink;
}
.nesting > .is {
  color: rebeccapurple;
}
.nesting > .is > .awesome {
  color: deeppink;
}
/* MAINTENANT*/
.nesting {
  color: hotpink;

  > .is {
    color: rebeccapurple;

    > .awesome {
      color: deeppink;
    }
  }
}

[EDIT] Par contre, ce n'est pas forcément supporté par les navigateurs pas à jour... https://caniuse.com/css-nesting

text-wrap:balance

en gros, pour rendre plus homogène un texte sur plusieurs lignes... Attention, pas pour un texte de plus de 10 lignes apparemment.

via https://bookmarks.ecyseo.net/?DunHiA

Astuces & liens pour HTML, JS et toussa

Petite liste tirée des RSS que je suis en ce moment.

Réflexions sur l'Abaya : Un point de vue d'un Tunisien : r/france

J'ai retrouvé le post Reddit d'origine de ce texte copié collé sur la river et que l'on peut rapprocher de la vidéo de Kahina Balhoul (femme Imam) , trouvée sur masto (https://piaille.fr/@petaramesh/111000388869533671 ) https://www.youtube.com/watch?v=aBZpiAyifr0

Les deux opinions me paraissent intéressantes car proposées par des gens concernés et légitimes: ils savent de quoi ils parlent et ne peuvent être soupçonnés d'être antimusulman...

En effet, j'ai souvent l'impression qu'on est arrivé à une telle radicalisation des positions à ce sujet qu'il ne peut plus y avoir de réflexion un peu objective sans qu'on soit immédiatement noyé dans un brouhaha d'accusations... Pourtant, le sujet n'est pas simple à trancher ou à résoudre...

En tant que Tunisien, je tiens à souligner que le mot "Abaya" est totalement étranger à notre culture en Tunisie (et au Maghreb tout entier à ce que je sache). Ce vêtement, l'abaya, est spécifique à l'Arabie Saoudite et au pays du Golf et reflète l'influence du wahhabisme et de l'islamisme radical en France. En tant que Tunisien, j'ai une compréhension approfondie des aspects religieux et historiques de l'islam, et je peux affirmer avec certitude que nos ancêtres n'ont jamais porté ce type de vêtement, et encore moins le voile.

Le port du voile est devenu une question politique, notamment grâce aux Frères musulmans, qui ont promu cette pratique. Il est intéressant de noter que même à Al-Azhar en Égypte, une institution enseignant la théologie musulmane, les étudiantes ne portaient pas de voile dans les années 60 et avant. Le voile est donc une tendance relativement récente, propagée à travers les médias depuis la défaite de 1967 et l'essor de l'islamisme, consécutif au déclin du nationalisme arabe laïque et l'enrichissement des pays du Golf.

Il est important de noter que le Maghreb n'avait aucune tradition de voile ou d'abaya avant ces événements. Il est donc regrettable de voir que certains Maghrébins islamistes (y en a aucune doute pour moi) utilisent ces vêtements saoudiens, qui n'ont aucun lien avec notre culture, pour exprimer leurs opinions politiques en France. Cette stratégie est superficielle et déplorable, car elle utilise les enfants comme instruments politiques.

En ce qui concerne la France, il est évident que les gouvernements incompétents, comme beaucoup de l'élite politique mondiale aujourd'hui, tentent de diviser pour mieux régner. Ces questions détournent l'attention des problèmes réels en France. Nous avons des liens historiques étroits avec la France et nous savons qu'elle fait face à de véritables défis (comme les coups d'État en Afrique, qui sont un symptôme réel, la réforme des retraites on n'en parle plus..je veux pas parler d'autres points la pour ne pas m'accuser de se mêler de la politique interne de la France même si j'y réside mais bon..je veux que l'idée soit claire).

Il est triste de constater que la plupart des gens tombent facilement dans ce piège, ce qui pourrait conduire à des divisions internes et à des conflits. Malheureusement, comprendre ces problèmes nécessite un effort d'étude de l'histoire et des enjeux complexes. La montée de l'islamisme est liée au pétrole du Golfe, et il est important de rappeler que l'islam est une religion vieille de 1500 ans, la tendance habit islamique ça date de 1967..La révolution islamique en Iran à rendu les choses encore pire. Le judaïsme et le christianisme ont évolué au fil du temps pour s'adapter à la laïcité, et c'est le résultat d'années de luttes acharnées en France contre le clergé pour séparer l'église de l'état et garantir la liberté de conscience, et ceci est en rapport étroit avec la devise nationale liberté égalité fraternité. C'est un pilier de la république. Malheureusement la plupart des immigrés ne connaissaient pas l'histoire de ce pays, je connais même des français qui ne connaissent pas cette Histoire. La laïcité en France c'est le fruit de luttes historiques. Quant à l'islam, il n'a pas encore connu cette transformation, en grande partie en raison de la légitimité que certains dirigeants moyenâgeux tirent de la religion pour maintenir leur pouvoir (Iran, Arabie Saoudite...).

Ces dirigeants financent des mouvements radicaux et des mosquées en France pour propager une vision extrémiste de l'islam. De plus, certaines puissances mondiales continuent de soutenir ces régimes moyenâgeux en raison de leurs intérêts pétroliers. Tant que la situation au Moyen-Orient ne changera pas, les tensions en France risquent de perdurer, et les gouvernements incompétents en tiront toujours profite.

https://www.reddit.com/r/france/comments/16cujs0/r%C3%A9flexions_sur_labaya_un_point_de_vue_dun_tunisien/

GitHub - system-fonts/modern-font-stacks: System font stack CSS organized by typeface classification for every modern operating system

Il y a quelques années (2013 ) j'avais vu passer des font stacks que j'avais mises de côté dans SnippetVamp ( http://snippetvamp.warriordudimanche.net/index.php?snippet=3A34B87D-684C-49B0-B2B8-39750029AED7 )


font-family: Cambria, "Hoefler Text", Utopia, "Liberation Serif", "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;

/* Modern Georgia-based serif stack */
font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;

/* Traditional Garamond-based serif stack */
font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;

/* Helvetica/Arial-based sans serif stack */
font-family: Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;

/* Verdana-based sans serif stack */
font-family: Corbel, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", Verdana, "Verdana Ref", sans-serif;

/* Trebuchet-based sans serif stack */
font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;

/* Impact-based sans serif stack */
font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;

/* Monospace stack */
font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;```

Un complément ?

De côté pour lecture: une appli simple Android sans Studio – Christophe Cerisara

Je me mets de côté cet article qui explique pas à pas le minimum des bases de la création d'une appli sans usine à gaz.

J'ai essayé de le lire plusieurs fois, mais faudra que j'attende d'être tout seul

What I wish I knew about React

Une lecture à faire avant de se lancer dans une formation React. ( https://www.youtube.com/watch?v=SMgQlTSoXf0&list=PLjwdMgw5TTLWom67YfZuha-1iYzIirwJR )

Quelques notes:

  • React est une bibliothèque, pas un framework.
  • React est une lib UI: elle sert à designer et rendre réactive des interfaces utilisateur. Si ce que tu veux faire ne s'affiche pas à l'écran, React s'en bat les steaks.
  • AngularJS change ta manière de coder en JS mais pas tes pratiques en HTML/CSS alors que React fait le contraire: peu de changement côté JS (hors le code spécifique de ton UI) mais modifie ta façon de créer en HTML/CSS.
  • Les composants React sont toujours des composants UI

Make Beautifully Resilient Apps With Progressive Enhancement

Notes perso de lecture rapide et en diagonale.

rien d'essentiel ne doit dépendre de javascript, en particulier les formulaires.

  • JS peut être désactivé
  • le navigateur peut être obsolète (oui, windows, c'est de toi que je parle)
  • des extensions peuvent bloquer le script
  • le client a peut être une connexion lente qui va timeout
  • le client a peut être une connexion intermittente (genre le train)
  • il peut y avoir un firewall qui bloque certaines choses.
  • etc

En gros, JS devrait être réservé à des choses qu'on ne peut pas faire autrement et/ou non essentielles.

Pour les formulaires, on peut partir d'un formulaire normal fonctionnant normalement et l'améliorer via JS: capturer l'événement onsubmit et gérer l'envoi au serveur via des promises et fetch, traiter les erreurs etc.

Si JS ne fonctionne pas, le formulaire continuera de faire son job avec le comportement par défaut de submit mais de façon moins sexy, c'est tout.

Et si les envois et retours se font en JSON et tout le merdier ?

Problème de type de retour et de format de réception

L'auteur propose d'utiliser le header côté serveur pour identifier qui de JS ou de HTML est à l'origine de la requête (avec Sec-Fetch-Mode par exemple ) et ainsi adapter le comportement du serveur (traitement des données et composition de la réponse)

En gros:

  • si ça vient de JS ➜ gère le JSON et renvoie du JSON pour que JS gère la réponse
  • si ça vient de HTML ➜ gère le formulaire normalement et renvoie une nouvelle page HTML composée côté serveur.
Fil RSS des articles