[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.30,0:00:01.00,Default,,0000,0000,0000,,(ding!)
Dialogue: 0,0:00:01.00,0:00:03.48,Default,,0000,0000,0000,,Bonjour!\NBienvenue dans un tutoriel vidéo
Dialogue: 0,0:00:03.48,0:00:05.40,Default,,0000,0000,0000,,à propos de quelque chose lié à p5 appelé
Dialogue: 0,0:00:05.90,0:00:07.26,Default,,0000,0000,0000,,p5-manager
Dialogue: 0,0:00:07.72,0:00:11.26,Default,,0000,0000,0000,,p5-manager est par Chian Hau You
Dialogue: 0,0:00:11.26,0:00:14.72,Default,,0000,0000,0000,,Merci pour avoir fait cet outil merveilleux\NJ'espère que j'ai le droit de faire une vidéo à ce sujet
Dialogue: 0,0:00:14.72,0:00:17.00,Default,,0000,0000,0000,,Je ne suis pas un expert
Dialogue: 0,0:00:17.00,0:00:20.16,Default,,0000,0000,0000,,Je ne peux retirer aucun crédit pour cette chose merveilleuse appelée p5-manager
Dialogue: 0,0:00:20.56,0:00:22.56,Default,,0000,0000,0000,,Mais j'en ai entendu parler et je l'utilisais en classe l'autre jour
Dialogue: 0,0:00:22.72,0:00:25.34,Default,,0000,0000,0000,,ça m'a beaucoup aidé alors j'ai voulu en faire une vidéo
Dialogue: 0,0:00:25.34,0:00:27.34,Default,,0000,0000,0000,,pour que d'autres personnes puissent le connaître
Dialogue: 0,0:00:28.94,0:00:30.94,Default,,0000,0000,0000,,Qu'est ce que p5-manager ?
Dialogue: 0,0:00:30.94,0:00:34.10,Default,,0000,0000,0000,,Vous êtes peut-être conscient qu'une chose que je fait\Net qui est une très mauvaise habitude
Dialogue: 0,0:00:34.58,0:00:36.18,Default,,0000,0000,0000,,Disons que je veux faire un nouveau sketch
Dialogue: 0,0:00:36.18,0:00:39.00,Default,,0000,0000,0000,,Je vais sur p5js.org\N- c'est une bonne technique, ça -
Dialogue: 0,0:00:39.02,0:00:41.02,Default,,0000,0000,0000,,puis je vais sur "Download" (Télécharger)
Dialogue: 0,0:00:41.12,0:00:43.88,Default,,0000,0000,0000,,après je suis la : "Hmm, lequel je dois télécharger?"
Dialogue: 0,0:00:44.08,0:00:46.40,Default,,0000,0000,0000,,"Je vais télécharger la version complète",\Net je clique dessus
Dialogue: 0,0:00:47.04,0:00:51.92,Default,,0000,0000,0000,,ça télécharge quelque chose, et regardez,\Nvoici à quel point je suis ridiculement horrible
Dialogue: 0,0:00:52.00,0:00:55.58,Default,,0000,0000,0000,,Vous pouvez voir que je l'ai fait,\Nc'est genre la 9e fois que je fais ça...
Dialogue: 0,0:00:55.84,0:01:01.12,Default,,0000,0000,0000,,La même chose ! Et après je l'ouvre,\Net je trouve quelque part à l'intérieur
Dialogue: 0,0:01:01.32,0:01:05.04,Default,,0000,0000,0000,,"Ho, il y a un exemple vide!"\NEt je le renomme , ou je le copie quelque part
Dialogue: 0,0:01:05.04,0:01:08.60,Default,,0000,0000,0000,,et c'est mon nouveau sketch sur lequel je vais travailler\NCe n'est pas un bon workflow.
Dialogue: 0,0:01:08.80,0:01:13.48,Default,,0000,0000,0000,,p5-manager est un outil en ligne de commande\N- que vous pouvez exécuter en ligne de commande -
Dialogue: 0,0:01:13.56,0:01:15.56,Default,,0000,0000,0000,,Qu'est-ce que la ligne de commande?\NVous savez, je l'utilise dans certaines vidéos
Dialogue: 0,0:01:17.00,0:01:21.20,Default,,0000,0000,0000,,p5-manager est construit à partir de Node et j'ai une autre vidéo (lien dans la description) sur ce qu'est Node
Dialogue: 0,0:01:21.20,0:01:23.88,Default,,0000,0000,0000,,Vous n'avez pas vraiment besoin de savoir ce qu'est Node
Dialogue: 0,0:01:23.88,0:01:25.56,Default,,0000,0000,0000,,Vous avez besoin d'installer Node pour utiliser ceci
Dialogue: 0,0:01:25.72,0:01:31.20,Default,,0000,0000,0000,,Vous pouvez aller sur nodejs.org / installer Node et après vous pourrez utiliser ceci
Dialogue: 0,0:01:31.44,0:01:36.28,Default,,0000,0000,0000,,Node viens avec quelque chose appelé npm\N- Node Package Manager (Gestion de Paquet Node) -
Dialogue: 0,0:01:36.64,0:01:39.12,Default,,0000,0000,0000,,C'est un moyen de gérer les packages que vous voulez utiliser avec Node
Dialogue: 0,0:01:40.68,0:01:45.72,Default,,0000,0000,0000,,et, pourquoi est-ce pertinent, parce que p5-manager est un package Node
Dialogue: 0,0:01:46.88,0:01:52.64,Default,,0000,0000,0000,,Node est un framework de programmation javascript coté serveur et il y a plein de chose à dire sur ce qu'on peut faire avec
Dialogue: 0,0:01:52.64,0:01:58.76,Default,,0000,0000,0000,,mais on ne va pas vraiment faire quelque chose avec Node, on va juste se servir de ce quelqu'un a déja fait
Dialogue: 0,0:01:58.76,0:02:00.16,Default,,0000,0000,0000,,p5-manager
Dialogue: 0,0:02:00.52,0:02:05.56,Default,,0000,0000,0000,,Donc, si Node est installé, la prochaine chose à faire est d'aller ici et lancer cette commande
Dialogue: 0,0:02:05.84,0:02:11.32,Default,,0000,0000,0000,,Ce que je veux lancer est nmp (Node Package Manager) install (je veux installer quelque chose)
Dialogue: 0,0:02:11.32,0:02:12.40,Default,,0000,0000,0000,,tiret g
Dialogue: 0,0:02:12.72,0:02:16.28,Default,,0000,0000,0000,,tiret g est un détail important mais pas si important pour nous pour le moment
Dialogue: 0,0:02:16.28,0:02:18.04,Default,,0000,0000,0000,,ça veux dire que je veux installer ça de manière globale
Dialogue: 0,0:02:18.24,0:02:22.04,Default,,0000,0000,0000,,ça ne fait pas parti d'un seul projet mais c'est quelque chose que je veux pouvoir utiliser
Dialogue: 0,0:02:22.04,0:02:24.32,Default,,0000,0000,0000,,n'importe où sur mon ordinateur à partir de maintenant
Dialogue: 0,0:02:24.60,0:02:26.60,Default,,0000,0000,0000,,p5-manager est... à moi maintenant
Dialogue: 0,0:02:27.20,0:02:29.20,Default,,0000,0000,0000,,Je peux prendre ça
Dialogue: 0,0:02:29.84,0:02:31.84,Default,,0000,0000,0000,,et je peux le copier
Dialogue: 0,0:02:33.04,0:02:36.72,Default,,0000,0000,0000,,et je peux aller ici et je vais juste le coller\N- j'aurai pu le taper -
Dialogue: 0,0:02:36.84,0:02:38.84,Default,,0000,0000,0000,,ça peut me donner une erreur !
Dialogue: 0,0:02:38.84,0:02:40.44,Default,,0000,0000,0000,,ça peut me donner une erreur\Nça peut vous arriver
Dialogue: 0,0:02:40.68,0:02:42.88,Default,,0000,0000,0000,,On va espérer qu'il n'y en ai pas\N- mais il peut y en avoir une -
Dialogue: 0,0:02:43.16,0:02:47.76,Default,,0000,0000,0000,,En fait, ça serai bien si il y en a une, comme ça vous pourrez la voir et savoir comment la corriger
Dialogue: 0,0:02:50.16,0:02:51.72,Default,,0000,0000,0000,,(roulements de tambour)
Dialogue: 0,0:02:53.36,0:02:55.36,Default,,0000,0000,0000,,Allez ! Installe toi !
Dialogue: 0,0:02:58.04,0:03:00.04,Default,,0000,0000,0000,,Regardez, on a l'erreur !
Dialogue: 0,0:03:02.04,0:03:05.56,Default,,0000,0000,0000,,Alors, qu'est-ce que l'erreur?\NL'erreur est "Permission refusée"
Dialogue: 0,0:03:06.36,0:03:10.88,Default,,0000,0000,0000,,C'est parce qu'on veut l'installer de manière globale
Dialogue: 0,0:03:11.48,0:03:16.00,Default,,0000,0000,0000,,Si on l'installe de manière globale, ça veut dire qu'il doit aller dans les profondeurs de votre ordinateur
Dialogue: 0,0:03:16.08,0:03:20.00,Default,,0000,0000,0000,,où seuls les administrateurs - peu importe qui ils sont, ça peut être vous -
Dialogue: 0,0:03:20.08,0:03:24.92,Default,,0000,0000,0000,,Vous devez entrer dans le cœur des fichiers système et dans toutes sortes de lieux sophistiqués
Dialogue: 0,0:03:25.20,0:03:26.44,Default,,0000,0000,0000,,où vous devez avoir la permission d'accès
Dialogue: 0,0:03:26.80,0:03:30.52,Default,,0000,0000,0000,,Il y a un moyen d'obtenir la permission de faire ça
Dialogue: 0,0:03:31.76,0:03:34.76,Default,,0000,0000,0000,,Le moyen de faire ça avec le terminal est en écrivant "sudo"
Dialogue: 0,0:03:34.76,0:03:38.80,Default,,0000,0000,0000,,qui veut dire "Super Utilisateur DO (fait)"
Dialogue: 0,0:03:38.84,0:03:49.04,Default,,0000,0000,0000,,Super Utilisateur DO npm install tiret g p5-manager
Dialogue: 0,0:03:49.52,0:03:52.08,Default,,0000,0000,0000,,et la... ho, il me demande mon mot de passe
Dialogue: 0,0:03:53.68,0:03:55.68,Default,,0000,0000,0000,,je crois que je connais le mot de passe
Dialogue: 0,0:03:57.32,0:04:02.24,Default,,0000,0000,0000,,Désolé pour ça, heureusement vous regardez ça et j'ai juste réapparu et j'ai trouvé le mot de passe
Dialogue: 0,0:04:02.24,0:04:05.84,Default,,0000,0000,0000,,Je l'ai entré, je vais lancer la commande sudo pour vous encore une fois
Dialogue: 0,0:04:05.84,0:04:09.04,Default,,0000,0000,0000,,avec le bon mot de passe pour que vous puissiez voir
Dialogue: 0,0:04:09.28,0:04:14.68,Default,,0000,0000,0000,,(roulement de tambour)
Dialogue: 0,0:04:15.92,0:04:17.92,Default,,0000,0000,0000,,(ta da !!)
Dialogue: 0,0:04:18.24,0:04:20.24,Default,,0000,0000,0000,,Ok, il semblerait que ça ait fonctionné
Dialogue: 0,0:04:20.52,0:04:22.52,Default,,0000,0000,0000,,Donc maintenant
Dialogue: 0,0:04:22.84,0:04:27.84,Default,,0000,0000,0000,,J'ai installé pour toujours p5-manager avec Node
Dialogue: 0,0:04:28.52,0:04:32.24,Default,,0000,0000,0000,,Il y a plein de chose que vous pouvez faire avec p5-manager
Dialogue: 0,0:04:32.84,0:04:36.80,Default,,0000,0000,0000,,et je vous encourage\N(peut-être que je reviendrai la dessus si c'est intéressant)
Dialogue: 0,0:04:36.88,0:04:39.68,Default,,0000,0000,0000,,Je vous vous montrer la manière la plus simple de l'utiliser
Dialogue: 0,0:04:39.72,0:04:43.52,Default,,0000,0000,0000,,p5-manager va en fait vous permettre de créer une collection de sketchs
Dialogue: 0,0:04:43.76,0:04:52.04,Default,,0000,0000,0000,,et vous pouvez faire un serveur avec un page web avec un sommaire avec tous les sketchs faits
Dialogue: 0,0:04:53.00,0:04:55.00,Default,,0000,0000,0000,,Vous devriez... vous pouvez suivre ces instructions pour ça
Dialogue: 0,0:04:55.16,0:05:02.00,Default,,0000,0000,0000,,Moi, je vais scroller en bas et ce que je veux juste faire est générer un projet seul
Dialogue: 0,0:05:02.48,0:05:07.00,Default,,0000,0000,0000,,Pour moi, qui ne fait que des exemples que je place à différents endroits,
Dialogue: 0,0:05:07.00,0:05:09.80,Default,,0000,0000,0000,,c'est plus des projets seul qu'une collection
Dialogue: 0,0:05:13.16,0:05:15.16,Default,,0000,0000,0000,,Maintenant que j'ai installer ce package,
Dialogue: 0,0:05:15.16,0:05:17.84,Default,,0000,0000,0000,,je peux juste écrire p5 n'importe quand dans mon terminal
Dialogue: 0,0:05:18.88,0:05:23.32,Default,,0000,0000,0000,,et ça va répondre:\N"Hey, vous avez installé p5-manager version 0.3.2"
Dialogue: 0,0:05:23.96,0:05:27.96,Default,,0000,0000,0000,,Mais quand je veux lancer une commande précise
Dialogue: 0,0:05:28.00,0:05:30.00,Default,,0000,0000,0000,,comme p5 generate
Dialogue: 0,0:05:30.20,0:05:32.20,Default,,0000,0000,0000,,ça va générer un projet
Dialogue: 0,0:05:32.52,0:05:37.04,Default,,0000,0000,0000,,et je dois lui donner des arguments, des paramètres spécifiques sur quel type de projet je veux générer
Dialogue: 0,0:05:37.32,0:05:41.44,Default,,0000,0000,0000,,Ce que je veux faire, c'est générer un bundle (paquet) avec un nom spécifique
Dialogue: 0,0:05:41.84,0:05:44.88,Default,,0000,0000,0000,,Pour faire court, vous pouvez juste taper\N"p5 g tiret b"
Dialogue: 0,0:05:45.00,0:05:48.16,Default,,0000,0000,0000,,mais je vais utiliser la manière longue parce que c'est un tutoriel vidéo
Dialogue: 0,0:05:48.52,0:05:50.52,Default,,0000,0000,0000,,tiret tirer bundle
Dialogue: 0,0:05:51.00,0:05:55.84,Default,,0000,0000,0000,,et "codingtrain" sera le nom de mon projet
Dialogue: 0,0:05:55.84,0:05:58.12,Default,,0000,0000,0000,,je vais appuyer sur entrer
Dialogue: 0,0:05:59.36,0:06:01.96,Default,,0000,0000,0000,,Maintenant que ça a marché, je me rend compte que j'ai fait quelque chose de terrible
Dialogue: 0,0:06:01.96,0:06:09.60,Default,,0000,0000,0000,,Quand on ouvre un terminal - au moins sur un Mac, on arrive dans le répertoire racine de votre ordinateur
Dialogue: 0,0:06:09.84,0:06:13.68,Default,,0000,0000,0000,,ce n'est pas là où je veux mettre mon projet "codingtrain"
Dialogue: 0,0:06:13.68,0:06:18.12,Default,,0000,0000,0000,,Donc, c'est un peu en dehors du sujet mais vous pouvez changer de répertoire de travail
Dialogue: 0,0:06:18.24,0:06:21.92,Default,,0000,0000,0000,,Je peux taper "cd Documents/" parce que je veux travailler dans "Documents"
Dialogue: 0,0:06:22.16,0:06:26.76,Default,,0000,0000,0000,,et je peux créer un dossier appelé "p5_projects" qui existe déjà
Dialogue: 0,0:06:27.04,0:06:32.00,Default,,0000,0000,0000,,je peux taper "cd p5_projects/" et maintenant je vais retourner en arrière et lancer cette commande
Dialogue: 0,0:06:32.00,0:06:33.48,Default,,0000,0000,0000,,une fois de plus
Dialogue: 0,0:06:35.16,0:06:38.52,Default,,0000,0000,0000,,J'ai lancé la commande une fois de plus, vous pouvez voir qu'elle a crée ce projet
Dialogue: 0,0:06:38.88,0:06:42.68,Default,,0000,0000,0000,,Je peux retourner dans le Finder, aller dans p5_projects et regardez ce que l'on a
Dialogue: 0,0:06:43.04,0:06:46.16,Default,,0000,0000,0000,,J'ai maintenant un dosser appelé "codingtrain"
Dialogue: 0,0:06:46.60,0:06:50.48,Default,,0000,0000,0000,,qui est un projet avec le fichier html, le fichier sketch.js
Dialogue: 0,0:06:50.76,0:06:52.76,Default,,0000,0000,0000,,Oups! je l'ai ouvert par accident
Dialogue: 0,0:06:53.24,0:06:57.04,Default,,0000,0000,0000,,Et il y a le dossier bibliothèques avec la bibliothèque p5
Dialogue: 0,0:06:59.20,0:07:01.20,Default,,0000,0000,0000,,Voilà comment créer un projet p5 seul
Dialogue: 0,0:07:01.44,0:07:04.68,Default,,0000,0000,0000,,Je peux faire ça à chaque fois maintenant, je vais le faire dans mes prochaines vidéos
Dialogue: 0,0:07:04.68,0:07:06.56,Default,,0000,0000,0000,,Je peux travailler de cette façon
Dialogue: 0,0:07:07.44,0:07:11.88,Default,,0000,0000,0000,,Et j'aurai à chaque fois la version la plus récente de la bibliothèque p5
Dialogue: 0,0:07:11.88,0:07:14.32,Default,,0000,0000,0000,,Je vous encourage à explorer les collections
Dialogue: 0,0:07:16.72,0:07:18.72,Default,,0000,0000,0000,,Les collections...
Dialogue: 0,0:07:19.48,0:07:23.44,Default,,0000,0000,0000,,Cette fonctionnalité vous permet de faire cette belle petite page web
Dialogue: 0,0:07:23.44,0:07:25.00,Default,,0000,0000,0000,,ça le fait automatiquement avec tous vos projets.
Dialogue: 0,0:07:25.32,0:07:28.32,Default,,0000,0000,0000,,Ok! Merci d'avoir regardé cette vidéo à propos de p5-manager
Dialogue: 0,0:07:28.40,0:07:31.48,Default,,0000,0000,0000,,J'espère qu'elle aura été utile pour vous. Je vous verrez dans une prochaine vidéo
Dialogue: 0,0:07:31.80,0:07:35.16,Default,,0000,0000,0000,,où vous pourriez me voir utiliser p5-manager\NMerci beaucoup !