Project/5V 16

[3nd Project] 카카오 모빌리티 API 가공하기

오늘은 예슬이 귀빠진 날아침부터 기분 좋은 날 쑥쑥 빠지는 눈을 밟으며 생일송을 들으며 왔다.헤헤 그러다 네모의 꿈을 듣고 싶어서 네모의 꿈도 들었다능 오죠사마!  그만 떠들고 코딩해야지!!!!!!  현재 길찾기를 하면 출발지와 도착지가 텍스트로 '출발지' 라고만 적혀있는데이걸 사용자가 입력한 출발지 이름으로 바꾸면서 마커도 함께 가져올려고 한다능정말 이것만 하면 나는 완벽스루네  🍒기존 displayRoute//경로 데이터 표시(텍스트)function displayRoute(data) { const routeDirections = document.getElementById("route-directions"); routeDirections.innerHTML = ''; // 기존 결과 초기화 ..

Project/5V 2024.11.28

[Portfolio] 주유소/전기차 충전소 정보 제공 및 현재 위치 기준 목적지 추천 시스템

🔹프로젝트 기간2024.11.06 - 2024.12.09 (5주) 🔹프로젝트 주제주유소/전기차 충전소 정보 제공 및 현재 위치 기준 목적지 추천 시스템 🔹담당 역할PPT 담당문서 담당주차장 페이지🔹사용 기술 환경Javascript, jsp, Java, Ajax, MySql, Tomcat, spring MVC, DBeaver,  JPA 💭프로젝트에서 배운 점1. 공공데이터 활용2차 프로젝트와 3차 프로젝트 모두 공공데이터 API를 활용하여 프로젝트를 진행하였습니다.공공데이터 포털에서 제공하는 데이터를 분석하며, 데이터의 구조와 호출 방식 그리고 데이터 처리의 효율성을 깊이 이해할 수 있었습니다.2차 프로젝트에서는 공공데이터를 부분적으로 호출하여 사용했으나,3차 프로젝트에서는 공공데이터와 카카오 A..

Project/5V 2024.11.27

[3nd Project]반응형 미디어 쿼리

아 ...토키유키 사마 3회 밖에 안남았어안돼..안돼.....안돼.........이도류 검사 나왔단말야.. 후부키인지 후븤키인지무튼 . . . 안대 2기 만들어라 가마쿠라 Dance토키유키 주군만들기 ㅠ 키르아는 찐 고양이상이라이질감이 없다눙 오늘은 반응형 CSS 다 끝내고 주말에 포트폴리오 리액트로 만들면서 김장할거야..!! 그럴거야 혼또다요 모바일 425px 작업 중 얼추 크기를 많이 맞춤길찾기 기능도 쓸 수 있답니다!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!아 ~ 눈아픈데오늘 돼지처럼 냠냠그래서 힘이 날 줄 알았으나 오히려 졸리다는 부작용이 있따. 랩탑싸이즈까지 완료했습니다.......네ㅔ네 이제 리액트로 포폴을 만드는 과정을 들고 오겠습니다. 오늘은 뭐 별..

Project/5V 2024.11.23

[3nd Project] CSS로 완성도 높이기

프로젝트 최종까지 아직 19일이나 남음. 하지만 나는 모든 기능을 구현하고 css만 남았다. 물론 계속된 테스트로 버그퇴치 해야겠찌만 그동안 리액트로 만든 포폴 좀 고치고요 자소서도 쓰고요 연말이고요~상해도 가야하고요~초큼 바뿐날들 데스네루  동동이 귀엽다자잘하게 고칠게 많아서 계속 작업 중 오늘은 자잘자잘 디테일 올리고 내일부터 반응형 ..(제일 하기 싫음) 일단 현재 위치 마커 수정 (팀장님이 어디서 훔쳐옴ㅋㅋ)  현재위치로 지도는 이동이 되었으나, 주변 모든 주차장도 함께 마커가 찍혀서 내 위치를 알아볼 수 없기 때문에 내 위치를 구별할 수 있도록 마커 수정//현재 위치를 지도에 표시function showCurrentLocation() { if (navigator.geolocation) { ..

Project/5V 2024.11.22

[3nd Project]벌레 잡기

안녕? 오늘은 따뜻한 우롱차를 한잔으로 하루를 시작합니다. 콧물 줄줄 얼굴 붓기 광광잠을 많이 잤더니 몸은 가벼워지나 얼굴은 커지는 매직감기 언제 걸리나 했더니 바로 걸리는  . . . . 오늘은 여정쿤과 닭발을 먹기로 한 날이기 때문에 빨리빨리 해야 할 일을 쳐내야하는 부지런데이하지만 빠릿한 나의 두뇌와 손은 언제나 믿음직하지 오늘은 피피티를 완성시키고, 반응형 425px 완성시키고,  세부적인 css 맞추려고 한다. 이번에 백엔드를 안쓰고 다 자바스크립트로만 구현을 해서 그런지 넘모 재밌다.  .  . 물론 백엔드도 재밌는데자바스크립트가 재밌어서 열시미 공부하고 싶어진다뇽 요즘 재밌게 보고 있는 도망을 잘 치는 도련님이거 역사 애니에여 이상한 거 아님근데 연출이 미쳤어요 진짜 기괴하고 무서우면서도 시..

Project/5V 2024.11.21

[3nd Project] 카카오 Api로 주차장 구현하기 11

너네 다 머리 내려랴 머리 내리는 게 훨 이쁘다이제 나는 현재 위치 가져오는 함수를 만들 것이여 .. 원래 있던 함수라서 바로 적용했는데 저 파란 이미지 누르면 현재 위치가 있는 맵으로 보여지는데저는 지금 봉명역에 있나요>??저는.. 분명히 .. 에헴  공공데이터가 모두 로드되면 저 주변의 주차장이 함께 뜬다!에헴.. 이제 로드뷰를 상세 팝업에 끌고 오는 작업을 해보겠다. // 팝업을 보이도록 설정 document.getElementById('parking-details-popup').style.display = 'block'; const roadview = new kakao.maps.Roadview(roadviewContainer); const roadviewClient = ne..

Project/5V 2024.11.20

[3nd Project] 카카오 Api로 주차장 구현하기 10

오우 3일 만에 한겨울이 와서 손이 시렵고 발이 시렵고 눈도 시렵고 귀도 시렵고 추워 추버 추버ㅓ..아침에 일어났더니 마켓컬리가 와있어서 신나게 상품깡그렇지만 이거 샀는데 4만원이라고? (물가 미쳤다)그릭요거트 3개 샀는데 12000원???????????????띠용핑  오늘은 주차장 CSS 마무리 짓는 날네네 제일 미뤄왔던 일을 해야합니다.  오늘 안에 다 할 수 있을까??0.0불가능은 없다!     상세적인 css를 하고 있습니다. 일단 검색창을 누르면 검색결과를 자동완성 값으로 하고 있는데이 검색창이 자기 마음대로 올라가 있어서 고치는 중  뜨아아는 뭘까요?  검색창 고쳤고상세 페이지 길찾기 버튼 누르면 바로 탭 넘어가서 적히도록 하고 싶은데 역시나 위도 경도 값으로 뜨는 군요!자 길찾기 버튼 누르면..

Project/5V 2024.11.19

[3nd Project]카카오 Api로 주차장 구현하기 9

네 검색창 기능 완벽 구현 나야나 (소곤소곤 행복행복 신남신남) 검색창 기능 코드 리뷰하고 빨리 바나나랑 요거트 먹으러 떠날거랍니당 배고파 리뷰하기 넘 싫고 빨리 튀고 싶었는데요 그럼에도 참았어요. 내일의 나는 더 하기 싫을테니까요 헤헤 오늘의 리뷰! 검색창에서 주차장을 검색할 때 자동완성 기능과 키보드 탐색 기능을 구현 🎒1. searchParking 함수function searchParking() { const searchInput = document.getElementById("parking-search").value.toLowerCase(); // 검색어를 소문자로 변환하여 가져옴 const resultsContainer = document.getElementById("autocomplete-re..

Project/5V 2024.11.17

[3nd Project] 카카오 Api로 주차장 구현하기 8

나는 힘들 때 햄토리 오프닝을 들어. 길찾기 하는 날! 일단 탭함수를 내가 막아놔서 주석을 풀고 탭 함수를 살려서 길찾기로 넘어가게 해보겠다. 먼저 parkinglot.jsp에서 영역을 만들어주었다. 출발지: 도착지: 길찾기 길찾기 경로 🚍showTab 함수// 탭 전환 함수 function showTab(tabName) { // 모든 탭 콘텐츠 숨기기 document.querySelectorAll('.tab-content').forEach(tab => { tab.style.display = 'none'; }); // 선택한 탭만 보이도록 설정 document.getElementById(tabName).style.display = 'block'; // 모든 탭 버튼에서 'active' 클래스 제거 doc..

Project/5V 2024.11.16

[3nd Project] 카카오 Api로 주차장 구현하기 7

형돈이 뱃살 = 내 뱃살 목요일이 밝았습니다. 이번주는 정말로 힘이 들어요! 헤헷 .. 할 게 너무나도 많네요!어떻게든 되겠지 나는 날 믿어 인생을 대충 살지 않으니까뭐든 뚝딱 잘 해낼거니까성실하니까암암 오늘의 목표는길찾기 기능 구현하기 - 호달달 - 길찾기를 하려면요! 일단은 카카오 모빌리티에서 API를 받아와야 한답니다. 저는 제 javascript 코드 한 번 쭉 보면서 흐름을 읽고 매개변수들 좀 본 다음에 진행하도록 하겠습니다. 리뷰를 한 번 하고 해야지 잘 되더라고요, ,그래서 오늘 7편은 코드 리뷰 및 흐름 이해로 하고 길찾기는 8에서 하겠습니다. ㅎ . 챌린지 때문에 나누는거 맞음!🚧주요  흐름페이지가 로드되면 카카오 지도가 초기화되고, fetchParkingLotData호출fetchTot..

Project/5V 2024.11.15