본문 바로가기

IT/Java - Spring Boot10

[Spring Boot] 카카오 지도 api 활용하여 지도 출력하기 프로그래밍 세계를 탐구합시다. Spring Boot에서 카카오 지도 api를 활용하여 페이지에 지도를 출력할 수 있습니다. 구현 화면 충전소 찾기로 들어오면 왼쪽 사이드바를 이용하여 지정한 반경 이내의 전기차 충전소 위치를 확인할 수 있고, 전기차 카테고리별로 항목을 선택하여 전기차 위치를 볼 수 있습니다. 카테고리는 지역구, 운영기관, 충전기타입, 시설구분이 있으며 카테고리 별로 지도에 나타나는 핀 이미지가 다르므로 동시에 여러 정보를 식별할 수 있습니다. 충전소 찾기로 들어오면 왼쪽 사이드바를 이용하여 지정한 반경 이내의 전기차 충전소 위치를 확인할 수 있고, 전기차 카테고리별로 항목을 선택하여 전기차 위치를 볼 수 있습니다. 카테고리는 지역구, 운영기관, 충전기타입, 시설구분이 있으며 카테고리 별로.. 2023. 11. 1.

[Spring Boot] 페이지에 상단 바 코딩하기 프로그래밍 세계를 탐구합시다. Spring Boot를 활용하여 페이지에 상단 바와 카테고리를 구현할 수 있습니다. 5개의 카테고리로 구성되어 있고, 하위 항목이 있는 카테고리일 경우 마우스를 올리면 하위 항목이 내려옵니다. 구현 화면 작성 코드 header.html 충전소 찾기 게시판 공지사항 Q&A 정보마당 통계정보 서비스안내 미디어 전기차 뉴스 전기차 영상 전기차 주행거리 전기차 게임 멤버십 코인교환 쿠폰함 가입하기 나의 멤버십 header2.html 충전소 찾기 게시판 공지사항 Q&A 정보마당 통계정보 서비스안내 미디어 전기차 뉴스 전기차 영상 전기차 게임 멤버십 코인교환 쿠폰함 구독하기 나의 멤버십 위와 같은 코드를 작성하여 페이지에 상단 바를 구현할 수 있습니다. 2023. 11. 1.

[Spring Boot] 페이지에 사이드 바 코딩하기 프로그래밍 세계를 탐구합시다. Spring Boot를 활용하여 페이지에 사이드 바를 나타낼 수 있습니다. 오른쪽에 번개 모양 이모티콘을 누르면 사이드바가 슬라이드 형식으로 열립니다. 로그인 전, 후에 생성되는 항목이 다르며 하위 요소가 있는 목록은 마우스를 올렸을 때 사이드바가 하나 더 열리면서 하위 항목이 나타납니다. 사이드 바의 움직임에 따라 번개 모양 이모티콘도 함께 움직입니다. 구현 화면 작성 코드 nav.html ⚡ 홈 충전소 찾기 게시판 공지사항 Q&A 정보마당 통계정보 서비스안내 미디어 전기차 뉴스 전기차 영상 전기차 게임 멤버십 코인교환 쿠폰함 가입하기 나의 멤버십 로그인 회원가입 [[ ${session.user_info.name} + '님 반갑습니다.' ]] 나의 찌리릿: 개 Mypage.. 2023. 11. 1.

[Spring Boot] 페이지에 팝업 창 띄우기 프로그래밍 세계를 탐구합시다. 오늘은 Spring Boot와 HTML을 활용하여 팝업 창을 구현하는 방법에 대해 알아보겠습니다. 오늘 하루 이 창을 열지 않기와 닫기 버튼 또한 추가하겠습니다. 구현 화면 작성 코드 popupmembership.html 오늘 하루 이 창을 열지 않습니다. 닫기 PopupController.java @GetMapping("/popupmembership") public String pop() { return "membership/popupmembership"; } index.html // 쿠키 불러오기 function getCookie(name) { var obj = name + "="; var x = 0; while (x 2023. 11. 1.

이전 1 2 3 다음

티스토리툴바