Today Mini Learned :

기록하는 습관 들이기

전체보기 106

[모두모두 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

[React] api key 숨기기, React 환경에서 Kakao Map API 사용 시 api key를 관리하는 방법

React 환경에서 Kakao Map API를 사용하면서 api key를 관리하는 방법 1. dotenv 설치 yarn add dotenv // or npm install dotenv 2. index.html의 head부분에 스크립트 추가 3. 프로젝트의 최상단에 .env 파일 생성 src파일 내에 만들어야 했나 싶었는데 index.html에서도 써야하고 해서 그냥 최상단? 사진 위치에 해줬을 때 잘 동작했음 4. gitignore에 등록 우리의 소중한 api key는 노출되면 안되니까 5. env에 api key 작성 REACT_APP_KAKAOMAP_API_KEY=qwer1234 반드시 REACT_APP_으로 시작해야 한다 설정 끝!

[CSS] 텍스트 외곽선 효과 주기, 텍스트 테두리 만들기

다음과 같은 글씨를 꾸미기 위해 노란색으로 텍스트를 둘러주려고 한다. 방법 1. -webkit-text-stroke 사용 -webkit-text-stroke: 1px yellow; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: yellow; 다음과 같은 코드로 적용시킬 수 있다. 그러나 관련 문서를 보면 해당 방식으로 테두리를 주는 것이 표준이 아니며, IE에서는 지원이 되지 않는다고 한다. 또한 이 방식은 글자의 안쪽으로 테두리를 주는 방식이라 글자가 작으면 다음과 같이 보이는 특징이 있다. (방법 2와 비교해보면 다르다) 방법 2. text-shadow 사용 text-shadow: -1px 0px yellow, 0px 1px yellow, 1..

[백준] 1759. 암호 만들기

백준 문제 풀이 [백준] 1759. 암호 만들기 1759번: 암호 만들기 첫째 줄에 두 정수 L, C가 주어진다. (3 ≤ L ≤ C ≤ 15) 다음 줄에는 C개의 문자들이 공백으로 구분되어 주어진다. 주어지는 문자들은 알파벳 소문자이며, 중복되는 것은 없다. www.acmicpc.net 문제 해석 입력으로 L,C가 주어지고, C개의 문자들이 주어진다. 이 중 L개를 골라서 최소 한 개의 모음과 두 개의 자음으로 이루어진 암호를 모두 출력하는 문제이다. 풀이 이 문제는 순열을 이용해서 모든 경우를 다 구하면서 조건에 맞는 것만 출력해 주는 식으로 풀었다. // 1. 입력받는 부분 int input_l, input_c;// 3> input_c; for (int i = 0; i < input_c; i++) ..

ALGORITHM 2021.07.28

[백준] 15663. N과 M (9)

백준 문제 풀이 [백준] 15663. N과 M(9) 15663번: N과 M (9) 한 줄에 하나씩 문제의 조건을 만족하는 수열을 출력한다. 중복되는 수열을 여러 번 출력하면 안되며, 각 수열은 공백으로 구분해서 출력해야 한다. 수열은 사전 순으로 증가하는 순서로 출력해 www.acmicpc.net 문제 해석 15654. N과 M(5) 문제와 비슷한 문제이다. 역시 브루트 포스를 통해 해결했다. 다른 점은 예제의 입력을 보면 15654번 문제와 다르게 주어진 자연수가 중복된 숫자가 올 수 있다는 것. 즉 1824 이런 숫자만 주어지는 것이 아닌 1118 이렇게 1이 여러 번 있는 자연수의 입력도 주어질 수 있다는 것이다. 출력의 조건을 보면 중복되는 수열을 여러 번 출력하면 안 된다. 그러므로 N과 M(5..

ALGORITHM 2021.07.23

[C++] [알고리즘] string 관련 문제를 풀 때 더 빠르게 하기 위한 방법들

s.at(i) → s[i] s.at(i)는 범위 체크가 있으나 s[i]는 없음 s.push_back('a') → s += "a"; 여러 글자 추가할 때에는 s+="qwer"로 추가하는 것이 좋음 s1 == s2 → s1.compare(s2) == 0 s1과 s2를 비교할 때, compare를 사용하는 것이 더 빠름 compare함수는 s1과 s2을 비교하면서 s1이 더 길이가 짧거나, s2과 처음으로 다른 글자가 더 작은 글자(a

ALGORITHM 2021.07.13