{"id":2230,"date":"2026-07-26T16:56:41","date_gmt":"2026-07-26T19:56:41","guid":{"rendered":"https:\/\/desvendandoocodigo.com.br\/?p=2230"},"modified":"2026-07-26T17:01:43","modified_gmt":"2026-07-26T20:01:43","slug":"react-para-iniciantes-aprenda-componentes-usestate-e-arrays-criando-um-projeto-pratico","status":"publish","type":"post","link":"https:\/\/desvendandoocodigo.com.br\/?p=2230","title":{"rendered":"React para Iniciantes | Aprenda Componentes, useState e Arrays Criando um Projeto Pr\u00e1tico"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Se voc\u00ea est\u00e1 come\u00e7ando a estudar React, provavelmente j\u00e1 percebeu que a maior dificuldade n\u00e3o \u00e9 instalar a ferramenta, mas entender como todos os conceitos trabalham juntos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">O que s\u00e3o Componentes? Para que serve o <strong>useState<\/strong>? Como renderizar listas? Como manipular Arrays sem modificar diretamente os dados? Como organizar um projeto React de forma correta?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Neste artigo vamos responder todas essas d\u00favidas construindo um projeto pr\u00e1tico do zero.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ao final, voc\u00ea ter\u00e1 desenvolvido uma aplica\u00e7\u00e3o capaz de exibir uma lista de alunos, adicionar novos itens, remover elementos, alterar informa\u00e7\u00f5es e entender como o React atualiza automaticamente a interface sempre que o estado da aplica\u00e7\u00e3o \u00e9 modificado.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Assista \u00e0s aulas<\/h1>\n\n\n\n<h2 class=\"wp-block-heading\">\ud83c\udfa5 V\u00eddeo editado<\/h2>\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=\"React para Iniciantes | Aprenda Componentes, useState e Arrays Criando um Projeto Pr\u00e1tico\" width=\"960\" height=\"540\" src=\"https:\/\/www.youtube.com\/embed\/Uc0AcNCcZeo?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<h2 class=\"wp-block-heading\">\ud83d\udd34 Live completa<\/h2>\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=\"Mini Projeto React do Zero (Perfeito para Iniciantes)\" width=\"960\" height=\"540\" src=\"https:\/\/www.youtube.com\/embed\/c6RPT3i7EuA?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<h1 class=\"wp-block-heading\">O que voc\u00ea aprender\u00e1<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Durante este projeto ser\u00e3o apresentados diversos conceitos fundamentais para quem deseja aprender React.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Voc\u00ea aprender\u00e1:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>React<\/li>\n\n\n\n<li>Vite<\/li>\n\n\n\n<li>Componentes<\/li>\n\n\n\n<li>JSX<\/li>\n\n\n\n<li>useState<\/li>\n\n\n\n<li>Estado da aplica\u00e7\u00e3o<\/li>\n\n\n\n<li>Arrays<\/li>\n\n\n\n<li>map()<\/li>\n\n\n\n<li>Renderiza\u00e7\u00e3o de listas<\/li>\n\n\n\n<li>Eventos<\/li>\n\n\n\n<li>Organiza\u00e7\u00e3o de componentes<\/li>\n\n\n\n<li>CSS por componente<\/li>\n\n\n\n<li>Estrutura de projetos React<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Todos esses assuntos aparecem diariamente em aplica\u00e7\u00f5es profissionais.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Criando um projeto React com Vite<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Hoje o Vite \u00e9 uma das maneiras mais r\u00e1pidas de iniciar um projeto React.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Com poucos comandos j\u00e1 temos uma aplica\u00e7\u00e3o funcionando com Hot Reload, organiza\u00e7\u00e3o de pastas e ambiente pronto para desenvolvimento.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ap\u00f3s criar o projeto, o Vite gera toda a estrutura inicial, permitindo que o desenvolvedor concentre seus esfor\u00e7os apenas na constru\u00e7\u00e3o da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Entendendo a estrutura do React<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Um dos maiores diferenciais do React \u00e9 sua arquitetura baseada em componentes.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Em vez de criar uma p\u00e1gina inteira dentro de um \u00fanico arquivo, dividimos a interface em pequenas partes reutiliz\u00e1veis.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Neste projeto criamos tr\u00eas componentes principais:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Header<\/li>\n\n\n\n<li>Lista de Alunos<\/li>\n\n\n\n<li>Footer<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Depois todos eles s\u00e3o reunidos dentro do componente principal (<strong>App.jsx<\/strong>).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Essa abordagem torna o c\u00f3digo muito mais organizado e facilita bastante a manuten\u00e7\u00e3o do projeto.<\/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 JSX?<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Quando algu\u00e9m come\u00e7a no React costuma estranhar um detalhe:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Misturar HTML e JavaScript no mesmo arquivo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Na verdade, isso recebe o nome de <strong>JSX (JavaScript XML)<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">O JSX permite escrever estruturas semelhantes ao HTML diretamente dentro do JavaScript, tornando a cria\u00e7\u00e3o de interfaces muito mais intuitiva.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9 exatamente essa tecnologia que possibilita montar componentes reutiliz\u00e1veis de forma simples.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Trabalhando com Componentes<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Cada componente possui uma responsabilidade espec\u00edfica.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Por exemplo:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">O <strong>Header<\/strong> \u00e9 respons\u00e1vel pelo cabe\u00e7alho da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">O <strong>Footer<\/strong> exibe o rodap\u00e9.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">J\u00e1 o componente <strong>ListaAlunos<\/strong> cont\u00e9m toda a l\u00f3gica da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Essa separa\u00e7\u00e3o faz parte das boas pr\u00e1ticas do React e permite reutilizar componentes em v\u00e1rios projetos diferentes.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Entendendo o useState<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Um dos assuntos mais importantes para quem come\u00e7a no React \u00e9 o <strong>useState<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ele \u00e9 um Hook respons\u00e1vel por armazenar informa\u00e7\u00f5es que podem mudar durante a execu\u00e7\u00e3o da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">No nosso projeto, o estado armazena a lista de alunos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Sempre que um aluno \u00e9 adicionado, removido ou alterado, o React identifica essa mudan\u00e7a e atualiza automaticamente a interface.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9 justamente esse comportamento que torna o React t\u00e3o poderoso.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Manipulando Arrays<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Al\u00e9m do React, o projeto tamb\u00e9m utiliza diversos conceitos importantes do JavaScript.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Durante a aula manipulamos Arrays realizando opera\u00e7\u00f5es como:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>adicionar elementos;<\/li>\n\n\n\n<li>remover elementos;<\/li>\n\n\n\n<li>inserir itens no in\u00edcio;<\/li>\n\n\n\n<li>alterar posi\u00e7\u00f5es espec\u00edficas;<\/li>\n\n\n\n<li>criar c\u00f3pias utilizando o operador Spread.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Esses conceitos aparecem constantemente em aplica\u00e7\u00f5es React.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Por isso \u00e9 fundamental dominar tamb\u00e9m o JavaScript.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Renderizando listas com map()<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Depois de armazenar os dados no estado, precisamos exibi-los na tela.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Para isso utilizamos o m\u00e9todo <strong>map()<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ele percorre todos os elementos do Array e cria automaticamente um componente visual para cada aluno.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Essa \u00e9 uma das formas mais utilizadas para renderizar listas 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\">Eventos no React<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Outra caracter\u00edstica importante apresentada no projeto \u00e9 o tratamento de eventos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Cada bot\u00e3o executa uma fun\u00e7\u00e3o diferente.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Entre elas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Adicionar aluno<\/li>\n\n\n\n<li>Remover \u00faltimo aluno<\/li>\n\n\n\n<li>Adicionar no in\u00edcio<\/li>\n\n\n\n<li>Remover primeiro aluno<\/li>\n\n\n\n<li>Alterar o segundo aluno<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Quando o usu\u00e1rio clica em um bot\u00e3o, o React executa a fun\u00e7\u00e3o correspondente e atualiza imediatamente a interface.<\/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 dos arquivos<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Durante o desenvolvimento tamb\u00e9m mostramos uma organiza\u00e7\u00e3o bastante utilizada em projetos React.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Cada componente possui:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>seu pr\u00f3prio arquivo JSX;<\/li>\n\n\n\n<li>seu pr\u00f3prio arquivo CSS;<\/li>\n\n\n\n<li>sua pr\u00f3pria responsabilidade.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Essa separa\u00e7\u00e3o facilita muito o crescimento da aplica\u00e7\u00e3o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Mesmo projetos grandes continuam organizados utilizando esse padr\u00e3o.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Por que aprender React?<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">O React \u00e9 atualmente uma das bibliotecas JavaScript mais utilizadas para desenvolvimento de interfaces.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Empresas de todos os tamanhos utilizam React para criar sistemas web modernos, r\u00e1pidos e altamente reutiliz\u00e1veis.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Aprender seus conceitos fundamentais desde o in\u00edcio facilita muito a evolu\u00e7\u00e3o para projetos mais complexos, como:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>sistemas administrativos;<\/li>\n\n\n\n<li>dashboards;<\/li>\n\n\n\n<li>e-commerces;<\/li>\n\n\n\n<li>aplica\u00e7\u00f5es SaaS;<\/li>\n\n\n\n<li>sistemas corporativos.<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h1 class=\"wp-block-heading\">Conclus\u00e3o<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">Neste projeto desenvolvemos uma aplica\u00e7\u00e3o completa utilizando React, aplicando diversos conceitos essenciais para quem est\u00e1 come\u00e7ando.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Mais importante do que decorar c\u00f3digo \u00e9 compreender como cada parte da aplica\u00e7\u00e3o conversa com as demais.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Quando voc\u00ea entende a fun\u00e7\u00e3o dos componentes, do <strong>useState<\/strong>, da renderiza\u00e7\u00e3o com <strong>map()<\/strong> e da organiza\u00e7\u00e3o do projeto, fica muito mais f\u00e1cil evoluir para aplica\u00e7\u00f5es maiores.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Se voc\u00ea pretende aprender React de verdade, pratique bastante este projeto, fa\u00e7a modifica\u00e7\u00f5es, adicione novas funcionalidades e experimente criar seus pr\u00f3prios componentes.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9 dessa forma que a evolu\u00e7\u00e3o acontece.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Se voc\u00ea est\u00e1 come\u00e7ando a estudar React, provavelmente j\u00e1 percebeu que a maior dificuldade n\u00e3o \u00e9 instalar a ferramenta, mas entender como todos os conceitos trabalham juntos. O que s\u00e3o Componentes? Para que serve o useState? Como renderizar listas? Como manipular Arrays sem modificar diretamente os dados? Como organizar um projeto React de forma correta? Neste artigo vamos responder todas essas d\u00favidas construindo um projeto pr\u00e1tico do zero. Ao final, voc\u00ea ter\u00e1 desenvolvido uma aplica\u00e7\u00e3o capaz de exibir uma lista de alunos, adicionar novos itens, remover elementos, alterar informa\u00e7\u00f5es e entender como o React atualiza automaticamente a interface sempre que o estado da aplica\u00e7\u00e3o \u00e9 modificado. Assista \u00e0s aulas \ud83c\udfa5 V\u00eddeo editado \ud83d\udd34 Live completa O que voc\u00ea aprender\u00e1 Durante este projeto ser\u00e3o apresentados diversos conceitos fundamentais para quem deseja aprender React. Voc\u00ea aprender\u00e1: Todos esses assuntos aparecem diariamente em aplica\u00e7\u00f5es profissionais. Criando um projeto React com Vite Hoje o Vite \u00e9 uma das maneiras mais r\u00e1pidas de iniciar um projeto React. Com poucos comandos j\u00e1 temos uma aplica\u00e7\u00e3o funcionando com Hot Reload, organiza\u00e7\u00e3o de pastas e ambiente pronto para desenvolvimento. Ap\u00f3s criar o projeto, o Vite gera toda a estrutura inicial, permitindo que o desenvolvedor concentre seus esfor\u00e7os apenas na constru\u00e7\u00e3o da aplica\u00e7\u00e3o. Entendendo a estrutura do React Um dos maiores diferenciais do React \u00e9 sua arquitetura baseada em componentes. Em vez de criar uma p\u00e1gina inteira dentro de um \u00fanico arquivo, dividimos a interface em pequenas partes reutiliz\u00e1veis. Neste projeto criamos tr\u00eas componentes principais: Depois todos eles s\u00e3o reunidos dentro do componente principal (App.jsx). Essa abordagem torna o c\u00f3digo muito mais organizado e facilita bastante a manuten\u00e7\u00e3o do projeto. O que \u00e9 JSX? Quando algu\u00e9m come\u00e7a no React costuma estranhar um detalhe: Misturar HTML e JavaScript no mesmo arquivo. Na verdade, isso recebe o nome de JSX (JavaScript XML). O JSX permite escrever estruturas semelhantes ao HTML diretamente dentro do JavaScript, tornando a cria\u00e7\u00e3o de interfaces muito mais intuitiva. \u00c9 exatamente essa tecnologia que possibilita montar componentes reutiliz\u00e1veis de forma simples. Trabalhando com Componentes Cada componente possui uma responsabilidade espec\u00edfica. Por exemplo: O Header \u00e9 respons\u00e1vel pelo cabe\u00e7alho da aplica\u00e7\u00e3o. O Footer exibe o rodap\u00e9. J\u00e1 o componente ListaAlunos cont\u00e9m toda a l\u00f3gica da aplica\u00e7\u00e3o. Essa separa\u00e7\u00e3o faz parte das boas pr\u00e1ticas do React e permite reutilizar componentes em v\u00e1rios projetos diferentes. Entendendo o useState Um dos assuntos mais importantes para quem come\u00e7a no React \u00e9 o useState. Ele \u00e9 um Hook respons\u00e1vel por armazenar informa\u00e7\u00f5es que podem mudar durante a execu\u00e7\u00e3o da aplica\u00e7\u00e3o. No nosso projeto, o estado armazena a lista de alunos. Sempre que um aluno \u00e9 adicionado, removido ou alterado, o React identifica essa mudan\u00e7a e atualiza automaticamente a interface. \u00c9 justamente esse comportamento que torna o React t\u00e3o poderoso. Manipulando Arrays Al\u00e9m do React, o projeto tamb\u00e9m utiliza diversos conceitos importantes do JavaScript. Durante a aula manipulamos Arrays realizando opera\u00e7\u00f5es como: Esses conceitos aparecem constantemente em aplica\u00e7\u00f5es React. Por isso \u00e9 fundamental dominar tamb\u00e9m o JavaScript. Renderizando listas com map() Depois de armazenar os dados no estado, precisamos exibi-los na tela. Para isso utilizamos o m\u00e9todo map(). Ele percorre todos os elementos do Array e cria automaticamente um componente visual para cada aluno. Essa \u00e9 uma das formas mais utilizadas para renderizar listas dentro do React. Eventos no React Outra caracter\u00edstica importante apresentada no projeto \u00e9 o tratamento de eventos. Cada bot\u00e3o executa uma fun\u00e7\u00e3o diferente. Entre elas: Quando o usu\u00e1rio clica em um bot\u00e3o, o React executa a fun\u00e7\u00e3o correspondente e atualiza imediatamente a interface. Organiza\u00e7\u00e3o dos arquivos Durante o desenvolvimento tamb\u00e9m mostramos uma organiza\u00e7\u00e3o bastante utilizada em projetos React. Cada componente possui: Essa separa\u00e7\u00e3o facilita muito o crescimento da aplica\u00e7\u00e3o. Mesmo projetos grandes continuam organizados utilizando esse padr\u00e3o. Por que aprender React? O React \u00e9 atualmente uma das bibliotecas JavaScript mais utilizadas para desenvolvimento de interfaces. Empresas de todos os tamanhos utilizam React para criar sistemas web modernos, r\u00e1pidos e altamente reutiliz\u00e1veis. Aprender seus conceitos fundamentais desde o in\u00edcio facilita muito a evolu\u00e7\u00e3o para projetos mais complexos, como: Conclus\u00e3o Neste projeto desenvolvemos uma aplica\u00e7\u00e3o completa utilizando React, aplicando diversos conceitos essenciais para quem est\u00e1 come\u00e7ando. Mais importante do que decorar c\u00f3digo \u00e9 compreender como cada parte da aplica\u00e7\u00e3o conversa com as demais. Quando voc\u00ea entende a fun\u00e7\u00e3o dos componentes, do useState, da renderiza\u00e7\u00e3o com map() e da organiza\u00e7\u00e3o do projeto, fica muito mais f\u00e1cil evoluir para aplica\u00e7\u00f5es maiores. Se voc\u00ea pretende aprender React de verdade, pratique bastante este projeto, fa\u00e7a modifica\u00e7\u00f5es, adicione novas funcionalidades e experimente criar seus pr\u00f3prios componentes. \u00c9 dessa forma que a evolu\u00e7\u00e3o acontece.<\/p>\n","protected":false},"author":1,"featured_media":2234,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2230","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog"],"_links":{"self":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/2230","targetHints":{"allow":["GET"]}}],"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=2230"}],"version-history":[{"count":5,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/2230\/revisions"}],"predecessor-version":[{"id":2238,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/2230\/revisions\/2238"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/media\/2234"}],"wp:attachment":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2230"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2230"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2230"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}