development
-
[Gatsby.js] Gatsby+Typescript에서 styled-component 본격 설정하기development/React 2022. 9. 30. 02:00
안녕하세요. 최근 Gatsby로 자기소개 페이지를 간단하게 기획해서 배포까지 완료했었는데요. Gatsby + Typescript 스펙을 주로, 스타일 라이브러리로는 styled-components를 사용했습니다. 그런데 이게 Gatsby에선 기본 React프로젝트와는 설정 방식에 살짝 차이가 있어서 이곳저곳 찾아보면서 진행했었는데요. 아마도 써놓지 않으면 잊을 수 있기 때문에! 간단하게 기록해두겠습니다. 추가적으로 누군가에게 도움도 됐으면 좋겠습니다. 1. 패키지 설치 일단 기본적으로 Gatsby 프로젝트 자체가 생성되어 있다는 전제로 진행합니다. (+ npm 사용) styled-components와 관련된 패키지부터 설치해주도록 합니다. npm install styled-components @types..
-
[프로그래머스] JadenCase 문자열 만들기development/알고리즘 2022. 9. 11. 23:04
안녕하세요. 이번 문제는 프로그래머스 2단계 - JadenCase 문자열 만들기 입니다. 정답률 81%의 쉬운 문제입니다. Jaden case라는 말을 이번 문제를 풀이하면서 처음 접해봤습니다. 견문을 넓힌 것 같아 기분이 좋습니다. 덤으로 이번 문제는 풀이 했더니 11점을 주더라구요. 아주 기분이 좋습니다. function solution(s) { let newWord = true; let result = ""; for (let i = 0; i < s.length; i ++) { const word = s[i]; if (word === " ") { result += word; newWord = true; } else { if (!isNaN(Number(word))) { result += word; } ..
-
[프로그래머스] 가장 큰 수development/알고리즘 2022. 8. 31. 17:33
안녕하세요. 이번 문제는 프로그래머스 2단계 - 가장 큰 수 입니다. 이번 문제는 빠른 정렬 알고리즘 중 하나인 퀵 소트를 사용해 풀어보려고 노력 했습니다. 이번 문제는 정렬 자체를 구현(In-place 방식은 아니지만..)하는 것은 쉬웠지만, 비교 식을 어떤식으로 잡아야 할 지에서 고민을 많이 했습니다. 풀이 후, 13점이라는 점수를 받아 기분이 좋았습니다. function quickSort(origin) { if (origin.length < 2) { return origin; } const left = []; const right = []; const [pivot] = origin; for (let i=1; i String(data) || "0")); if (answer[0] == '0') retu..
-
[프로그래머스] K번째 수development/알고리즘 2022. 8. 30. 16:31
안녕하세요. 이번 문제는 프로그래머스 1단계 - K번째 수 입니다. 이번 문제는 정렬 카테고리의 문제여서, 정렬을 직접 구현하는 것에 의의를 두었습니다. 당장 아는 정렬 알고리즘이 선택 정렬, 버블 정렬, 삽입 정렬 등의 기본 알고리즘뿐이고, 데이터의 양이 적기 때문에 아는 알고리즘 내에서 풀어보았습니다. 제가 풀이한 정답입니다. 정렬 함수는 가독성을 위해 분리했습니다. function selectionSort(answer, max) { for (let i = 0; i answer[j]) { ..
-
[프로그래머스] 위장development/알고리즘 2022. 8. 27. 18:20
안녕하세요. 이번 문제는 프로그래머스 2단계 - 위장 입니다. 이번 문제도 저번 글과 마찬가지로 해시 테이블을 사용해 해결해야 하는 문제입니다. 추가적으로 수학 공식이 필요해서, 수학 공식을 열심히 서치해서 풀었습니다. 문제가 조금 이상하다고 생각합니다. 이게.. 아무리 위장이라지만.. 상의와 바지는 필수로 입어야 하지 않을까요? 모든 옷 종류 중 한가지만 입어도 된다는게 조금 의아했습니다. 코트만 입고 다니면 바로 바바리맨 확정입니다. 우리는 모두 적절한 위장을 위해서 상의와 하의는 꼭 입는게 좋을 것 같습니다. 하지만 일단 문제가 요구하는 바를 따른 정답은 다음과 같습니다. function solution(clothes) { const hash = new Map(); for (let i=0; i
-
[프로그래머스] 전화번호 목록development/알고리즘 2022. 8. 26. 19:42
안녕하세요. 이번 문제는 프로그래머스 2단계 - 전화번호 목록입니다. 프로그래머스에서 처음으로 풀어보는 2단계 문제였습니다. 확실히 1단계 문제와는 난이도가 올라간 것이 느껴졌습니다. 설상가상 JS는 지원하지 않는 문제라서.. Python으로 풀이하였습니다. 해당 문제의 경우, 아마도 비교적 최곤에 테스트케이스가 상세하게 추가되고 효율성 검사가 더 어려워졌다고 하더라구요. 그래서 그런지 다 풀고 난 이후에 더 좋은 풀이가 있다면 참고하고자 했으나, 문제 수정 이전에 올라간 정답들이라 효율성 테스트에서 탈락하거나 테스트케이스를 통과하지 못하는 것들이 있더라구요. 이 부분은 조금 아쉬웠습니다. 이번 문제는 얼핏 보면 중첩 for문을 사용해 쉽게 풀 수 있을 것 같습니다만.. 효율성 부분에서 O(n^2)는 통..
-
[프로그래머스] 폰켓몬development/알고리즘 2022. 8. 24. 18:28
안녕하세요. 이번 문제는 프로그래머스 1단계 - 폰켓몬 문제입니다. 이번 문제는 가장 처음 읽었을 땐 무슨 말인지 이해가 잘 되지 않아 헷갈렸지만, 제대로 읽어보니 정말 쉬운 문제여서 후루룩 풀었습니다. function solution(nums) { return Math.min(nums.length / 2, new Set(nums).size); } 인생은 폼생폼사이기 때문에 한줄로 짜보았습니다. Set이 아닌 Map을 사용하는 방법도 있습니다. function solution(nums) { return Math.min(nums.length / 2, new Map(nums.map((val) => [val])).size); } 이번 문제는 거의 다 답들이 비슷한 수준이어서 다른 풀이를 가져오지 않았습니다. ..
-
[프로그래머스] 완주하지 못한 선수development/알고리즘 2022. 8. 24. 17:23
안녕하세요. 이번 문제는 Hash 개념을 사용해 풀이하는 문제입니다. 프로그래머스 1단계 - 완주하지 못한 선수 입니다. 이번 문제는 Hash를 사용해서 푸는것이 출제자의 의도에 부합하는 것 같습니다. 애초 계열이 Hash로 잡혀있기도 하구요. 저의 정답은 다음과 같습니다. function solution(participant, completion) { const data = new Map(); for (const part of participant) { if (data.has(part)) data.set(part, data.get(part) + 1); else data.set(part, 1); } for (const compl of completion) { if (data.get(compl) > 1) ..