vue.js (3) 썸네일형 리스트형 Spring Boot, Vue.js 캘린더에 일정 추가하기 이벤트 추가하기 지난 게시글에서 이벤트 추가 Dialog를 생성하였다. 오늘은 Dialog를 통해 이벤트를 추가하면 해당 유저의 Event Table에 데이터가 삽입되고 캘린더에 추가된 이벤트가 보이도록 해볼 것이다. Spring Boot Event Entity @Entity @NoArgsConstructor(access = AccessLevel.PROTECTED) @Getter public class Event extends BaseTimeEntity { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(name = "event_id") private Long id; @ManyToOne(fetch = FetchType.LAZY) @Join.. Vue.js Core Libraries(Vue Router와 Vuex), MD Bootstrap 설치 및 로그인 회원가입 화면 제작 vue 프로젝트 생성은 해당 게시글을 참조하시면 됩니다. 이해가 안 되는 부분들은 공식 사이트를 참조하시면 많은 도움이 될 거 같습니다. Vue Router, Vuex, Axios 설치 Vue Router 싱글 페이지 애플리케이션을 구현할 때 사용하는 라이브러리 Vuex vue.js 애플리케이션을 위한 상태 관리 패턴과 라이브러리 Axios 뷰에서 권고하는 Promise 기반의 HTTP 통신 라이브러리 vue create로 생성한 프로젝트의 package.json을 보면 core-js, vue만 의존성이 추가된 것을 알 수 있다. 화면 제작에 앞서 뷰의 코어 라이브러리인 vue router, vuex와 axios를 설치한다. npm을 통해 설치한 후 package.json을 보면 의존성이 추가된 것을 확.. SpringBoot와 Vue.js 연동하기 Vue.js 프로젝트 빌드 시 스프링 부트 프로젝트 resouces/static 이하에 빌드되게 설정하는 게시글 SpringBoot 프로젝트 생성 스프링 부트 스타터 해당 링크를 들어가면 스프링 부트 프로젝트를 생성할 수 있다. Spring Initializr를 이용하여 위와 같이 Spring Web만 의존성 추가한 후 Generate를 클릭하여 프로젝트 파일을 다운로드한다. 다운로드한 프로젝트 파일을 인텔리 J로 실행시킨 후 서버를 띄워 프로젝트가 정상 동작하는지 확인한다. 앱이 정상적으로 구동되는 것을 확인하였다. 그럼 이제 Vue프로젝트를 다운로드한다. Vue 프로젝트 생성 Node.js 공식사이트 우선 Vue 프로젝트를 생성하기 위해선 Vue CLI가 필요하고 Vue CLI를 다운로드하기 위해 N.. 이전 1 다음
