그 땐 IT활동했지 (41) 썸네일형 리스트형 [010/API] Kakao Map API | 현위치 표시하기 1. 문제상황 카카오가 제주도에 위치해서 그런지 항상 기본 위치는 제주도로 나왔다ㅋㅋ 그래서 우리는 이 기본 위치를 현위치로 설정하기로 했다! (공식 문서도 참고! https://apis.map.kakao.com/web/sample/basicMarker/) 2. 현위치를 기본 위치로 만들어보자! 1단계 geolocation API //map.html function currentLocation() { // HTML5의 geolocation으로 사용할 수 있는지 확인합니다 if (navigator.geolocation) { // GeoLocation을 이용해서 접속 위치를 얻어옵니다 navigator.geolocation.getCurrentPosition(function(position) { var lat.. [010/API] Kakao Map API | 가게 위치 ajax로 불러오기 문제 상황 db에 있는 핸드폰 대리점들은 대략 3000개가 넘어간다. 당시 코딩 능력이 부족했던 나는 아주 정직하게 코딩했다. view에서 db의 모든 핸드폰 대리점들을 불러와서 template으로 보낸다. template내에서 JavaScripts코드를 이용해 지도 영역 내에 해당하는 대리점들 정보만 골라낸다. (3000개가 넘어가는 대리점들을 for문에 돌리는 무리수..) 이러한 방식으로 지도에 마커를 생성하니 당연히 너무 느릴 수 밖에 없었다. 게다가 지도를 움직일 때마다 지도 영역이 바뀌고 바뀌는 지도 영역에 따라 3000개 대리점을 다시 for문 돌리고 마커를 생성하니 지도 관련 기능을 만질 때마다 속도가 느렸다. 개선의 필요성을 느꼈고 ajax를 활용해 개선하기로 했다. 원래 코드 #views.. [010/API] Kakao Map API | 위치 표시하기 문제 상황 이제 지도를 띄웠기 때문에 각 핸드폰 대리점들의 위치를 찍어야 한다! db에 있는 대리점들의 정보를 불러와 지도에 찍어보자! 2022.04.09 - [그 땐 IT활동했지/그 땐 영일영 근무했지] - [010/API] Kakao Map API | 시작하기 & 지도 띄우기 [010/API] Kakao Map API | 시작하기 & 지도 띄우기 문제 상황 회사에 들어와서 가장 처음 맡은 업무는 카카오 맵 API를 이용해 지도에 핸드폰 대리점들의 위치를 찍는 일이었다. 프로젝트 당시에도 카카오 맵 API를 사용하긴 했지만 내가 맡은 기능 itwithruilan.tistory.com (↑지도를 띄우는 방법은 이전 포스팅 참조!) 공식문서 참고하기! https://apis.map.kakao.com/w.. [010/API] Kakao Map API | 시작하기 & 지도 띄우기 문제 상황 회사에 들어와서 가장 처음 맡은 업무는 카카오 맵 API를 이용해 지도에 핸드폰 대리점들의 위치를 찍는 일이었다. 프로젝트 당시에도 카카오 맵 API를 사용하긴 했지만 내가 맡은 기능은 아니어서 좀 겁이 났다. 그래도 생각보다 카카오 맵 API 문서가 너무 친절해서 잘 할 수 있었다! 공식문서도 참고! https://apis.map.kakao.com/web/guide/ 준비하기 💡카카오 맵을 이용하기 위해서는 먼저 키를 발급받아야 한다. 아래와 같이 따라해보자. 1️⃣카카오 개발자 사이트에 접속한다. https://developers.kakao.com Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지.. [멋사10/OT] OT & 웰컴키트 220319 토 OT 이틀 전 멋사 합격 소식을 받았고! 오늘은 OT를 진행하는 날이다! 처음에 사자 포즈를 하고 사진을 찍었는데 다들 너무 귀여웠다ㅋㅋㅋㅋ🦁 멋사 전용 가상배경도 주심!ㅎㅎ OT를 시작하며 운영진분들이 차례로 자기소개해주시고 이어서 10기의 자기소개가 있었다. 내 자기소개가 끝나고 깃허브 칭찬 받았는데 넘 기뿌당! 저번에 윤이랑 같이 아침부터 하루죙일 붙잡아서 만들었던 건데 완전 뿌듯ㅎㅎ 내 깃허브 프로필 히히✌🏻 깃허브 프로필을 보다보니 깨달았는데 깃허브에 대문짝만하게 I am a Back-End Developer 적어두고 서류랑 면접때 프론트엔드 개발자 희망한다고 했네ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 와우 이후 커리큘럼을 간단히 안내 받고 다음 날 웰컴키트를 받을 것이라는 말씀을 해주셨다. 그리.. [010/JS Library] chart.js | 그래프 커스텀하기 (함수편) 문제 상황 2022.03.23 - [그 땐 IT활동했지/그 땐 영일영 근무했지] - [010/API] chart.js | 그래프 커스텀하기 (일반편) 차트 커스텀은 여차저차 해냈다! 커스섬 방법과 상세코드가 궁금하면 위의 이전 포스팅을 보자! 하지만! 커스텀도 조건부로 하고 싶다면? 그 때 함수를 사용하면 된다! 함수 사용법을 알아보자! 오늘도 공식문서 참고 :) https://www.chartjs.org/docs/latest/ Chart.js | Chart.js Chart.js (opens new window) Installation You can get the latest version of Chart.js from npm (opens new window), the GitHub releases (o.. [010/JS Library] chart.js | 그래프 커스텀하기 (일반편) 문제 상황 2022.03.21 - [그 땐 IT활동했지/그 땐 영일영 근무했지] - [010/JavaScripts] chart.js | 범례 커스텀하기(3.7.1 version) [010/JavaScripts] chart.js | 범례 커스텀하기(3.7.1 version) 문제 상황 2022.03.20 - [그 땐 IT활동했지/그 땐 영일영 근무했지] - [010/JavaScripts] chart.js | 범례 커스텀하기(2.4.0 version) 차트를 그리고 범례까지 커스텀하는 것에 성공했다!(이전 포스팅↑) 하지만.. itwithruilan.tistory.com 차트를 만드는 것까지는 성공! 하지만 원하는 모양으로 만들기 위해 또 커스텀이 필요하다.ㅎㅎ 아래 공식문서에도 잘 나와있지만 실제 코.. [멋사10] 한국외대 글로벌 "멋쟁이사자처럼" 10기 면접 후기 📑 서류 전형 2022.03.04 웹개발을 배우기 시작한지 1년정도 되어가며 이제는 HTML, CSS, Javascript를 다루는데 어느정도 능숙해진 것 같다. 하지만 프론트엔드 개발자가 되기 위해서는 React를 할 줄 알아야 한다. 왜냐하면 모든 기업이 원하고 있기 때문이다ㅜ 때문에 배우려고 한두번 시도했지만 아무래도 독학이라 강제성이 없어 현생 살기에 바빴다..ㅜㅜ 그렇다면 배움에 강제성을 만들면 된다!ㅋㅋㅋㅋ 그래서 리액트를 배울 수 있는 기회를 찾아봤다. 다행히 리액트는 인기가 많은 라이브러리라 여기저기 많았는데 마침 멋쟁이사자처럼을 보게 되었다. 백, 프론트 나눠 프로젝트도 하고 방학때도 되게 많은 활동을 하길래 재밌어 보여 바로 신청하게 되었다. 서류는 비교적 간단한 질문이 나왔다. 1️⃣.. 이전 1 2 3 4 5 6 다음
