본문 바로가기

java

 (102)
[팀플 - Travel Jeju] 8th course - Travel Course V [ 오늘 할 일 ] 오른쪽 맛집&관광지 카드 리스트에서 카드를 선택했을 때 왼쪽 선택 목록에 선택한 카드를 띄워준다 동시에 오른쪽 카드리스트에서 해당 카드를 삭제한다 동시에 지도에 마커를 생성한다 [ 전체적인 흐름 ] 오늘 할 일을 순서대로 진행 중복제거 및 경우의 수 (총 7가지) 제거 addCard 함수는 반복문을 돌면서 names 배열(선택 목록 배열)과 추가하려는 카드의 Title을 같을 때는 alert으로 추가된 항목인것을 알려주고 그렇지 않을때는 names 배열에 추가한 후에 value(해당 카드의 좌표)를 위도, 경도로 split 한 후에 그 좌표를 가지고 마커를 생성하여 준다 그리고 마커를 만듬과 동시에 position(카드 오버레이)를 만들어주어서 마커 위에 해당 카드의 제목을 같이 띄워..
[팀플 - Travel Jeju] 7th course - Travel Course IV [ 오늘 할 일 ] 여행경로 서비스 - 맛집 & 관광지 리스트 Controller -> RestController로 변경 여행 & 관광지 버튼 클릭 시 ajax로 데이터만 수정하는 방식으로 변경 [ 전체적인 흐름 ] 버튼 클릭 시 파라미터로 어떤 버튼을 클릭했는지 같이 전송 RestController에서 파라미터 값으로 원하는 sql문 실행하여 값을 받아온다 DB에서 가져온 값을 해당 값에 맞는 모델에 실어 jsp로 보낸다 jsp에서는 javascript단에서 데이터를 원하는 형식에 맞추어 html단으로 전송 html단에서 화면에 노출 ajax를 이용하기 전에 일반 Controller를 이용하여 카드를 띄우는 코드 forEach문을 이용하여 미리 작성해둔 카드 UI의 원하는 위치에 이미지, 제목, 위치들..
[팀플 - Travel Jeju] 6th course - Travel Course III [ 오늘 할 일 ] 날씨 API를 이용하여 여행경로 서비스에 제주도 날씨 상시 업데이트 기능 추가 [ 전체적인 흐름 ] json 형태로 데이터를 받아오기 때문에 pom.xml에 라이브러리 추가 새벽 2시 기상정보 업데이트 - 12시~2시까지의 빈 시간대는 오류 발생 날씨 관련 모든 정보를 받은 데이터를 원하는 값만 추출 원하는 값들을 조합하여 해당 기상정보에 맞게 이모지로 변경 이모지, 강수량, 현재 온도만 view단으로 모델에 실어서 전송 jsp의 javascript 단에서 원하는 디자인에 맞게 구성 html단으로 전송하여 화면에 출력 날씨 정보를 담은 데이터가 json형식으로 api에서 넘어오기 때문에 json 라이브러리를 추가하였다 이때 주의할 점은 pom.xml에 라이브러리를 추가하고 maven을..
[팀플 - Travel Jeju] 5th course - Travel Course II [ 오늘 할 일 ] 여행경로 찾기 디자인 수정 맛집 & 관광지 리스트 UI 구성 서비스 이용방법 Modal로 구성 [ 전체적인 흐름 ] Front단은 부트스트랩을 이용하여 각각의 요소 (버튼 디자인, 카드 UI 등)들을 디자인 Modal 만들기 DB-카드리스트 연동 6명의 팀원이 2인 1조로 3개의 조로 나뉘어 계획을 구성하였다 3주라는 짧은 시간 안에 프로젝트를 완성해야 하기 때문에 계획을 방대하게 잡기에는 어려움이 있을 것 같아서 필수적으로 필요한 기능들을 우선순위로 나누어 계획을 구성하였다 내가 속해 있는 조는 지도 API를 많이 이용해야 하는 기능들을 도맡았다 폴리곤, 여행경로 및 리스트, 사용자가 등록하는 게시글 안에서의 map (좌표를 알기 위함), 날씨 API 등 모든 것들이 처음 접해보는 ..
[팀플 - Travel Jeju] 4th course - Travel Course UI [ 오늘 할 일 ] 여행경로 찾기 기능을 구현하기 위해서 UI부터 구성 기능 추가할 것 정리 팀원 전체 회의 [ 전체적인 흐름 ] 화면단에서 세개의 bar (navbar / left-sidebar / right-sidebar)를 나눈다 메인에 지도를 넣고 나머지 3개의 bar UI 구성 첫 번째 과정으로는 큰 틀을 3개의 bar와 메인(지도 삽입 부분)으로 구성하였다 아직 데이터를 가져오는 코드들은 구상하지 못하였고, css만 이용해서 아래 이미지와 같이 UI를 구성하였다 왼쪽, 오른쪽 사이드바에만 스크롤을 넣어야 하는데 (카드가 많아졌을 때 지도는 스크롤되면 안 되기 때문에 해당 부분에서만 스크롤이 되어야 한다 ) overflow-y 속성에 scroll 값을 주고, 높이를 결정하면 해당 부분에만 스크롤..
[팀플 - Travel Jeju] 3rd course - Map Coordinates [ 오늘 할 일 ] 경로 찾기를 구현하려면 맛집 & 관광지 카드 클릭 시 지도에 마커를 표시하는 기능을 넣어야 한다 (위 이미지의 오른쪽 리스트에서 카드 형식으로 DB에서 데이터를 가져와 만들어줄 예정이다) 지도에 마커를 표시하기 위해서는 좌표를 알아야한다 사용자가 맛집 & 관광지를 등록할 때 좌표를 스스로 넣기에는 많이 부담된다고 판단 사용자가 등록할 때 지도를 삽입해 좌표를 백엔드단에서 알아서 처리해 구해주는 기능을 구현해야 한다 [ 전체적인 흐름 ] 카카오맵을 가져와서 키워드로 장소를 검색해서 원하는 장소를 선택할 수 있게 한다 장소 선택 시 자동으로 위도, 경도를 구해서 DB에 들어갈 값을 채우기 위해 입력값에 자동으로 들어가게 해야 한다 처음으로는 키워드로 장소를 검색하고 목록 리스트를 띄워주는..
[팀플 - Travel Jeju] 2nd course - Modal [ 오늘 할 일 ] 멀티 폴리곤 클릭 시 해당 구역의 정보를 DB에서 가져와 모달에 띄워주기 [ 전체적인 흐름 ] Modal을 hidden으로 숨겨서 미리 띄어놓는다 => Modal을 미리 띄어 놓는 이유는 ajax로 json 데이터만 넘어오게 만들 예정이기 때문이다 멀티폴리곤에 클릭 이벤트를 적용한다 이벤트 발생 시 ajax로 페이지 이동 없이 데이터를 DB에서 가져온다 => 단순히 폴리곤을 클릭 시에 데이터만 수정해주면 되기 때문에 ajax를 이용하였다 모달 UI 및 transform 구성 처음에는 카카오에서 발급받은 키를 이용하여 카카오 맵을 가져왔다 그 후로 미리 만든 폴리곤을 적용시킨 결과 - 폴리곤 만드는 방법 1일차 참조 https://woongbin96.tistory.com/207 그 후에..
Java 국비지원 5달 차 후기 국비지원을 시작한 지 5달이 지났다 이제는 정말 한 달 남은 시점에 들어서게 되었다 5개월간 많은 노력을 했지만, 한두 번 열심히 안 했던 기간도 있어서 후회도 된다 남은 한달간은 이런 감정이 들지 않게 더더욱 노력하는 자세로 임해야 할 것 같다 5개월 차에 접어들었을 때는 Javascript까지 모든 Front 과정을 배우고 이제는 Frontend와 Backend를 이어주는 과정인 jsp까지 수업이 끝났고 jsp의 확장 느낌인 Spring을 배우기 시작한다 Spring을 2주여간 배운 후에 최종 프로젝트를 한 달간 진행하면 모든 국비지원 과정을 수료하게 된다 최종프로젝트 사전 발표 블로그 포스팅에도 언급을 했었지만, 나는 1차 Swing 프로젝트에서 강사님 임의대로(강사님이 판단한 실력별로) 팀을 나눠..

티스토리툴바