개인적으로 위코드 때부터 지금까지 내가 화면을 디자인하고, 데이터까지 직접 만드는 일은 없었다. 그러나 mvc 패턴을 이해하면서 A~Z까지 전체적인 작업을 진행하고 싶었다. 그게 바로 지금 공부를 하고 있는 이유이다.
mysql 연동에 관해 설명하기 전 지금까지 작업한 내용을 먼저 공유하고싶다.
프로젝트 공개 - 메인페이지 / 상세페이지
현재 작업 완료한 UI는 위와 같다. 메인페이지 같은 경우에는 UI뿐만 아니라, 실제로 MVC패턴을 통해 DB에서 받아온 데이터로 화면을 표출하였다. 상세페이지는 오늘 카페와서 UI 만드는데 시간을 다 써버렸다...
암턴 지금 진행하고 있는 개인 프로젝트는 우리가 알고 있는 무X사, 하X버 같은 의류을 판매하는 쇼핑몰 프로젝트이다. 스프링 공부하고 있는데 "이정도는 만들 수 있어야지...😒" 하면서 시작했다.
앞으로도 의지를 잃지 않고 열심히 하자🔥
mysql 연동하기
앞에 프로젝트 얘기한다고 본론이 빠졌다...하하
개인적으로 DB를 생성하여, CSV로 데이터를 넣는 작업을 처음 해봤다. 그 내용에 관해서도 작성하고 싶지만 네X버나 구X이 더 좋은 정보가 많을거다. 그래서 나는 어떻게 DB를 프로젝트에 연동하였고, 위에 보여준 메인페이지에 어떻게 DB데이터를 표출했는지 그 내용에 대해서 서술하겠다.
나는 이번 프로젝트는 mysql을 활용하였다. 회사에서는 postgresql을 사용하지만, 뭔가 더 접근성이 좋다고 판단하여 사용하였다.
DB을 생성하여 데이터를 넣는 작업은 처음이라 조금 이상할 수 있고, 애초에 지금 DB설계도 안 하고 화면 표출 우선이라 내용이 좀 부실하다. 위는 내가 생성한 table들로 user와 product 가 있다. 여기서 product 테이블을 활용하여 화면을 표출했다.
- 위처럼 DB를 준비하고, Data를 View에 표출하기 위해 기본적인 파일구조를 갖추었다. 해당 파일들의 각 작성법은 따로 서술하지 않겠으나 아래랑 같다.
- pom.xml에 접근하면, 주석으로 친절하게 mysql을 사용하면 ~~~라고 나와있다. 저 주석부분을 아래 사진처럼 풀어준다(혹시 몰라서 남겼으니 헷갈리지 않도록...)
- 주석 해제 전
- 주석 해제 후
-
상세 설명을 하자면 groupID가 mysql인 부분을 해제하고 version을 내가 사용하는 mysql 부분으로 맞춰야한다.
-
추가적으로 groupId가 commons-dbcp인 부분도 해제를 해야한다.
- 이후 Maven install을 통해 pom.xml에서 주석을 해제한 라이브러리(맞나?)들을 설치해준다. 이 부분이 아마 node.js의 npm install과 비슷한 개념으로 알고 있다. 아님 말고...
- 다음은 context-datasource.xml의 해당 부분(DB정보)을 작성해준다. egovframework은 저렇게 친절하게 주석이 박혀있다.
- 위와 동일한 경로에 있는 context-mapper.xml을 작성한다. 첫번째 빨간 네모는 "내가 쿼리를 작성할 mapper경로"를 작성하고, 두번째 빨간 네모는 "해당 mapper를 사용하는 impl의 경로"를 작성하는 거 같다.
설정부분만 따지면 이게 전부로 알고 있다. 모든 설정을 마치고 DB데이터를 View에 표출하기 위해 전체적으로 작성한 부분은 아래와 같다.
MainController.java
MainService.java
MainServiceImpl.java
MainServiceMapper.java
MainMapper.xml
Main.jsp
기본적인 설정을 마치고, 내가 아는 방식으로 화면에 표출하는건 이런식으로 알고있다. 물론 더 좋은 방법이 있다면 배울 의지가 있고, 아무튼 이렇게 작성을 하면 젤 위에 공개한 상품 리스트를 표출할 수 있다.
프로젝트 세팅을 첨부터 끝까지 (물론 더 세밀한 세팅이 많겠지만 ㅠ) 혼자 진행하고, 이렇게 프로젝트를 진행할 수 있어서 너무 기쁘다. 아직 많이 부족하지만 해당 프로젝트를 진행하면서 공부도 열심히하고 성장하면서 포스팅도 이어가고싶다. 아자자🔥
