꿈꾸는 개발자의 블로그

저번에 이어 오늘은 코드 구현까지 해보았다~! 나중에 셀렉트 박스를 통해 정보를 불러올 것이기 때문에, MUI 필드를 임포트 하여 적용해놓았다. 스타일링은 Styled-components로 하였다. 전체 코드 Map.js import { useEffect } from "react"; const { kakao } = window; const Map = () => { useEffect(() => { var mapContainer = document.getElementById('map'), // 지도를 표시할 div mapOption = { center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표 level: 3 // 지도의 확대 레벨 }; var ..

10진수 → 2진수, 8진수, 16진수 1. bin(숫자), oct(숫자), hex(숫자) : 접두어 포함된 문자열 반환 2. format(숫자, '#b'), format(숫자, '#o'), format(숫자, '#x') : 접두어 포함된 문자열 반환 3. format(숫자, 'b'), format(숫자, 'o'), format(숫자, 'x') : 접두어 제외된 문자열 반환 1. bin(숫자), oct(숫자), hex(숫자) 각 내장함수를 통해 진수를 변환할 수 있으며, 반환 값은 문자열(str)이다. bin() : 10진수 → 2진수 oct() : 10진수 → 8진수 hex() : 10진수 → 16진수 print(bin(6))# '0b110' print(oct(6))# '0o6' print(hex(6)..

백준 문자열 문제를 풀다가 알게된 함수이다. 간단하게 내장 함수를 통해서 결과를 얻을 수 있었다. 문자를 아스키코드로 변경하기 print(ord('A'))// 65 아스키코드를 문자로 변경하기 print(chr(65))// 'A' 참고 이미지

Kakao Map API를 적용하여 우리 동네 사이트를 보여주고자 했다. 그렇게 하기 위해선 먼저 Kakao 사이트에서 API KEY를 발급 받아야 한다. 그리고 내 프로젝트에 발급받은 키를 등록하면 사전 준비는 완료가 된다! 다음 글에서는 구현까지 해보겠다. Kakao Map API 사용하기 : API KEY 발급 받고 적용하기 1. APP KEY 발급 클릭하기 2. 애플리케이션 추가하기 3. 플랫폼 등록하기 4. 프로젝트에 발급받은 앱 키 등록하기 1. APP KEY 발급 클릭하기 https://apis.map.kakao.com/ 에 접속하여 오른쪽 상단에 있는 APP KEY 발급을 클릭한다. 2. 애플리케이션 추가하기 앱 이름에는 프로젝트 이름을, 사업자명에 내 이름을 적고 저장한다. 3. 플랫폼 ..

자바스크립트에서의 비동기적 구현 방식에는 Callback, Promise, async/await의 3가지를 들 수 있다. 또한, 이러한 비동기 처리 방식을 동기 처리처럼 가능하게 해줄 수 있다. Callback 다른 함수가 실행을 끝낸 뒤 실행되는 함수를 말한다. 함수를 등록해놓은 후 어떤 이벤트가 발생하면 호출하는 함수로써, 파라미터로 함수를 전달받아 함수의 내부에서 실행된다. 아래의 예처럼 setTimeout 함수 안에 함수를 전달하여 3초 뒤에 실행되는 모습이다. setTimeout(function() { ... }, 3000); 이를 동기 처리 방식으로 구현하려면, 비동기 함수의 콜백 내부에서 다음 작업(비동기 함수를 호출 등)을 하면 된다. 그런데 이러한 콜백을 이용한 비동기 처리는 아래와 같이..