{"id":2107,"date":"2026-06-29T20:41:58","date_gmt":"2026-06-29T23:41:58","guid":{"rendered":"https:\/\/desvendandoocodigo.com.br\/?p=2107"},"modified":"2026-06-29T20:43:24","modified_gmt":"2026-06-29T23:43:24","slug":"como-criar-um-projeto-completo-em-react-componentes-props-usestate-e-logica-na-pratica","status":"publish","type":"post","link":"https:\/\/desvendandoocodigo.com.br\/?p=2107","title":{"rendered":"Como Criar um Projeto Completo em React | Componentes, Props, useState e L\u00f3gica na Pr\u00e1tica"},"content":{"rendered":"\n<p>Depois de aprender JavaScript, uma d\u00favida costuma surgir: <strong>como transformar toda essa l\u00f3gica em uma aplica\u00e7\u00e3o moderna utilizando React?<\/strong><\/p>\n\n\n\n<p>Muitos iniciantes conseguem criar fun\u00e7\u00f5es, estruturas de decis\u00e3o e la\u00e7os de repeti\u00e7\u00e3o, mas encontram dificuldades quando precisam organizar tudo isso dentro de componentes e fazer a interface reagir \u00e0s a\u00e7\u00f5es do usu\u00e1rio.<\/p>\n\n\n\n<p>\u00c9 justamente nesse momento que o React mostra sua principal vantagem.<\/p>\n\n\n\n<p>Neste projeto completo vamos desenvolver uma aplica\u00e7\u00e3o do zero, entendendo como Componentes, Props e useState trabalham juntos para criar interfaces reutiliz\u00e1veis, organizadas e f\u00e1ceis de manter.<\/p>\n\n\n\n<p>Ao final voc\u00ea ter\u00e1 constru\u00eddo uma aplica\u00e7\u00e3o responsiva e compreender\u00e1 como toda a l\u00f3gica do JavaScript continua sendo utilizada dentro do React.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">O que \u00e9 React?<\/h1>\n\n\n\n<p>React \u00e9 uma biblioteca JavaScript criada para construir interfaces de usu\u00e1rio.<\/p>\n\n\n\n<p>Ao contr\u00e1rio do HTML tradicional, onde normalmente manipulamos elementos diretamente pelo DOM, no React a interface \u00e9 dividida em pequenos blocos chamados <strong>componentes<\/strong>.<\/p>\n\n\n\n<p>Cada componente possui uma responsabilidade espec\u00edfica e pode ser reutilizado diversas vezes dentro da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p>Essa abordagem torna o c\u00f3digo mais organizado, facilita a manuten\u00e7\u00e3o e melhora significativamente o desenvolvimento de aplica\u00e7\u00f5es maiores.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">O projeto desenvolvido<\/h1>\n\n\n\n<p>Durante o projeto criamos uma aplica\u00e7\u00e3o completa utilizando uma estrutura semelhante \u00e0 encontrada em projetos profissionais.<\/p>\n\n\n\n<p>Entre os principais recursos implementados est\u00e3o:<\/p>\n\n\n\n<ul>\n<li>Navbar responsiva<\/li>\n\n\n\n<li>Menu hamb\u00farguer<\/li>\n\n\n\n<li>Cards reutiliz\u00e1veis<\/li>\n\n\n\n<li>P\u00e1gina Home<\/li>\n\n\n\n<li>Footer<\/li>\n\n\n\n<li>Campos de entrada<\/li>\n\n\n\n<li>Selects<\/li>\n\n\n\n<li>Bot\u00f5es<\/li>\n\n\n\n<li>Responsividade<\/li>\n\n\n\n<li>Organiza\u00e7\u00e3o por componentes<\/li>\n<\/ul>\n\n\n\n<p>Al\u00e9m da interface, toda a l\u00f3gica da aplica\u00e7\u00e3o foi constru\u00edda utilizando JavaScript moderno.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Componentiza\u00e7\u00e3o: o verdadeiro poder do React<\/h1>\n\n\n\n<p>Uma das maiores mudan\u00e7as para quem vem do JavaScript puro \u00e9 entender que, no React, praticamente tudo pode virar um componente.<\/p>\n\n\n\n<p>Em vez de repetir c\u00f3digo v\u00e1rias vezes, criamos componentes independentes que podem ser reutilizados sempre que necess\u00e1rio.<\/p>\n\n\n\n<p>No projeto foram criados componentes como:<\/p>\n\n\n\n<ul>\n<li>Card<\/li>\n\n\n\n<li>Navbar<\/li>\n\n\n\n<li>Footer<\/li>\n\n\n\n<li>Home<\/li>\n<\/ul>\n\n\n\n<p>Cada um possui sua pr\u00f3pria responsabilidade, deixando o projeto muito mais organizado.<\/p>\n\n\n\n<p>Essa organiza\u00e7\u00e3o tamb\u00e9m facilita futuras altera\u00e7\u00f5es, j\u00e1 que uma mudan\u00e7a em um componente \u00e9 refletida automaticamente onde ele estiver sendo utilizado.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Props: como os componentes recebem informa\u00e7\u00f5es<\/h1>\n\n\n\n<p>Criar componentes reutiliz\u00e1veis \u00e9 importante, mas eles precisam ser flex\u00edveis.<\/p>\n\n\n\n<p>\u00c9 a\u00ed que entram as <strong>Props<\/strong>.<\/p>\n\n\n\n<p>Props funcionam como par\u00e2metros enviados para um componente.<\/p>\n\n\n\n<p>Em vez de criar v\u00e1rios componentes diferentes, criamos apenas um componente gen\u00e9rico e enviamos informa\u00e7\u00f5es diferentes para cada utiliza\u00e7\u00e3o.<\/p>\n\n\n\n<p>Na pr\u00e1tica, isso reduz bastante a quantidade de c\u00f3digo duplicado.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">useState: tornando a aplica\u00e7\u00e3o din\u00e2mica<\/h1>\n\n\n\n<p>Outro conceito fundamental estudado durante o projeto foi o <strong>useState<\/strong>.<\/p>\n\n\n\n<p>Esse Hook permite armazenar informa\u00e7\u00f5es que podem mudar ao longo da execu\u00e7\u00e3o da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p>Sempre que um valor \u00e9 alterado utilizando o useState, o React atualiza automaticamente a interface.<\/p>\n\n\n\n<p>Isso elimina grande parte da manipula\u00e7\u00e3o manual do DOM que normalmente seria necess\u00e1ria utilizando apenas JavaScript.<\/p>\n\n\n\n<p>Foi exatamente esse mecanismo que permitiu atualizar os resultados da aplica\u00e7\u00e3o em tempo real conforme o usu\u00e1rio preenchia os campos.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Toda a l\u00f3gica continua sendo JavaScript<\/h1>\n\n\n\n<p>Uma d\u00favida muito comum entre iniciantes \u00e9 imaginar que React substitui o JavaScript.<\/p>\n\n\n\n<p>Na pr\u00e1tica, acontece exatamente o contr\u00e1rio.<\/p>\n\n\n\n<p>React utiliza JavaScript o tempo inteiro.<\/p>\n\n\n\n<p>Durante o desenvolvimento do projeto aplicamos diversos conceitos importantes, como:<\/p>\n\n\n\n<ul>\n<li>Estruturas condicionais<\/li>\n\n\n\n<li>Switch Case<\/li>\n\n\n\n<li>La\u00e7os de repeti\u00e7\u00e3o<\/li>\n\n\n\n<li>Fun\u00e7\u00f5es<\/li>\n\n\n\n<li>Eventos<\/li>\n\n\n\n<li>Manipula\u00e7\u00e3o de dados<\/li>\n\n\n\n<li>Renderiza\u00e7\u00e3o din\u00e2mica<\/li>\n<\/ul>\n\n\n\n<p>Ou seja, aprender bem JavaScript continua sendo um dos maiores diferenciais para quem deseja dominar React.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Organiza\u00e7\u00e3o profissional do projeto<\/h1>\n\n\n\n<p>Outro ponto importante abordado foi a organiza\u00e7\u00e3o das pastas da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p>Mesmo em projetos pequenos, manter uma estrutura organizada facilita muito a manuten\u00e7\u00e3o.<\/p>\n\n\n\n<p>Cada componente possui seu pr\u00f3prio arquivo, tornando o c\u00f3digo mais limpo e f\u00e1cil de localizar.<\/p>\n\n\n\n<p>Essa \u00e9 uma pr\u00e1tica utilizada em projetos profissionais e extremamente recomendada para quem deseja evoluir como desenvolvedor Front-end.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Responsividade<\/h1>\n\n\n\n<p>Al\u00e9m da l\u00f3gica, tamb\u00e9m foi constru\u00edda uma interface responsiva.<\/p>\n\n\n\n<p>O projeto adapta sua apar\u00eancia para diferentes tamanhos de tela utilizando CSS moderno.<\/p>\n\n\n\n<p>Tamb\u00e9m foi implementado um menu hamb\u00farguer para melhorar a navega\u00e7\u00e3o em dispositivos m\u00f3veis.<\/p>\n\n\n\n<p>Esses detalhes fazem bastante diferen\u00e7a na experi\u00eancia do usu\u00e1rio e aproximam o projeto da realidade do mercado.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">O que voc\u00ea aprende neste projeto<\/h1>\n\n\n\n<p>Ao concluir esta aplica\u00e7\u00e3o voc\u00ea ter\u00e1 praticado:<\/p>\n\n\n\n<ul>\n<li>React<\/li>\n\n\n\n<li>Componentes<\/li>\n\n\n\n<li>Props<\/li>\n\n\n\n<li>JSX<\/li>\n\n\n\n<li>useState<\/li>\n\n\n\n<li>Eventos<\/li>\n\n\n\n<li>Organiza\u00e7\u00e3o de projetos<\/li>\n\n\n\n<li>CSS por componentes<\/li>\n\n\n\n<li>Responsividade<\/li>\n\n\n\n<li>Menu Hamb\u00farguer<\/li>\n\n\n\n<li>Switch Case<\/li>\n\n\n\n<li>Condicionais<\/li>\n\n\n\n<li>La\u00e7os de repeti\u00e7\u00e3o<\/li>\n\n\n\n<li>Renderiza\u00e7\u00e3o din\u00e2mica<\/li>\n\n\n\n<li>Estrutura de aplica\u00e7\u00f5es React<\/li>\n<\/ul>\n\n\n\n<p>Mais importante do que decorar comandos \u00e9 compreender como todas essas pe\u00e7as trabalham juntas.<\/p>\n\n\n\n<p>Esse entendimento facilita muito o aprendizado de projetos mais complexos no futuro.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">C\u00f3digo-fonte<\/h1>\n\n\n\n<p>Todo o projeto est\u00e1 dispon\u00edvel gratuitamente no GitHub.<\/p>\n\n\n\n<p>Reposit\u00f3rio:<\/p>\n\n\n\n<figure class=\"wp-block-embed\"><div class=\"wp-block-embed__wrapper\">\nhttps:\/\/github.com\/marcoscaldas\/react-lavanderia\n<\/div><\/figure>\n\n\n\n<p>Voc\u00ea pode comparar seu c\u00f3digo com a vers\u00e3o final, estudar a estrutura da aplica\u00e7\u00e3o e utilizar o projeto como refer\u00eancia para seus pr\u00f3prios estudos.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Assista \u00e0 aula completa<\/h1>\n\n\n\n<p>Neste v\u00eddeo todo o desenvolvimento \u00e9 realizado passo a passo, mostrando desde a cria\u00e7\u00e3o dos componentes at\u00e9 a implementa\u00e7\u00e3o da l\u00f3gica completa utilizando React.<\/p>\n\n\n\n<p>Se voc\u00ea deseja sair da teoria e aprender construindo um projeto real, esta aula \u00e9 um excelente ponto de partida.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Como Criar um Projeto Completo em React | Componentes, Props, useState e L\u00f3gica na Pr\u00e1tica\" width=\"960\" height=\"540\" src=\"https:\/\/www.youtube.com\/embed\/zLrunYj87ec?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Conclus\u00e3o<\/h2>\n\n\n\n<p>Aprender React n\u00e3o significa abandonar o JavaScript.<\/p>\n\n\n\n<p>Na verdade, React potencializa tudo aquilo que voc\u00ea j\u00e1 aprendeu.<\/p>\n\n\n\n<p>Quando entendemos Componentes, Props e useState, come\u00e7amos a enxergar como aplica\u00e7\u00f5es modernas realmente s\u00e3o constru\u00eddas.<\/p>\n\n\n\n<p>E esse \u00e9 justamente o objetivo da filosofia <strong>Desvendando o C\u00f3digo<\/strong>: compreender o que acontece por tr\u00e1s da tecnologia, em vez de apenas copiar c\u00f3digo.<\/p>\n\n\n\n<p>Quanto mais voc\u00ea entende os conceitos, mais f\u00e1cil fica aprender novos frameworks, criar projetos maiores e evoluir como desenvolvedor.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Depois de aprender JavaScript, uma d\u00favida costuma surgir: como transformar toda essa l\u00f3gica em uma aplica\u00e7\u00e3o moderna utilizando React? Muitos iniciantes conseguem criar fun\u00e7\u00f5es, estruturas de decis\u00e3o e la\u00e7os de repeti\u00e7\u00e3o, mas encontram dificuldades quando precisam organizar tudo isso dentro de componentes e fazer a interface reagir \u00e0s a\u00e7\u00f5es do usu\u00e1rio. \u00c9 justamente nesse momento que o React mostra sua principal vantagem. Neste projeto completo vamos desenvolver uma aplica\u00e7\u00e3o do zero, entendendo como Componentes, Props e useState trabalham juntos para criar interfaces reutiliz\u00e1veis, organizadas e f\u00e1ceis de manter. Ao final voc\u00ea ter\u00e1 constru\u00eddo uma aplica\u00e7\u00e3o responsiva e compreender\u00e1 como toda a l\u00f3gica do JavaScript continua sendo utilizada dentro do React. O que \u00e9 React? React \u00e9 uma biblioteca JavaScript criada para construir interfaces de usu\u00e1rio. Ao contr\u00e1rio do HTML tradicional, onde normalmente manipulamos elementos diretamente pelo DOM, no React a interface \u00e9 dividida em pequenos blocos chamados componentes. Cada componente possui uma responsabilidade espec\u00edfica e pode ser reutilizado diversas vezes dentro da aplica\u00e7\u00e3o. Essa abordagem torna o c\u00f3digo mais organizado, facilita a manuten\u00e7\u00e3o e melhora significativamente o desenvolvimento de aplica\u00e7\u00f5es maiores. O projeto desenvolvido Durante o projeto criamos uma aplica\u00e7\u00e3o completa utilizando uma estrutura semelhante \u00e0 encontrada em projetos profissionais. Entre os principais recursos implementados est\u00e3o: Al\u00e9m da interface, toda a l\u00f3gica da aplica\u00e7\u00e3o foi constru\u00edda utilizando JavaScript moderno. Componentiza\u00e7\u00e3o: o verdadeiro poder do React Uma das maiores mudan\u00e7as para quem vem do JavaScript puro \u00e9 entender que, no React, praticamente tudo pode virar um componente. Em vez de repetir c\u00f3digo v\u00e1rias vezes, criamos componentes independentes que podem ser reutilizados sempre que necess\u00e1rio. No projeto foram criados componentes como: Cada um possui sua pr\u00f3pria responsabilidade, deixando o projeto muito mais organizado. Essa organiza\u00e7\u00e3o tamb\u00e9m facilita futuras altera\u00e7\u00f5es, j\u00e1 que uma mudan\u00e7a em um componente \u00e9 refletida automaticamente onde ele estiver sendo utilizado. Props: como os componentes recebem informa\u00e7\u00f5es Criar componentes reutiliz\u00e1veis \u00e9 importante, mas eles precisam ser flex\u00edveis. \u00c9 a\u00ed que entram as Props. Props funcionam como par\u00e2metros enviados para um componente. Em vez de criar v\u00e1rios componentes diferentes, criamos apenas um componente gen\u00e9rico e enviamos informa\u00e7\u00f5es diferentes para cada utiliza\u00e7\u00e3o. Na pr\u00e1tica, isso reduz bastante a quantidade de c\u00f3digo duplicado. useState: tornando a aplica\u00e7\u00e3o din\u00e2mica Outro conceito fundamental estudado durante o projeto foi o useState. Esse Hook permite armazenar informa\u00e7\u00f5es que podem mudar ao longo da execu\u00e7\u00e3o da aplica\u00e7\u00e3o. Sempre que um valor \u00e9 alterado utilizando o useState, o React atualiza automaticamente a interface. Isso elimina grande parte da manipula\u00e7\u00e3o manual do DOM que normalmente seria necess\u00e1ria utilizando apenas JavaScript. Foi exatamente esse mecanismo que permitiu atualizar os resultados da aplica\u00e7\u00e3o em tempo real conforme o usu\u00e1rio preenchia os campos. Toda a l\u00f3gica continua sendo JavaScript Uma d\u00favida muito comum entre iniciantes \u00e9 imaginar que React substitui o JavaScript. Na pr\u00e1tica, acontece exatamente o contr\u00e1rio. React utiliza JavaScript o tempo inteiro. Durante o desenvolvimento do projeto aplicamos diversos conceitos importantes, como: Ou seja, aprender bem JavaScript continua sendo um dos maiores diferenciais para quem deseja dominar React. Organiza\u00e7\u00e3o profissional do projeto Outro ponto importante abordado foi a organiza\u00e7\u00e3o das pastas da aplica\u00e7\u00e3o. Mesmo em projetos pequenos, manter uma estrutura organizada facilita muito a manuten\u00e7\u00e3o. Cada componente possui seu pr\u00f3prio arquivo, tornando o c\u00f3digo mais limpo e f\u00e1cil de localizar. Essa \u00e9 uma pr\u00e1tica utilizada em projetos profissionais e extremamente recomendada para quem deseja evoluir como desenvolvedor Front-end. Responsividade Al\u00e9m da l\u00f3gica, tamb\u00e9m foi constru\u00edda uma interface responsiva. O projeto adapta sua apar\u00eancia para diferentes tamanhos de tela utilizando CSS moderno. Tamb\u00e9m foi implementado um menu hamb\u00farguer para melhorar a navega\u00e7\u00e3o em dispositivos m\u00f3veis. Esses detalhes fazem bastante diferen\u00e7a na experi\u00eancia do usu\u00e1rio e aproximam o projeto da realidade do mercado. O que voc\u00ea aprende neste projeto Ao concluir esta aplica\u00e7\u00e3o voc\u00ea ter\u00e1 praticado: Mais importante do que decorar comandos \u00e9 compreender como todas essas pe\u00e7as trabalham juntas. Esse entendimento facilita muito o aprendizado de projetos mais complexos no futuro. C\u00f3digo-fonte Todo o projeto est\u00e1 dispon\u00edvel gratuitamente no GitHub. Reposit\u00f3rio: Voc\u00ea pode comparar seu c\u00f3digo com a vers\u00e3o final, estudar a estrutura da aplica\u00e7\u00e3o e utilizar o projeto como refer\u00eancia para seus pr\u00f3prios estudos. Assista \u00e0 aula completa Neste v\u00eddeo todo o desenvolvimento \u00e9 realizado passo a passo, mostrando desde a cria\u00e7\u00e3o dos componentes at\u00e9 a implementa\u00e7\u00e3o da l\u00f3gica completa utilizando React. Se voc\u00ea deseja sair da teoria e aprender construindo um projeto real, esta aula \u00e9 um excelente ponto de partida. Conclus\u00e3o Aprender React n\u00e3o significa abandonar o JavaScript. Na verdade, React potencializa tudo aquilo que voc\u00ea j\u00e1 aprendeu. Quando entendemos Componentes, Props e useState, come\u00e7amos a enxergar como aplica\u00e7\u00f5es modernas realmente s\u00e3o constru\u00eddas. E esse \u00e9 justamente o objetivo da filosofia Desvendando o C\u00f3digo: compreender o que acontece por tr\u00e1s da tecnologia, em vez de apenas copiar c\u00f3digo. Quanto mais voc\u00ea entende os conceitos, mais f\u00e1cil fica aprender novos frameworks, criar projetos maiores e evoluir como desenvolvedor.<\/p>\n","protected":false},"author":1,"featured_media":2108,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/2107"}],"collection":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2107"}],"version-history":[{"count":3,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/2107\/revisions"}],"predecessor-version":[{"id":2111,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/2107\/revisions\/2111"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/media\/2108"}],"wp:attachment":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2107"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2107"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2107"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}