Spring Boot i Angular 6

Question

Witam Serdecznie. Chciałem sobie stworzyć aplikacje z wykorzystaniem Springu gradle  do back-endu i Angulara6 do front-endu. Tworze sobie projekt Spring bootowy importuje zależności itd.. itd.. Tworze potem w tym projekcie w katalogu src/main/webapp projekt Angularowy z wykorzystanie webStorma. Następnie do pliku gladle.build dodaje odpowiednie zależności do instalacji i zbudowania angulara. 

def webappDir = "$projectDir/src/main/webapp"
sourceSets {
    main {
        resources {
            srcDirs = ["$webappDir/dist", "$projectDir/src/main/resources"]
        }
    }
}

processResources {
    dependsOn "buildAngular"
}

task buildAngular(type:Exec) {
    dependsOn "installAngular"
    workingDir "$webappDir"
    inputs.dir "$webappDir"
    group = BasePlugin.BUILD_GROUP
//	outputs.dir "$webappDir/dist"
    if (System.getProperty("os.name").toUpperCase().contains("WINDOWS")){
        commandLine "ng.cmd", "build"
    } else {
        commandLine "ng", "build"
    }
}

task installAngular(type:Exec) {
    workingDir "$webappDir"
    inputs.dir "$webappDir"
    group = BasePlugin.BUILD_GROUP
//	outputs.dir "$webappDir/dist"
    if (System.getProperty("os.name").toUpperCase().contains("WINDOWS")){
        commandLine "npm.cmd", "install"
    } else {
        commandLine "npm", "install"
    }
}

Gdy w katalogu src/main/webapp daje "ng serce" i potem w przeglądarce odpalam localhost:4200 wyswietla się jakaś tam przykładowa strona z angulara. Gdy natomiast buduje aplikacje w springu "gradle jar" a nastepnie odpalam localhost:8080  to powinno wyświetlić mi to samo co na localhost:4200 jednak nie wyświetla mi tego samego co na localhost:4200 jest pusta strona tak jakby nic nie było...Co robie nie tak ? Chciałbym iść  dalej zrobić routing w angularze itd ale póki to nie działa to nie ma sensu. Mógłby ktoś mnie naprowadzić ? Bo siedziałem wczoraj cały dzień i nic nie udało się wykombinować .. Link do gita z projektem.

https://github.com/TomaszReda/library.git

Answer 1

A zmieniłeś port dla angulara?

W pliku angular.json: 

projects": {
    "project-name": {
        ...
        "architect": {
            "serve": {
                "options": {
                  "host": "0.0.0.0",
                  "port": 5000
                }
            }
        }
        ...
    }
}

ewentualnie za pomocą cli - lepsza opcja 

dla angular-cli.json 

  "defaults": {
    "serve": {
      "host": "0.0.0.0",
      "port": 8080 
    }
  }
}

lub po prostu     

komenda ng serve --port  [ numer portu]

Comments

A to nie czasem spring zarządza portem ?

WebStorem odpalam cześć front-endową i odpala się na localhost:4200 i wszystko działa  . Tak więc wyłączam i Intellij IDEA odpalam back-end i po zainstalowaniu angulara i zbudowaniu pluginem projektu powinny być normalnie pod localhost;8080 to samo co pod localhost:4200..

 

Chodzi mi o to żeby IntellijIdea np odpalić aplikacje front-end i backe-endowa razem. I żeby działało na localhost:8080. Nie o to żeby odpalać oddzielnie front  - back-end

---

no to odpowiem tam, w jaki sposob spring boot ma obsluzyc strone startowa Angulara na swoim porcie skoro nie stworzyles nawet kontrolera? ;] do obslugi rzadania ?

---

A po zainstalowaniu angulara nie powinien brać domyslnie z angulara ?

Np jakbym stworzył w angularu routing typu login,register ?

to pod localhost:8080/login nie powinna sie wyświetlić strona z logowaniem np ?

Sorki za głupie pytania ale z angulara zrobiłem tylko 1 prosty kurs i tyle... I nie mam pojecia jak połączyć te aplikacje a ciezko znalezc jakis przykład..

---

https://dzone.com/articles/building-a-web-app-using-spring-boot-angular-6-and

 

 no nie.. bo skad on ma wiedziec jaki URL i co wgl ma obslugiwac ? w jaki sposob ma to obslugiwac itp... to nie dziala tak za automatu 

@Controller
@RequestMapping("/home")
public class HomeController {
       @GetMapping
       public String home(Model model) {
              return "forward:/index.html";
       }
}

 

---

No dobra ale w takim razie to po co w ogóle robić routing w angularze skoro i tak musimy strzelać urlami w kontrolerach ?

Np w pracy mam aplikacje reactową + spring boot i czegoś takiego nie ma ?

Czy react az tak róznicy sie od angulara ?

---

na pewno są Controlery jesli jest to boot+ react... bierzesz się za coś nie znając podstaw? poczytaj czym jest

SPRING MVC- jak działa, czym jest dispatcher servlet

czym jest Handling mapping,  struktura działania REST API... 

---

Myśle ze mam wystarczające podstawy xdddd

Jakby ktoś miał taki sam problem to rozwiązaniem jego przerzucenie z angulara (folder dist) do src/main/resources i spring automatycznie wykryje index.html i go odpali pod localhost:8080 dalej jeśli mamy routing w angularze wszystko będzie śmigać :)