Today Mini Learned :

기록하는 습관 들이기

PROJECT 6

[Log - 모두모두 Webapp 개발] geolocation.getCurrentPosition을 이용한 현재 위치 가져오는 과정 동기 처리하기 - Promise 객체와 async, await 이용

Geolocation API에서 현재 위치를 받아오는 getCurrentPosition을 사용할 때, 해당 줄이 비동기적으로 수행되는 문제가 있었다. 즉, getCurrentPosition으로 현재 위치를 가져온 것이 완료되기 전에 다음 줄을 수행해 버려서 문제가 되었다. 따라서 해당 글(React에서 카카오맵 API를 이용해 현재 위치 받아오는 기능 구현 오류 해결) 처럼, 로직을 바꿔 주어서 해결했었다. 이번에는 이 문제를 Promise와 await/async을 이용한 비동기->동기 처리를 통해 해결해 볼 것이다! 해결 방법 기존 코드 useEffect(() => { getMyGps(); }, []) useEffect(() => { if (userInputScreen === 1) { mapDrawer..

PROJECT 2021.11.06

[Log - 모두모두 Webapp 개발] [React] 링크 복사 버튼 구현하기 (useRef() 사용), (exeCommand를 이용한 방법과 Clipboard API를 이용한 새로운 방법 둘다 구현해보기!)

링크 복사 버튼 어떤 링크를 공유하고 싶을 때, 링크 텍스트를 클립보드로 복사하는 버튼을 자주 사용하곤 한다. 이를 React 웹페이지에서 구현하기 위해서는 어떻게 해야 할까? [방법 1] Document.exeCommand() 이용 _ deprecated 1. 먼저 useRef()를 이용해 복사 버튼의 reference를 가져온다. import React, { useRef } from "react"; const copyLinkRef = useRef(); useRef() import후 copyLinkRef에 useRef()변수 생성 2. 복사할 텍스트를 가진 input에 ref생성 ref = {copyLinkRef}로 연결해줌 3. 복사 버튼에 복사 기능을 수행하는 함수 연결 onClick을 이용해 클릭..

PROJECT 2021.10.24

[Issue - 모두모두 Webapp 개발] React에서 카카오맵 API를 이용해 현재 위치 받아오는 기능 구현 오류 해결

💥 에러 발생 상황 모두모두 웹 페이지를 구현할 때, 자신의 출발 위치를 선택하기 위해 카카오맵 API를 사용해서 지도에 마커를 띄우는 기능이 있었다. 처음 위치는 카카오 본사로 되어 있었는데, 아무래도 사용자가 출발할 위치이기 때문에 현재 사용자의 위치를 초기 위치로 잡아주고 마커를 올리면 좋을 것 같다는 생각이 들었다. 그래서 gps를 사용하여 현재 위치를 읽어오는 기능을 구현했다. 문제는... 현재 위치를 가져오는 기능 자체는 문제가 없었는데 gps에서 현재 위치를 받아오는 것보다 Latitude와 Longtitude를 통해 맵을 구성하는 기능이 이 더 먼저 수행이 되어서 현재 위치가 아닌 기본값 위치로 맵에 마커가 생겼다. curLatitude와 curLongtitude에는 기본값으로 정해둔 위치..

PROJECT 2021.09.16

[모두모두 Webapp 개발] 약속 장소 정해주는 웹 어플리케이션

모두모두 약속 장소를 쉽게 정할 수 있는 웹 어플리케이션 Github Link (개발중) GitHub - ourprojectneverends/modumodu Contribute to ourprojectneverends/modumodu development by creating an account on GitHub. github.com /Client 💁‍♀️ ❔ 모두모두 앱이란? 모임을 할 때 모임 참여자들의 위치를 입력하면 만남 장소를 정해주는 웹 어플리케이션 ❕ 특징 1. 웹 어플리케이션으로 개발하여 PC/모바일 모두 간편하게 사용 가능 2. 회원 가입이 필요 없음 3. 간단한 정보만 입력하여 방을 생성하고, 초대 링크를 공유하여 간편하게 초대 가능 4. 비밀번호를 입력해야만 방에 들어올 수 있어 허용..

PROJECT 2021.09.08

[Issue - 모두모두 Webapp 개발] 카카오맵 cross-origin 에러

💥 에러 발생 상황 모두모두 웹 앱을 react 환경에서 개발하면서, 카카오맵 API를 사용한 지도를 띄울 때 지도부분은 따로 HostMap.js라는 파일에 컴포넌트로 만들어둔 후 import해서 사용했음 그 후, 백엔드로 데이터를 보내기 위해 axios를 사용하는데 지도를 이용해서 구했던 위도/경도 정보를 받아와야 할 일이 생김. 그래서 따로 구분해놨던 지도 부분인 HostMap.js을 없애고, 이를 그대로 옮겨서 OpenMeetingPage.js에 합치려는 상황 그런데 지도를 만들 때 정상 작동했던 코드를 그대로 OpenMeetingPage.js에 넣었는데 다음과 같은 에러가 발생함 ❓ 에러가 발생한 이유 지도를 생성할 div가 위치한 곳은 state의 상태에 따라 사라졌다가 나타나는 부분이었음 그리..

PROJECT 2021.09.08

[LLVM] VirtualEditor - 가상화 난독화를 적용해주는 Pass

VirtualEditor VirtualEditor 소스코드 yarncha/llvm LLVM Pass codes to study. Contribute to yarncha/llvm development by creating an account on GitHub. github.com 관련 포스팅 (github.io) 가상화 난독화를 수행하는 pass 제작 - 1 가상화 난독화를 수행하는 pass 제작 - 2 가상화 난독화를 수행하는 pass 제작 - 3 가상화 난독화를 수행하는 pass 제작 - 4 시험기간이라 시간이 부족했지만 공식 문서를 헤메고 돌아다닌 보람이 있게 드디어 완성했다ㅠㅠ (사실 완성했다고 보기는 힘들긴 하다... 해당 소스코드에서만 동작하기 때문에 이를 개선해주는 것을 다음 목표로 삼을 것이..

PROJECT 2020.10.19