{"id":1361,"date":"2026-06-10T10:38:29","date_gmt":"2026-06-10T09:38:29","guid":{"rendered":"https:\/\/geekcommunicant.com\/blog\/?p=1361"},"modified":"2026-06-10T10:38:48","modified_gmt":"2026-06-10T09:38:48","slug":"premiere-app-fullstack-react-fastapi","status":"publish","type":"post","link":"https:\/\/geekcommunicant.com\/blog\/2026\/06\/10\/premiere-app-fullstack-react-fastapi\/","title":{"rendered":"Ma premi\u00e8re app fullstack React\/FastAPI"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">\u00c7a y est ! J&rsquo;ai enfin r\u00e9ussi \u00e0 mettre en place ma premi\u00e8re r\u00e9alisation fullstack avec React et FastAPI.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ce \u00ab\u00a0chef d&rsquo;\u0153uvre\u00a0\u00bb est visible <a href=\"https:\/\/github.com\/valvalsal\/fullstack-todo-fastapi-react\">ici<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Les tutos c&rsquo;est bien sympa, mais si on ne se lance pas tout seul au bout d&rsquo;un moment&#8230;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00c7a y est ! J&rsquo;ai enfin r\u00e9ussi \u00e0 mettre en place ma premi\u00e8re r\u00e9alisation fullstack avec React et FastAPI. Ce \u00ab\u00a0chef d&rsquo;\u0153uvre\u00a0\u00bb est visible ici. Les tutos c&rsquo;est bien sympa, mais si on ne se lance pas tout seul au &hellip; <a href=\"https:\/\/geekcommunicant.com\/blog\/2026\/06\/10\/premiere-app-fullstack-react-fastapi\/\">Continuer la lecture <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":true,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[19,74],"tags":[77,76],"class_list":["post-1361","post","type-post","status-publish","format-standard","hentry","category-javascript","category-python","tag-fastapi","tag-react"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p2IoOb-lX","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":1365,"url":"https:\/\/geekcommunicant.com\/blog\/2026\/06\/23\/composant-react-choix-image\/","url_meta":{"origin":1361,"position":0},"title":"Un composant React de choix d&rsquo;image","author":"geekc","date":"23\/06\/2026","format":false,"excerpt":"Durant le d\u00e9veloppement de ma premi\u00e8re application fullstack avec React (JavaScript \"natif\" d'abord puis TypeScript) et FastApi , j'ai \u00e9t\u00e9 amen\u00e9 \u00e0 cr\u00e9er un composant d'upload de fichier image. Principe de fonctionnement Ce composant est pr\u00e9vu pour \u00eatre utilis\u00e9 comme \"champ\" d'un formulaire, et utilise des donn\u00e9es formatt\u00e9es comme suit\u2026","rel":"","context":"Dans &quot;JavaScript&quot;","block_context":{"text":"JavaScript","link":"https:\/\/geekcommunicant.com\/blog\/category\/javascript\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":727,"url":"https:\/\/geekcommunicant.com\/blog\/2019\/04\/15\/retour-premiere-carte-interactive\/","url_meta":{"origin":1361,"position":1},"title":"Retour sur ma premi\u00e8re carte interactive","author":"geekc","date":"15\/04\/2019","format":false,"excerpt":"Dans mon dernier article (voir), j'ai indiqu\u00e9 que la premi\u00e8re solution de carte interactive que j'avais pr\u00e9sent\u00e9e dans une s\u00e9rie de deux articles (1 et 2) ne fonctionnait pas sous Chrome. R\u00e9cemment, en consultant le code d'une page de reserves-naturelles.org, je me suis aper\u00e7u que la carte des r\u00e9gions de\u2026","rel":"","context":"Dans &quot;JavaScript&quot;","block_context":{"text":"JavaScript","link":"https:\/\/geekcommunicant.com\/blog\/category\/javascript\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":310,"url":"https:\/\/geekcommunicant.com\/blog\/2014\/03\/26\/le-site-nouveau-est-arrive\/","url_meta":{"origin":1361,"position":2},"title":"Le site nouveau est arriv\u00e9 !!!","author":"geekc","date":"26\/03\/2014","format":false,"excerpt":"Bon OK, si vous \u00eates all\u00e9s le voir, vous ne constaterez aucun changement, et c'est normal ! La nouveaut\u00e9 n'est ni dans le contenu, ni dans la forme, mais sous le capot. En effet, jusqu'\u00e0 pr\u00e9sent mon site n'avait aucun CMS - sauf bien entendu ce blog ici pr\u00e9sent qui\u2026","rel":"","context":"Dans &quot;Divers&quot;","block_context":{"text":"Divers","link":"https:\/\/geekcommunicant.com\/blog\/category\/divers\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1143,"url":"https:\/\/geekcommunicant.com\/blog\/2023\/03\/24\/gloubi-script-horloge-illustree\/","url_meta":{"origin":1361,"position":3},"title":"Gloubi script &#8211; une horloge illustr\u00e9e","author":"geekc","date":"24\/03\/2023","format":false,"excerpt":"Aujourd\u2019hui, j\u2019ai d\u00e9cid\u00e9 de m\u2019attaquer \u00e0 la version gloubi d\u2019un script que j\u2019ai \u00e9galement d\u00e9j\u00e0 cr\u00e9\u00e9 de mon c\u00f4t\u00e9\u00a0: l\u2019horloge illustr\u00e9e. La version gloubi est visible ici, tandis que la cr\u00e9ation de ma propre version, faite avec jQuery, est pr\u00e9sent\u00e9e ici. Pr\u00e9sentation de la version gloubi Pour commencer, on cr\u00e9\u00e9\u2026","rel":"","context":"Dans &quot;JavaScript&quot;","block_context":{"text":"JavaScript","link":"https:\/\/geekcommunicant.com\/blog\/category\/javascript\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1138,"url":"https:\/\/geekcommunicant.com\/blog\/2023\/03\/17\/quel-est-le-plus-vieux-navigateur\/","url_meta":{"origin":1361,"position":4},"title":"Quel est le plus vieux navigateur ?","author":"geekc","date":"17\/03\/2023","format":false,"excerpt":"Derni\u00e8rement, je me suis pos\u00e9 la question de quel est le plus vieux navigateur web toujours en cours de d\u00e9veloppement. J\u2019ai donc fait quelques recherches que je vais essayer de vous synth\u00e9tiser au mieux ici. Pr\u00e9sentation des candidats J\u2019ai orient\u00e9 mes recherches autour des 5 navigateurs les plus utilis\u00e9s actuellement,\u2026","rel":"","context":"Dans &quot;Divers&quot;","block_context":{"text":"Divers","link":"https:\/\/geekcommunicant.com\/blog\/category\/divers\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":790,"url":"https:\/\/geekcommunicant.com\/blog\/2019\/05\/20\/carte-interactive-svg-tooltip\/","url_meta":{"origin":1361,"position":5},"title":"Carte interactive en SVG avec tooltip","author":"geekc","date":"20\/05\/2019","format":false,"excerpt":"Apr\u00e8s la premi\u00e8re version de ma carte interactive (voir ici), j\u2019en ai cr\u00e9\u00e9 une deuxi\u00e8me \u00e0 l\u2019aide de la librairie OpenLayers. Cette solution fonctionne, mais c\u2019est comme disposer d'un outil multifonction mais d'en n'utiliser qu'une ou deux, OpenLayers \u00e9tant une librairie permettant de faire beaucoup plus. Une autre solution un\u2026","rel":"","context":"Dans &quot;JavaScript&quot;","block_context":{"text":"JavaScript","link":"https:\/\/geekcommunicant.com\/blog\/category\/javascript\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/geekcommunicant.com\/blog\/wp-content\/uploads\/svg-map-style.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/posts\/1361","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/comments?post=1361"}],"version-history":[{"count":1,"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/posts\/1361\/revisions"}],"predecessor-version":[{"id":1362,"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/posts\/1361\/revisions\/1362"}],"wp:attachment":[{"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/media?parent=1361"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/categories?post=1361"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/geekcommunicant.com\/blog\/wp-json\/wp\/v2\/tags?post=1361"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}