??: Java ??? ?????? Angular ????? ?????? ???? ?? ? ?????? ??? ?? ??? ??? ??? ? ????. ??: Java ??? ????? ???? Spring Web ? Spring Data JPA ???? ?????. ?? ? ????? ?????? ?????. REST ????? ???? ?????? ?????. ?? ????? ????. Spring Boot Java ???? ?????. CORS? ?????. Angular ?? ??? Angular? ?????.

Java Backend Framework? Angular Frontend Framework? ??

Java Backend Framework? Angular Frontend Framework? ?? ? ??????? ???? ?? ??? ?????. ? ???? Spring Boot? Angular? ?? ??? ???? Java ?????? Angular ?????? ???? ??? ?????.

??:

1. Java ??? ???? ???

Spring ???? ???? Spring Boot ????? ??? ?? ???? ?????.

• Spring Web
• Spring Data JPA

2. ?? ? ?????

?? ???? Product ???? ???? ProductRepository ????? ?????? ?????.

3. REST ???? ??

???? ???? ProductController? ???? Product ???? ?? ??? REST ?????? ?????.

4. Angular ???? ???

???? ???? ?? ??? ???? Angular ????? ????.

ng new [project-name]

5. Angular ????? package.json ???? Spring Boot Java ???? ?????. , Spring Boot Java ??? ??:

"dependencies": {
  ...
  "spring-boot": "^2.6.6",
  ...
}

6. CORS ??

Spring Boot ??????? ? ?? ??:

@Configuration
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.cors().and()
            ...
    }

}

7?? CORS(Cross-Origin Resource Sharing)? ?????. ?? ??? Spring Boot Java ????? ???? ?????? ?????. ?? ???? ProductController?? ?? ??? ???? ??? ?????.

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

@Component({
  selector: 'app-product-list',
  templateUrl: './product-list.component.html',
  styleUrls: ['./product-list.component.css']
})
export class ProductListComponent {
  products: Product[];

  constructor(private http: HttpClient) {}

  ngOnInit(): void {
    this.http.get<Product[]>('/api/products').subscribe(products => {
      this.products = products;
    });
  }
}

?? ??: Spring Boot ? Angular

? ?? ????? ??? ?? ?? ??????? ????.

???:

??? ??:
• Angular? ???? ??? ?? ?? ? ?? ??? ?????? ??? ? ?????.
• ?????? ??:

Angular ?????? ngserve? ?????.

??????? ??? ??(????? 8080)?? ?????. ?? URL? ???? ?? ??? ? ? ????: http://localhost:4200/products.

? ??? Java ?????? ????? Angular ?????? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!