{"id":2572,"date":"2024-08-03T09:19:17","date_gmt":"2024-08-03T07:19:17","guid":{"rendered":"https:\/\/devportfolio.net\/wp-dev-blog\/?p=2572"},"modified":"2024-08-03T10:27:39","modified_gmt":"2024-08-03T08:27:39","slug":"environnement-node-js-typescript-et-angular-avec-dev-containers","status":"publish","type":"post","link":"https:\/\/devportfolio.net\/wp-dev-blog\/environnement-node-js-typescript-et-angular-avec-dev-containers\/","title":{"rendered":"Environnement Node.js, TypeScript et Angular avec Dev Containers"},"content":{"rendered":"\n<p>Cet article liste les \u00e9tapes n\u00e9cessaires \u00e0 l&rsquo;installation simple et rapide d&rsquo;un <strong>environnement de d\u00e9veloppement<\/strong> Node.js, TypeScript et Angular sans modifier le syst\u00e8me local \u00e0 l&rsquo;aide des <a href=\"https:\/\/code.visualstudio.com\/docs\/devcontainers\/containers\">Dev Containers<\/a> de VSCode.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Pr\u00e9requis<\/h3>\n\n\n\n<p>Pour suivre ce guide, vous aurez besoin des \u00e9l\u00e9ments suivants :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>VSCode<\/strong><\/li>\n\n\n\n<li><strong>Docker Desktop <\/strong><\/li>\n\n\n\n<li><strong>WSL version 2<\/strong><\/li>\n\n\n\n<li><strong>Plugin Dev Containers install\u00e9 dans VSCode<\/strong><\/li>\n<\/ul>\n\n\n\n<p>Ce guide est bas\u00e9 sur l&rsquo;utilisation de Windows 11 avec WSL2, mais fonctionne \u00e9galement avec Windows 10.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Cr\u00e9er le conteneur<\/h3>\n\n\n\n<p>L&rsquo;objectif de cet article est de cr\u00e9er les bases d&rsquo;une application Angular pour mon projet <a href=\"https:\/\/hub.docker.com\/r\/onerahmet\/openai-whisper-asr-webservice\">Whisper ASR<\/a>, un service web capable de convertir automatiquement des enregistrements audio en texte dans plusieurs langues. Dans cette partie seules les \u00e9tapes n\u00e9cessaires pour mettre en place un environnement de d\u00e9veloppement conteneuris\u00e9 sont d\u00e9crites.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 1 : Cr\u00e9er le r\u00e9pertoire de travail<\/h4>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Cr\u00e9ez un r\u00e9pertoire nomm\u00e9 <code>\/whisper-ws<\/code> et ouvrez ce dossier dans VSCode.<\/li>\n\n\n\n<li>Ouvrez la palette de commandes avec <code>Ctrl + Shift + P<\/code> et s\u00e9lectionnez l&rsquo;option \u00ab\u00a0<strong>Dev Containers: Add Dev Container Configuration Files<\/strong>\u00ab\u00a0.<\/li>\n\n\n\n<li>Choisissez \u00ab\u00a0<strong>Add configuration to Workspace<\/strong>\u00ab\u00a0. Cette option permet de configurer un environnement de d\u00e9veloppement conteneuris\u00e9 sp\u00e9cifique \u00e0 l&rsquo;espace de travail actuel dans Visual Studio Code.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"701\" height=\"176\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image.png\" alt=\"\" class=\"wp-image-2573\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image.png 701w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-300x75.png 300w\" sizes=\"auto, (max-width: 701px) 100vw, 701px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"661\" height=\"179\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-1.png\" alt=\"\" class=\"wp-image-2574\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-1.png 661w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-1-300x81.png 300w\" sizes=\"auto, (max-width: 661px) 100vw, 661px\" \/><\/figure>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>Prompt ChatGPT : \u00ab\u00a0Peux-tu m&rsquo;expliquer simplement que fait l&rsquo;option \u00ab\u00a0Add configuration to Workspace\u00a0\u00bb du plugin VsCode DevContainers ?<\/p>\n<\/blockquote>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 2 : Utiliser l&rsquo;image Node.js &amp; TypeScript<\/h4>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Choisissez l&rsquo;image contenant Node.js et TypeScript. Utilisez la version 22 de Node, bas\u00e9e sur Debian 12 (Bookworm).<\/li>\n\n\n\n<li>Installez Angular CLI par d\u00e9faut avec le conteneur.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"657\" height=\"208\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-2.png\" alt=\"\" class=\"wp-image-2575\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-2.png 657w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-2-300x95.png 300w\" sizes=\"auto, (max-width: 657px) 100vw, 657px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"641\" height=\"221\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-3.png\" alt=\"\" class=\"wp-image-2576\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-3.png 641w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-3-300x103.png 300w\" sizes=\"auto, (max-width: 641px) 100vw, 641px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"621\" height=\"171\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-4.png\" alt=\"\" class=\"wp-image-2577\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-4.png 621w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-4-300x83.png 300w\" sizes=\"auto, (max-width: 621px) 100vw, 621px\" \/><\/figure>\n\n\n\n<p>\u00c0 la fin de ces \u00e9tapes, un fichier <code>.devcontainer.json<\/code> devrait \u00eatre cr\u00e9\u00e9 :<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"480\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-5-1024x480.png\" alt=\"\" class=\"wp-image-2578\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-5-1024x480.png 1024w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-5-300x141.png 300w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-5-768x360.png 768w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-5.png 1159w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 3 : Construire et ouvrir le conteneur<\/h4>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Ouvrez la palette de commandes avec <code>Ctrl + Shift + P<\/code> et s\u00e9lectionnez \u00ab\u00a0<strong>Dev Containers: Rebuild and Reopen in Container<\/strong>\u00ab\u00a0.<\/li>\n\n\n\n<li>Surveillez le d\u00e9marrage du conteneur et v\u00e9rifiez les logs d&rsquo;ex\u00e9cution.<\/li>\n\n\n\n<li>A la fin de l&rsquo;\u00e9tape 2 ouvrez une console bash avec <code>Ctrl + J<\/code>.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"515\" height=\"155\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-7.png\" alt=\"\" class=\"wp-image-2580\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-7.png 515w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-7-300x90.png 300w\" sizes=\"auto, (max-width: 515px) 100vw, 515px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"740\" height=\"183\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-8.png\" alt=\"\" class=\"wp-image-2581\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-8.png 740w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-8-300x74.png 300w\" sizes=\"auto, (max-width: 740px) 100vw, 740px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 4 : Initialiser le d\u00e9p\u00f4t Git<\/h4>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Initialisez Git dans le r\u00e9pertoire principal du conteneur avec la commande <code>git init<\/code>.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"598\" height=\"358\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-9.png\" alt=\"\" class=\"wp-image-2582\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-9.png 598w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-9-300x180.png 300w\" sizes=\"auto, (max-width: 598px) 100vw, 598px\" \/><\/figure>\n\n\n\n<p>et cr\u00e9ez votre premi\u00e8re application Angular :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\"><code>ng new whisper-ws --skip-git<\/code><\/code><\/pre>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>Je choisi de ne pas cr\u00e9er de fichier Git dans les projets Angular afin de centraliser la gestion des commits au niveau du r\u00e9pertoire principal. Ainsi, il est possible de cr\u00e9er plusieurs projets Angular dans le m\u00eame conteneur tout en g\u00e9rant Git de mani\u00e8re centralis\u00e9e au niveau du dossier parent.<\/p>\n<\/blockquote>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 5 : Configurer Git dans le r\u00e9pertoire principal<\/h4>\n\n\n\n<p>Pour \u00e9viter les avertissements ou erreurs li\u00e9s \u00e0 la s\u00e9curit\u00e9 des r\u00e9pertoires, dans git, lancez la commande suivante :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\"><code>git config --global --add safe.directory \/workspace\/whisper-ws<\/code><\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"686\" height=\"131\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-12.png\" alt=\"\" class=\"wp-image-2586\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-12.png 686w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-12-300x57.png 300w\" sizes=\"auto, (max-width: 686px) 100vw, 686px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 6 : Tester le conteneur<\/h4>\n\n\n\n<p>Modifiez le fichier <code>package.json<\/code> pour que la commande <code>npm<\/code> <code>start <\/code>\u00e9coute sur toutes les interfaces r\u00e9seau du container.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">\"start\": \"ng serve --host 0.0.0.0 --poll 1000\"<\/code><\/pre>\n\n\n\n<p>La commande <code>ng serve --host 0.0.0.0 --poll 1000<\/code> lance un serveur de d\u00e9veloppement Angular avec les options suivantes :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>--host 0.0.0.0<\/code> : permet au serveur de d\u00e9veloppement d&rsquo;\u00eatre accessible depuis toutes les interfaces r\u00e9seau, pas seulement localhost.<\/li>\n\n\n\n<li><code>--poll 1000<\/code> : configure le serveur pour v\u00e9rifier les modifications des fichiers toutes les 1000 millisecondes (1 seconde), ce qui est utile pour les syst\u00e8mes de fichiers qui ne prennent pas en charge les \u00e9v\u00e9nements de changement de fichiers natifs.<\/li>\n<\/ul>\n\n\n\n<h5 class=\"wp-block-heading\">Ex\u00e9cuter l&rsquo;application<\/h5>\n\n\n\n<ol class=\"wp-block-list\">\n<li>D\u00e9marrez l&rsquo;application Angular avec <code>npm start<\/code>.<\/li>\n\n\n\n<li>Si tout fonctionne correctement, votre navigateur devrait ouvrir l&rsquo;URL <code>http:\/\/localhost:4200<\/code>.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"765\" height=\"436\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-17.png\" alt=\"\" class=\"wp-image-2594\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-17.png 765w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-17-300x171.png 300w\" sizes=\"auto, (max-width: 765px) 100vw, 765px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 7 : <\/h4>\n\n\n\n<p>Lors de votre prochaine ouverture de VSCode, vous serez invit\u00e9 \u00e0 rouvrir le projet dans un conteneur. Vous pouvez le faire en utilisant l&rsquo;option <strong>Reopen in container<\/strong> avec Ctrl + Shift + P.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"502\" height=\"215\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-18.png\" alt=\"\" class=\"wp-image-2595\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-18.png 502w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-18-300x128.png 300w\" sizes=\"auto, (max-width: 502px) 100vw, 502px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u00c9tape 8 : Renommer le container<\/h4>\n\n\n\n<p>Lister les container disponible dans un terminal wsl :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">docker ps -a<\/code><\/pre>\n\n\n\n<p>Renommer un container pour lui donner un nom plus \u00e9vocateur dans Docker Desktop :<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">docker rename ba34083486c9 Whisper_WS<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"120\" src=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-14-1024x120.png\" alt=\"\" class=\"wp-image-2588\" srcset=\"https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-14-1024x120.png 1024w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-14-300x35.png 300w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-14-768x90.png 768w, https:\/\/devportfolio.net\/wp-dev-blog\/wp-content\/uploads\/2024\/08\/image-14.png 1053w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Pourquoi utiliser la conteneurisation pour mes projets ?<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Consistance de l&rsquo;environnement<\/strong> : Docker assure que le m\u00eame environnement est utilis\u00e9 en d\u00e9veloppement, test et production, \u00e9liminant les probl\u00e8mes sp\u00e9cifiques aux machines des d\u00e9veloppeurs.<\/li>\n\n\n\n<li><strong>Environnement isol\u00e9<\/strong> : Chaque projet peut avoir son propre environnement, sans interf\u00e9rence avec d&rsquo;autres projets ou le syst\u00e8me d&rsquo;exploitation h\u00f4te.<\/li>\n\n\n\n<li><strong>Facilit\u00e9 d&rsquo;onboarding<\/strong> : Les nouveaux d\u00e9veloppeurs peuvent cloner le d\u00e9p\u00f4t, lancer les conteneurs Docker et commencer \u00e0 travailler imm\u00e9diatement.<\/li>\n\n\n\n<li><strong>Gestion simplifi\u00e9e des d\u00e9pendances et versions<\/strong> : Les versions des Frameworks, biblioth\u00e8ques et autres d\u00e9pendances sont encapsul\u00e9es, \u00e9vitant les conflits de versions.<\/li>\n\n\n\n<li><strong>Isolation et s\u00e9curit\u00e9<\/strong> : Les projets sont isol\u00e9s les uns des autres, r\u00e9duisant les risques de conflits et augmentant la s\u00e9curit\u00e9.<\/li>\n\n\n\n<li><strong>Maintenance et nettoyage facilit\u00e9s<\/strong> : Les environnements de d\u00e9veloppement peuvent \u00eatre facilement nettoy\u00e9s en supprimant les conteneurs et les images Docker.<\/li>\n\n\n\n<li><strong>Compatibilit\u00e9 multiplateforme<\/strong> : Les conteneurs Docker fonctionnent de mani\u00e8re identique sur diff\u00e9rentes machines et syst\u00e8mes d&rsquo;exploitation.<\/li>\n\n\n\n<li><strong>Support pour outils et services de d\u00e9veloppement<\/strong> : Docker s&rsquo;int\u00e8gre bien avec de nombreux outils de d\u00e9veloppement, simplifiant la configuration des services n\u00e9cessaires.<\/li>\n\n\n\n<li><strong>Exp\u00e9rimentation et test faciles<\/strong> : Les d\u00e9veloppeurs peuvent exp\u00e9rimenter avec de nouvelles technologies ou configurations dans des conteneurs isol\u00e9s, sans risque pour leur environnement principal.<\/li>\n<\/ol>\n\n\n\n<p>En r\u00e9sum\u00e9, utiliser les Dev Containers de VSCode pour configurer un environnement de d\u00e9veloppement est une m\u00e9thode efficace pour garantir la coh\u00e9rence et la simplicit\u00e9 de votre configuration. En suivant ce guide, vous avez pu cr\u00e9er un conteneur Node.js, TypeScript et Angular, g\u00e9rer les d\u00e9pendances, et lancer rapidement votre projet. Cette approche minimise les probl\u00e8mes de compatibilit\u00e9, facilite la collaboration et am\u00e9liore l&rsquo;exp\u00e9rience d\u00e9veloppeur. Pour approfondir vos connaissances, n&rsquo;h\u00e9sitez pas \u00e0 consulter la <a href=\"https:\/\/code.visualstudio.com\/docs\/devcontainers\/containers\">documentation officielle des DevContainers<\/a>, de passer \u00e0 l&rsquo;action et de tester par vous m\u00eame ; )<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Cet article liste les \u00e9tapes n\u00e9cessaires \u00e0 l&rsquo;installation simple et rapide d&rsquo;un environnement de d\u00e9veloppement Node.js, TypeScript et Angular sans modifier le syst\u00e8me local \u00e0 l&rsquo;aide des Dev Containers de VSCode. Pr\u00e9requis Pour suivre ce guide, vous aurez besoin des \u00e9l\u00e9ments suivants : Ce guide est bas\u00e9 sur l&rsquo;utilisation de Windows 11 avec WSL2, mais [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2604,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71,70],"tags":[],"class_list":["post-2572","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-angular","category-docker"],"_links":{"self":[{"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/posts\/2572","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/comments?post=2572"}],"version-history":[{"count":13,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/posts\/2572\/revisions"}],"predecessor-version":[{"id":2606,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/posts\/2572\/revisions\/2606"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/media\/2604"}],"wp:attachment":[{"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/media?parent=2572"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/categories?post=2572"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devportfolio.net\/wp-dev-blog\/wp-json\/wp\/v2\/tags?post=2572"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}