{"id":232067,"date":"2023-01-09T12:35:00","date_gmt":"2023-01-09T09:35:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=232067"},"modified":"2022-11-10T07:28:28","modified_gmt":"2022-11-10T04:28:28","slug":"accelerez-la-creation-de-tickets-github","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fr\/accelerez-la-creation-de-tickets-github\/","title":{"rendered":"Acc\u00e9l\u00e9rez la cr\u00e9ation de tickets GitHub"},"content":{"rendered":"\n<p>Les probl\u00e8mes GitHub sont fantastiques pour suivre les nouvelles fonctionnalit\u00e9s ou les bogues, qui sont affect\u00e9s, les cat\u00e9goriser, les ajouter aux projets, etc. Ils sont \u00e9galement assez lents \u00e0 cr\u00e9er, et en cr\u00e9er un tas prend beaucoup trop de temps. J&rsquo;ai donc cr\u00e9\u00e9 un petit outil pour acc\u00e9l\u00e9rer la cr\u00e9ation de probl\u00e8mes et en faire un jeu d&rsquo;enfant.<\/p>\n<p>L&rsquo;un des probl\u00e8mes que je vois avec les probl\u00e8mes de <a href=\"https:\/\/startfunction.com\/tag\/github\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">GitHub<\/a> au travail est qu&rsquo;ils sont lourds \u00e0 cr\u00e9er, en particulier pour ceux qui ne sont pas des d\u00e9veloppeurs, comme les gestionnaires, les concepteurs ou les testeurs, et qui veulent simplement signaler un bogue mais ne passent pas par le processus de cr\u00e9ation sur GitHub.<\/p>\n<h3>La cr\u00e9ation de probl\u00e8mes GitHub devrait \u00eatre rapide<\/h3>\n<p>Alors, quelle est l&rsquo;interaction la plus facile avec les ordinateurs, l&rsquo;\u00e9criture, peut-\u00eatre\u00a0? Je ne sais pas si c&rsquo;est le plus facile, mais c&rsquo;est certainement facile. Ainsi, dans cette simple zone de texte, les probl\u00e8mes peuvent \u00eatre \u00e9crits et chaque ligne sera un probl\u00e8me. Vous tapez et tapez et ne levez pas les mains du clavier pour saisir la souris. Vous pouvez \u00e9galement coller une liste cr\u00e9\u00e9e dans un \u00e9diteur de texte ou une feuille de calcul.<\/p>\n<p>Il est flexible\u00a0: vous pouvez attribuer le probl\u00e8me \u00e0 quelqu&rsquo;un (ou \u00e0 plusieurs, en s\u00e9parant les noms d&rsquo;utilisateur par des virgules) en s\u00e9parant le titre du nom d&rsquo;utilisateur par un caract\u00e8re pipe. Un autre tuyau s\u00e9pare la description, et encore un autre tuyau s\u00e9pare les \u00e9tiquettes, qui peuvent \u00eatre nombreuses, en les s\u00e9parant par des virgules.<\/p>\n<p><strong>Mise \u00e0 jour\u00a0:<\/strong> l&rsquo;application est en ligne sur <a href=\"https:\/\/fast-issues.herokuapp.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">https:\/\/fast-issues.herokuapp.com\/<\/a><\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-158127-61e6ca66df766.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-158127-61e6ca66df766.png\" alt=\"Acc\u00e9l\u00e9rez la cr\u00e9ation de tickets GitHub\" ><\/a><\/p>\n<h3>Aper\u00e7u technique<\/h3>\n<p>Ce projet n&rsquo;est ~encore pas compl\u00e8tement \u00e9toff\u00e9 mais il est d\u00e9j\u00e0~ public \u00e0<\/p>\n<p><a href=\"https:\/\/github.com\/eliorivero\/first-five\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">https:\/\/github.com\/eliorivero\/fast-issues<\/a> <a href=\"https:\/\/github.com\/eliorivero\/fast-issues\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">_<\/a><\/p>\n<p>En guise de pr\u00e9sentation g\u00e9n\u00e9rale\u00a0:<\/p>\n<ul>\n<li>c&rsquo;est une application GitHub qui peut \u00eatre install\u00e9e dans le r\u00e9f\u00e9rentiel o\u00f9 les probl\u00e8mes seront cr\u00e9\u00e9s<\/li>\n<li>a un backend Node.js avec Express comme serveur<\/li>\n<li>le front-end est construit avec React<\/li>\n<li>les biblioth\u00e8ques cl\u00e9s pour travailler rapidement avec GitHub dans Node \u00e9taient <a href=\"https:\/\/github.com\/octokit\/app.js\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">https:\/\/github.com\/octokit\/app.js<\/a> et <a href=\"https:\/\/github.com\/octokit\/rest.js\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">https:\/\/github.com\/octokit\/rest.js\/<\/a><\/li>\n<\/ul>\n<p>Une chose \u00e0 garder \u00e0 l&rsquo;esprit est que nous ne voulons pas atteindre les limites de l&rsquo;API. GitHub recommande de laisser s&rsquo;\u00e9couler au moins une seconde entre les requ\u00eates. J&rsquo;ai mis le script en pause 1,5 secondes entre chaque demande de cr\u00e9ation de probl\u00e8me, c&rsquo;est pourquoi vous verrez dans le GIF ci-dessus que les probl\u00e8mes ne sont pas cr\u00e9\u00e9s instantan\u00e9ment.<\/p>\n<h3>Plus d&rsquo;id\u00e9es<\/h3>\n<p>J&rsquo;ai montr\u00e9 cela \u00e0 un ami et il m&rsquo;a dit qu&rsquo;il avait cette id\u00e9e de cr\u00e9er une extension Chrome pour prendre une capture d&rsquo;\u00e9cran d&rsquo;un bogue, l&rsquo;annoter et la soumettre en tant que probl\u00e8me GitHub. J&rsquo;ai pens\u00e9 que c&rsquo;\u00e9tait une bonne id\u00e9e et j&rsquo;ai cherch\u00e9 un moyen de prendre une capture d&rsquo;\u00e9cran mais dans une application React et j&rsquo;ai rapidement trouv\u00e9 <a href=\"https:\/\/html2canvas.hertzen.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">html2canvas<\/a> qui permet de prendre des captures d&rsquo;\u00e9cran et de les enregistrer en tant que fichiers PNG.<\/p>\n<p>Combiner quelque chose comme \u00e7a avec mon outil pour cr\u00e9er les probl\u00e8mes serait une bonne solution qui pourrait \u00eatre disponible dans une application React pendant son cycle de d\u00e9veloppement ou de mise en sc\u00e8ne. Toute personne testant l&rsquo;application peut d\u00e9clencher le panneau de signalement des probl\u00e8mes et soumettre un probl\u00e8me GitHub. L&rsquo;image devrait encore \u00eatre stock\u00e9e sur un autre serveur, car pour l&rsquo;instant, l&rsquo;API Issues est limit\u00e9e et ne permet pas de t\u00e9l\u00e9charger des images.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Source d&rsquo;enregistrement:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/startfunction.com\" class=\"external external_icon\">startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>GitHub est fantastique mais lent \u00e0 cr\u00e9er. J&rsquo;ai cr\u00e9\u00e9 un petit outil qui facilite la cr\u00e9ation de probl\u00e8mes GitHub en utilisant uniquement du texte brut\u00a0!<\/p>\n","protected":false},"author":1,"featured_media":158128,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[893,769,717,832,780,841],"tags":[1167],"class_list":["post-232067","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-code-2","category-controle-des-sources","category-developpeur","category-guide-pour-les-debutants","category-logiciels-open-source","category-tutoriels","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/232067","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/comments?post=232067"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/posts\/232067\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media\/158128"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/media?parent=232067"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/categories?post=232067"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fr\/wp-json\/wp\/v2\/tags?post=232067"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}