Niveau débutant

Niveau intermédiaire

Niveau expérimenté

• Introduction au réseau local : comprendre le fonctionnement d’un réseau local, apprendre à monter et à analyser un réseau local avec un mini-PC. (36 p.) – 1€
• HTML : Les bases (38 p.) – 1€
• Apprendre à créer un simple serveur HTML avec Pyduino (36 p.) – 1€
• Apprendre à créer un simple serveur HTML gérant facilement les url et multithreadé (34 p.) – 1€
• Apprendre à créer un serveur de fichiers entièrement local très simplement (28 p.) – 1€

• Javascript : Les bases (33 p.) – 1€
• jQuery : Les bases (22 p.) – 1€
• Apprendre à créer un serveur HTML + JS/jQUery portable (=entièrement dans un répertoire)
• Apprendre à créer un serveur HTML + JS/jQUery + Ajax portable (=entièrement dans un répertoire)

• Utiliser des librairies JS/JQuery : Les bases (36 p.) – 1€
• Serveur utilisant librairies JS/jQuery entièrement local (62 p.) – 2€
• Serveur utilisant librairies JS/jQuery et Ajax entièrement local (xx p.) – 2€

Atelier Pyduino : Introduction au réseau local : comprendre le fonctionnement d’un réseau local, apprendre à monter et à analyser un réseau local avec un mini-PC.
Niveau : Débutant | Durée travail : 2H00 | Difficulté : | Prix : 1€ | Taille : 36 pages |

Description :
L’objectif ici est de comprendre le principe d’un réseau local, le concept d’adresse IP, d’apprendre à constituer et monter un réseau local de base, d’apprendre à récupérer les informations importantes d’un réseau local, d’apprendre à tester le bon fonctionnement du réseau… afin d’être en mesure d’utiliser un mini-PC programmé avec Pyduino sur un réseau local.

Contenu : Focus sur quelques éléments utiles pour la constitution du réseau local en mode filaire | Concrètement, ce que vous devez faire pour passer à l’action… | Un réseau local : … c’est un peu comme une équipe de foot ! | Au sein du réseau local : le n°1, un joueur un peu particulier ! | Technique : comment savoir quels numéros de l’adresse IP représentent la « couleur du maillot » ? | Exercices d’entraînement | Technique : Réseau : Comprendre les adresses IP : Synthèse | Fonctionnement du réseau | Synthèse : Un peu de vocabulaire pour avoir les idées claires | Monter le réseau local minimum | Tester et explorer le réseau : mise sous tension et récupération de l’adresse IP du poste fixe | Tester le réseau : Faire un « ping » vers le routeur depuis le poste fixe | Technique : Se connecter à l’interface du routeur et connaître la plage des adresses DHCP | Monter un réseau multi-postes : utiliser un « switch » éthernet si besoin… | Truc avancé : connaître tous les postes présents sur un réseau local à partir d’un poste fixe connecté au réseau ! | Les IP statiques : « allez, on fait tout à la main… ! » | Un cas à part : « le gars qui se pointe avec son maillot déjà sur lui»… | Et en wifi ??? | Le réseau utilisé : mini-PC + poste fixe sur un même réseau local | Détail des éléments du réseau local avec Pyduino que nous allons utiliser | Monter le réseau utilisant le mini-PC | Monter le réseau utilisant le mini-PC sur un réseau avec « box » existant | Faire un simple « ping » vers le mini-PC à partir d’un poste fixe : le réseau | Faire un simple « ping » vers le shield Ethernet à partir d’un poste fixe : le programme | Pour info : Un réseau local utilisant des blocs CPL | Réseaux local avec blocs CPL : exemples de réseaux

Instructions étudiées : ping | nmap

1.00€

Atelier Pyduino : HTML : Les bases : panorama des balises utiles pour créer des webapps.
Niveau : Débutant | Durée travail : 2H30 | Difficulté : | Prix : 1€ | Taille : 38 pages |

Description :
L’objectif ici est d’apprendre à créer une page HTML et à découvrir les différentes balises utiles en vue de la création de mini-webapps afin d’être en mesure de savoir écrire et tester une mini-page HTML.

Contenu : Réseau : Notion de serveur / client | Notion de base d’HTML | S’installer pour écrire de l’HTML : utiliser un éditeur HTML | Structure type d’une page HTML simple et écrire une première page HTML | Les balises d’entête (head) | Attributs globaux HTML communs à toutes les balises : | Tester simplement des balises HTML | Les balises de base | Page HTML de test des balises de base | Les balises de mise en page | Page de test des balises de mise en page | Les balises de « widgets » graphiques basés sur la balise <input> | Les nouvelles balises HTML5 de « widgets » graphiques basés sur la balise <input> | Page HTML de test des widgets graphiques basé sur la balise <input> | Les widgets graphiques HTML ayant des balises dédiées | Page HTML de test des widgets graphiques ayant des balises dédiées | Les balises de widgets graphiques « multimédia » | Page HTML de test des widgets graphiques « multimédia » | Un exemple de mise en page widgets graphiques |

1.00€

Atelier Pyduino : Apprendre à créer un simple serveur HTML gérant facilement les url et multithreadé.
Niveau : Débutant | Durée travail : 1H30 | Difficulté : | Prix : 1€ | Taille : 36 pages |

Description :
Nous avons déjà présenté dans un autre tuto comment réaliser un serveur avec Pyduino « façon Arduino »… mais cette façon de faire a vite ses limites, notamment pour gérer les requêtes client. Il est possible de faire beaucoup mieux et beaucoup plus robuste en langage Python. L’objectif ici est de monter un réseau local utilisant un mini-PC + Pyduino, de présenter une solution simplifiée de gestion des requêtes HTTP tout en étant multithreadée, de réaliser simplement un serveur HTML avec Pyduino afin d’être en mesure de créer un serveur web basique multithreadé avec un mini-PC+Pyduino.

Contenu : Technique : Retour sur la structure d’un réseau local et matériel nécessaire | Synthèse : Un peu de vocabulaire pour avoir les idées claires | Le réseau utilisé : mini-PC Pyduino + poste fixe sur un même réseau local | Monter le réseau utilisant le mini-PC | Monter le réseau utilisant le mini-PC sur un réseau avec « box » existant | Technique : Réseau : Notion de serveur / client, notion de port | Technique : Réseau : Notion de protocole http: la communication entre le serveur et le client web. (1) | Technique : Réseau : Notion de protocole http : la communication entre le serveur et le client web. (2) | Pyduino : les fonctions réseau de la librairie Pyduino en mode serveur. | Les limites de la mise en place d’un serveur « façon arduino » avec Pyduino et solutions | Module Python : gérer facilement des requêtes HTML avec Bottle | Module Python : créer facilement un serveur TCP « multi-threadé » avec CherryPy | Exemple de code Python minimal Bottle + CherryPy utilisés seuls | Mémo : Bottle : Quelques exemples de routes/réponses « type » utiles en pratique  | Exemple de code Pyduino minimal utilisant Bottle + CherryPy | Technique : Réseau : Notion de base d’HTML | Structure type d’une page HTML simple et écrire une première page HTML | Pyduino + Bottle : Transformer le mini-PC en un simple serveur HTML : le programme  |

1.00€

Atelier Pyduino : Créer un serveur de fichiers local entièrement dans un répertoire avec un mini-PC + Pyduino.
Niveau : Débutant | Durée travail : 1H30 | Difficulté : | Prix : 1€ | Taille : 28 pages |

Description :
Réaliser ou utiliser un serveur de fichiers est une nécessité incontournable dès lors que l’on souhaite accéder à des fichiers présents côté serveur ou encore utiliser des ressources (images, librairies javascript,..) pour intégrer des fonctionnalités évoluées à une webapp. Il existe plusieurs solutions (serveur externe, serveur HTTP local, etc…) : je vous montre dans ce tuto comment le faire très simplement à partir d’un code Pyduino + Bottle afin que vous soyez en mesure de créer un serveur de fichiers entièrement local dans un répertoire avec un mini-PC.

Contenu : Le réseau utilisé : mini-PC Pyduino + poste fixe sur un même réseau local | Monter le réseau utilisant le mini-PC | Monter le réseau utilisant le mini-PC sur un réseau avec « box » existant | Technique : Réseau : Notion de serveur / client, notion de port | Technique : Réseau : Notion de protocole http: la communication entre le serveur et le client web. (1) | Technique : Réseau : Notion de protocole http : la communication entre le serveur et le client web. (2) | Pyduino : les fonctions réseau de la librairie Pyduino en mode serveur. | Les limites de la mise en place d’un serveur « façon arduino » avec Pyduino et solutions | Module Python : gérer facilement des requêtes HTML avec Bottle | Module Python : créer facilement un serveur TCP « multi-threadé » avec CherryPy | Exemple de code Python minimal Bottle + CherryPy utilisés seuls | Mémo : Bottle : Quelques exemples de routes/réponses « type » utiles en pratique  | Discussion technique : créer un serveur de fichiers | Pyduino + Bottle : Créer un serveur de fichiers texte : le programme | C’est tout ? |

1.00€

Atelier Pyduino : Javascript : les bases à connaître pour coder en langage Javascript.
Niveau : Intermédiaire | Durée travail : 2H00 | Difficulté : | Prix : 1€ | Taille : 32 pages |

Description :
L’objectif ici est d’apprendre les bases du langage Javascript afin d’être en mesure de coder par la suite en Javascript au sein de vos websapps. Ce tuto se concentre sur la syntaxe du langage Javascript lui-même que vous pourrez tester facilement grâce à un interpréteur Javascript.

Contenu : Notion de script « côté client» et présentation du langage Javascript | Panorama rapide de la syntaxe de base du langage Javascript | S’installer pour apprendre et tester le langage Javascript | Syntaxe de base du Javascript  | Constantes et variables | A vous de jouer ! | Conversion de type | Opérations arithmétiques et fonctions mathématiques | Tableaux (ou listes) : création, accès aux éléments | Tableaux (ou listes) : les opérations de base | La condition if … else ..  | Les opérateurs logiques en Javascript | Quelques exemples | La boucle For | La boucle conditionnelle while | Interruption/sortie de boucles ou de conditions | Déclarer une fonction | Quelques exemples de fonctions | Fonctions et portée des variables | Usage avancé : Les objets en Javascript | Usage avancé : Les fonctions de l’objet String (chaîne de caractères) | Usage avancé : Utilisation des dates | Usage avancé : Utilisation des expressions régulières | Usage avancé : Gestion des erreurs et exceptions | Usage avancé : le « strict mode »

1.00€

Atelier Pyduino : Javascript : librairie jQuery : les bases de l’utilisation de jQuery et de la manipulation des éléments du DOM.
Niveau : Intermédiaire | Durée travail : 1H30 | Difficulté : | Prix : 1€ | Taille : 24 pages |

Description :
L’objectif ici est de découvrir comment la librairie Javascript jQuery simplifie le codage en Javascript et permet d’accéder facilement aux éléments de la page web ainsi qu’aux évènements, afin d’être en mesure d’écrire des webapps encore plus efficacement !

Contenu : Intégrer une librairie Javascript à une webapp (page HTML + JS) | Installation de la librairie jQuery | S’installer pour tester la librairie jQuery | La librairie jQuery. | La syntaxe générale d’une instruction jQuery : | Les sélecteurs JQuery | A vous de jouer… | Les « events » ou « fire » | Utilisation des évènements : à vous de jouer… | Les effets | Utilisation des effets : vous de jouer… | Chaînage | Gestion des éléments du DOM : accès aux propriétés HTML des éléments du DOM | Gestion des éléments du DOM : ajout /retrait de texte aux éléments du DOM | A vous de jouer… | Autres possibilités offertes par JQuery | A vous de jouer… | Encore plus fort… | Mixer Javascript et jQuery dans un même script ?

1.00€

Atelier Pyduino : HTML + Javascript/jQuery : Apprendre à utiliser des librairies Javascript / jQuery dans une webapp.
Niveau : Avancé% | Durée travail : 2H30 | Difficulté : | Prix : 1€ | Taille : 36 pages |

Description :
L’objectif ici est d’apprendre à utiliser des librairies Javascript et jQuery afin d’être en mesure d’utiliser des librairies existantes dans vos futures webapps. Grâce aux librairies Javascript / jQuery vous allez pouvoir intégrer n’importe quelle fonctionnalité utile à votre webapp : affichage temps-réel, digit graphique, courbe de série de données zoomable, tableau graphique de données, widgets graphiques, galerie d’image… Du lourd, du « très lourd » même !

Contenu : Introduction aux librairies Javascript | Intégrer une librairie Javascript à une webapp (page HTML + JS) | Installer et tester votre première librairie Javascript | Installation de la librairie Javascript SegmentDisplay | Installation de la librairie Javascript Dygraphs | Rappel : Installation de la librairie jQuery | Installation de la librairie w2ui (jQuery) | Installation de la librairie jQuery UI | Installation de la librairie GalleryView (jQuery + jQuery UI) | Liste de librairies utiles pour la création de webapps : synthèse par thème

1.00€

Serveur HTML+jQuery

Serveur HTML+jQuery+Ajax

Sans Lib JS

• Afficher message dans zone texte sur clic bouton

• Afficher un message dans une zone texte sur clic bouton par réponse Ajax
• Afficher un message dans une zone texte en réponse à une requête Ajax à intervalles réguliers
• Afficher un message dans une zone texte en réponse à une requête Ajax à intervalles réguliers (variante avec setTimeout)

jQueryUI

• Obtenir la date courante à partir d’un datepicker

• Afficher dans zone texte la date sélectionnée à partir d’un Datepicker par réponse Ajax
• Ouvrir un fichier daté à partir d’un Datepicker par réponse Ajax

w2ui:sidebar

• Afficher un w2sidebar d’exemple
• Afficher dans un w2sidebar la liste des fichiers d’un répertoire et le nom du fichier sélectionné dans une zone texte

• Afficher le contenu d’un fichier texte sélectionné à l’aide d’un w2sidebar

w2ui:grid

• Afficher dans un w2grid de test
• Afficher dans un w2grid une série de données horodatées
• Afficher dans un w2grid une série de données horodatées à partir d’un fichier de données

• Afficher dans un w2grid une série de données horodatées à partir d’un fichier sélectionné par un Datepicker
• Afficher dans un w2grid une série de données horodatées à partir d’un fichier sélectionné par un w2sidebar – v1 « serveur side »
• Afficher dans un w2grid une série de données horodatées à partir d’un fichier sélectionné par un w2sidebar – v1 « client side »

Dygraphs

• Afficher dans un graphique Dygraphs une série de données horodatées de test
• Afficher dans un graphique Dygraphs une série de données horodatées à partir d’un fichier

• Afficher dans un graphique Dygraphs une série de données horodatées à partir d’un fichier daté sélectionné par un Datepicker
• Afficher dans un graphique Dygraphs une série de données horodatées à partir d’un fichier daté sélectionné par un w2sidebar

Smoothie

• Afficher un graphique temps réel de test

• Actualiser un graphique temps réel par requête Ajax