새로 시작한 프로젝트에서 styled-component 남용을 방지하기 위해 emotion을 도입하여 사용하기로 했다. Emotion 도입 이유 간단한 스타일이 필요한 요소는 별도로 styled-component로 생성하지 않고 시맨틱 태그와 함께 inline style을 적용하여 구현한다면 코드도 더욱 간결해지고 시멘틱 태그의 적절한 사용으로 더나은 SEO에 기여할 수 있을 것으로 생각되었기 때문이다. 에러발생 코드 ... import { css } from '@emotion/react'; const Layout = ({ children }: LayoutProps) => { return ( {children} ); }; 위와 같이 Layout 컴포넌트에 emotion을 사용하여 inline-style을..
디자인 패턴이란? 프로그램을 설계할 때 발생할 수 있는 문제점들을 객체간의 상호관계 등을 이용하여 해결할 수 있도록 하나의 규약 형태로 만들어 놓은 것 1.1.1 싱글톤 패턴 하나의 클래스에 오직 하나의 인스턴스만 가지는 패턴 장점 하나의 인스턴스를 여러 모듈이 공유하여 사용하기 때문에 인스턴스 생성 시에 드는 비용을 절감할 수 있다. 단점 의존성(또는 종속성)이 높아진다. ⇒ TDD (Test Driven Development) 할 때 걸림돌이 된다. TDD를 할때는 단위 테스트가 서로 독립적 이어야 하며 테스트를 어떤 순서로든 실행시킬 수 있어야 하는데, 싱글톤 패턴에서는 테스트마다 독립적인 인스턴스를 만들기 어렵기 때문 ⇒ 이를 해결할 수 있는 것? 의존성 주입, DI (Dependency Inje..
출처 : 프로그래머스 - 코딩테스트 연습2020 KAKAO BLIND RECRUITMENT - 괄호 변환 https://school.programmers.co.kr/learn/courses/30/lessons/60058 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 이 문제 역시 재귀함수로 풀어야하는 문제였다. 재귀함수에 대한 이해가 부족하다보니 이 문제도 보자마자 난이도가 높다고 느꼈다. 2번 조건인 u는 "균형잡인 괄호 문자열"로 더 이상 분리할 수 없어야 하며, v는 빈 문자열이 될 수있다. 라는 부분을 제대로 이해하지 못해 1시간 내 문제를 풀지 ..
출처 : 백준 온라인저지 https://www.acmicpc.net/problem/11729 11729번: 하노이 탑 이동 순서 세 개의 장대가 있고 첫 번째 장대에는 반경이 서로 다른 n개의 원판이 쌓여 있다. 각 원판은 반경이 큰 순서대로 쌓여있다. 이제 수도승들이 다음 규칙에 따라 첫 번째 장대에서 세 번째 장대로 www.acmicpc.net ✅ Solution const input = require('fs').readFileSync('/dev/stdin').toString().trim(); const N = Number(input); const answer = []; let cnt = 0; function hanoi(n, from, other, to) { if (n === 0) { return; ..
출처: 프로그래머스 - 코딩테스트 연습 - 2021 Dev-Matching: 웹 백앤드 개발 - 행렬 테두리 회전하기 https://school.programmers.co.kr/learn/courses/30/lessons/77485 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 로직은 생각보다 어렵지 않을 것이라고 생각했는데, 코드를 작성하다보니 코드가 길어져 어려움을 겪었던 문제이다. 거의 하루 종일 코드를 작성했는데, 테스트 케이스만을 겨우 넘기고 정확성을 9.1 밖에 나오지 않았던 문제이다. ❌ Solution (정확성 9.1점) function s..
출처 : 프로그래머스 코딩테스트 연습 - 2018 KAKAO BLIND RECRUITMENT - 오픈채팅방 https://programmers.co.kr/learn/courses/30/lessons/42888 코딩테스트 연습 - 오픈채팅방 오픈채팅방 카카오톡 오픈채팅방에서는 친구가 아닌 사람들과 대화를 할 수 있는데, 본래 닉네임이 아닌 가상의 닉네임을 사용하여 채팅방에 들어갈 수 있다. 신입사원인 김크루는 카카오톡 오 programmers.co.kr ❌ Solution ( 정확성 6.3) function solution(record) { let answer = []; const users = []; for( let i = 0; i < record.length; i++) { let arr = record..
출처 : 프로그래머스 코딩테스트 연습 > 연습문제 > 실패율 https://programmers.co.kr/learn/courses/30/lessons/12930 코딩테스트 연습 - 이상한 문자 만들기 문자열 s는 한 개 이상의 단어로 구성되어 있습니다. 각 단어는 하나 이상의 공백문자로 구분되어 있습니다. 각 단어의 짝수번째 알파벳은 대문자로, 홀수번째 알파벳은 소문자로 바꾼 문자열을 programmers.co.kr ❌ Solution ( 정확성 6.3 ) function solution(s) { const arr = s.split(' '); const answer = []; let word = ''; for(let i = 0; i < arr.length; i++) { for(let j = 0; j <..
출처 : 프로그래머스 코딩테스트 연습 - 실패율 https://programmers.co.kr/learn/courses/30/lessons/42889 코딩테스트 연습 - 실패율 실패율 슈퍼 게임 개발자 오렐리는 큰 고민에 빠졌다. 그녀가 만든 프랜즈 오천성이 대성공을 거뒀지만, 요즘 신규 사용자의 수가 급감한 것이다. 원인은 신규 사용자와 기존 사용자 사이에 스 programmers.co.kr ❌ Solution function solution(N, stages) { const answer = []; let players = stages.length; const stageArr = new Array(N).fill(0); // 각 스테이지별 플레이 중인 플레이어 배열 for( let i = 0; i < s..
