Java + Angular: Uma combinação poderosa para Desenvolvimento Web

Introdução

A combinação de Java no back-end e Angular no front-end tem se tornado uma escolha popular para o desenvolvimento de aplicações web modernas. Essa stack oferece um alto grau de flexibilidade, permitindo que desenvolvedores criem sistemas modulares, escaláveis e seguros.

O Spring Boot facilita a criação de serviços REST robustos e eficientes, enquanto o Angular fornece uma interface rica e responsiva, possibilitando uma excelente experiência do usuário. Juntos, esses frameworks oferecem uma solução completa para aplicações empresariais modernas.

Vantagens de Usar Java e Angular

1. Separação de responsabilidades

A arquitetura baseada em front-end e back-end separados permite que as equipes trabalhem de forma independente, acelerando o desenvolvimento e facilitando a manutenção da aplicação.

2. Segurança e confiabilidade

Java é amplamente reconhecido por sua segurança, sendo utilizado em grandes corporações e sistemas bancários. Com Spring Boot, é possível configurar autenticação e autorização utilizando Spring Security.

3. APIs RESTful bem estruturadas

Spring Boot permite criar serviços REST de forma simples e eficiente, facilitando a comunicação entre o front-end Angular e o back-end Java.

4. Interface dinâmica e responsiva

Angular utiliza conceitos como componentização, data binding e dependency injection, proporcionando um desenvolvimento front-end mais organizado e produtivo.

5. Testabilidade aprimorada

Tanto Java quanto Angular oferecem ferramentas robustas para testes. Spring Boot utiliza JUnit e Mockito, enquanto Angular usa Jasmine e Karma, garantindo a qualidade do software.

Configuração Básica do Back-end com Spring Boot

Vamos criar um serviço REST simples que retorna uma lista de usuários.

@RestController
@RequestMapping("/api")
public class UsuarioController {
  
  @GetMapping("/usuarios")
  public List<String> getUsuarios() {
      return List.of("João", "Maria", "Carlos");
  }
}

Configuração do CORS no Spring Boot

Para permitir que o Angular acesse a API Java, é necessário configurar o Cross-Origin Resource Sharing (CORS), evitando problemas de bloqueio de requisições entre domínios diferentes.

@Configuration
public class CorsConfig {
  @Bean
  public WebMvcConfigurer corsConfigurer() {
      return new WebMvcConfigurer() {
          @Override
          public void addCorsMappings(CorsRegistry registry) {
              registry.addMapping("/**").allowedOrigins("http://localhost:4200");
          }
      };
  }
}

Configurando o Front-end com Angular

Agora, vamos criar um serviço Angular para consumir essa API e exibir os dados na interface.

Criando um Serviço Angular para consumir a API

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class UsuarioService {
  private apiUrl = 'http://localhost:8080/api/usuarios';

  constructor(private http: HttpClient) {}

  getUsuarios() {
      return this.http.get<string[]>(this.apiUrl);
  }
}

Exibindo os Usuários no Componente Angular

import { Component, OnInit } from '@angular/core';
import { UsuarioService } from './usuario.service';

@Component({
  selector: 'app-usuarios',
  template: `
      <h2>Lista de Usuários</h2>
      <ul>
          <li *ngFor="let usuario of usuarios">{{ usuario }}</li>
      </ul>
  `
})
export class UsuariosComponent implements OnInit {
  usuarios: string[] = [];

  constructor(private usuarioService: UsuarioService) {}

  ngOnInit() {
      this.usuarioService.getUsuarios().subscribe(data => this.usuarios = data);
  }
}

Conclusão

A combinação de Java e Angular cria um ambiente de desenvolvimento web moderno e eficiente. O Spring Boot simplifica a implementação de APIs RESTful, enquanto o Angular proporciona uma interface interativa e bem estruturada. Essa abordagem permite uma clara separação entre front-end e back-end, facilitando a escalabilidade e a manutenção do sistema.