영감을 (inspire) 주고픈 개발 블로그

Spring boot 와 vue / react 연동 방법 링크 본문

컴퓨터 이론/흥미

Spring boot 와 vue / react 연동 방법 링크

inspire12 2019. 12. 16. 01:26

https://gran007.tistory.com/entry/React-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-spring-boot%EB%A1%9C-%EB%B0%B0%ED%8F%AC%ED%95%98%EA%B8%B0-2

 

React 프로젝트 spring boot로 배포하기 (2)

이번에는 react web을 생성하고 spring boot용 jar 파일을 생성해 실행해 본다. 터미널을 열고 프로젝트의 src/main 폴더에 들어간다. cd src/main 다음 세가지 방법중 한가지를 사용해서 react app을 시작한다...

gran007.tistory.com

 

https://bkjeon1614.tistory.com/39

 

[Spring Boot] Spring Boot + Gradle + VueJS 연동

해당 포스트는 Spring Boot와 VueJS를 연동하는 과정을 작성했다. 1. Gradle에 Thymeleaf 설정 dependencies { compile('org.springframework.boot:spring-boot-starter-thymeleaf') compile('org.springframewor..

bkjeon1614.tistory.com

 

Spring boot 로 프로젝트를 만들 때 서버에 frontend 를 같이 올려야 할 경우가 많다. 

 

그 때마다 간단한 thymeleaf 로 html, js, css 의 파일 랜더링과 데이터 연결정도만 했는데 

최근에 frontend 쪽 기술에 관심을 가지면서 webpack을 바탕으로한 frontend trend 인 vue와 react를 적용하는 방법을 알아보았다. 

 

webpack을 통해 npm build 를 하면 나오는 output 파일들을 main/resources 의 statc과 template으로 경로를 지정해주면 변환된 파일을 을 읽고 랜더링해주는 방식이다. 

 

알기전엔 webpack이 되게 어렵게 느껴졌는데 js에 대한 백그라운드가 좀 생겨서 그런지 그렇게 어렵진 않았다. 

 

이제 gradle 에서 npm 연동을 통해 자동으로 npm build 를 하고 jar 파일로 만들어 떨구는 방식에 대해 찾아봐야겠다. 

 

build script 에 추가해서 gradle BootRun 에서 처리하게 할 수 있으면 될거 같다.  

저작자표시

'컴퓨터 이론 > 흥미' 카테고리의 다른 글

JS 라이브러리 모음  (0) 2019.12.22
Vue 와 같은 반응형 시스템 만들어보기  (0) 2019.12.18
컴퓨터 공학에서 말하는 스케폴딩이란 무엇인가?  (0) 2019.12.08
Maven 대신 Gradle을 써야하는 이유  (0) 2019.12.08
Web 프론트에서 .map 가 뭘까  (0) 2019.12.07
'컴퓨터 이론/흥미' Related Articles more