Spring Boot e React

1 - Introdução 2 - Criando projeto 3 - Gerando tabela 4 - Estruturando projeto 5 - Configurando repositório 6 - Configurando controle 7 - Modelo para validar requisições 8 - Serviço para listar produtos 9 - Rota para listar produtos 10 - Serviço para cadastrar produtos 11 - Rota para cadastrar produtos 12 - Serviço para alterar produtos 13 - Rota para alterar produtos 14 - Serviço para remover produtos 15 - Rota para remover produtos 16 - Cors 17 - Criando projeto React 18 - Criando componentes no React 19 - Estrutura de formulário no React 20 - Estrutura de tabela no React 21 - Estilizando componentes 22 - Visibilidade dos botões 23 - Obtendo os produtos 24 - Exibindo os produtos na tabela 25 - Objeto produto 26 - UseState de produto 27 - Obtendo dados do formulário 28 - Cadastrar produtos 29 - Limpar formulário 30 - Selecionar produto 31 - Cancelando alteração e exclusão 32 - Remover produto 33 - Alterar produto 34 - Considerações finais

1 - Spring Boot e React

Olá pessoal, iniciaremos mais um treinamento de Spring Boot, dessa vez iremos trabalhar também com o front-end, utilizando a biblioteca ReactJS.

O que precisaremos saber para fazer esse treinamento?

Conhecimentos básicos de como criar uma API com Spring Boot e utilização do React. Caso queira saber mais sobre os conceitos dessas tecnologias, deixarei as playlists do meu canal no YouTube:

Como será desenvolvido esse projeto?

Será utilizado o editor Visual Studio Code (clique aqui para baixar). Esse poderoso editor será utilizado para o desenvolvimento do Spring Boot e o front-end com o ReactJS.

JDK

Será necessário termos o JDK instalado, nesse tutorial utilizarei a versão 17, mas você pode utilizar qualquer versão a partir da 8, clique aqui para baixar o JDK.

Banco de dados

Iremos utilizar o banco MySQL para desenvolvermos nossa API, clique aqui para baixar.

Extensões do Visual Studio Code

Para facilitar o desenvolvimento desse projeto, iremos utilizar as seguintes extensões para Visual Studio Code:

  • Extension Pack for Java: Conjunto de extesões para a linguagem Java, contendo as seguintes funcionalidades: Executar projetos em formato java, debug, Maven, Gerenciador de projetos e o IntelliCode;
  • https://marketplace.visualstudio.com/items?itemName=Pivotal.vscode-boot-dev-pack: Extensão contendo o Spring Initializr para criação de projetos, Spring Boot Dashboard para gerenciar projetos em Spring Boot e o Spring Boot Tools que fornece o suporte base para trabalhar com o Spring Boot;
  • Thunder Client: Essa extesão permite realizarmos testes em nossas APIs;
  • MySQL: Instalando essa extensão, teremos acesso a gerenciar bases de dados e tabelas em diversos bancos de dados como: MySQL, PostgreSQL, SQLite, entre outros;
  • VSCode-lombok: Suporte ao lombok, que fará com que tenhamos annotations para gerar Getters, Setters e Construtores dinâmicamente.

Node.js

Para finalizar o nosso setup, precisamos instalar o Node.js. Ele será responsável para conseguirmos desenvolver nosso front-end, clique aqui para baixar.

E com isso finalizamos essa primeira etapa, na próxima aula iremos criar nossa API em Spring, até lá!

Caso queira acompanhar esse tutorial através de vídeos, acesse minha playlist no YouTube, deixarei abaixo a primeira aula do curso, até a próxima ;)