전체글 보기

[MUI] material ui, emotion으로 global style 설정하기

React에서 material ui (MUI) 을 설치했다면 emotion도 함께 설치했을 것이다. 이 글에서는 MUI와 emotion을 이용해 다음의 글로벌 스타일을 설정하는 방법을 알아 볼 것이다. reset css 전역 폰트 설정 MUI 팔레트 색상 등 설정 커스텀 1. reset css 설정하기 - CssBaseline MUI에서 CssBaseline 컴포넌트를 불러와 넣어주는 것만으로 간단하게 reset css 설정을 할 수 있다. index.tsx 과 같은 레벨이나 상위 레벨에 넣어주기만 하면 reset css 설정은 끝이다. import { CssBaseline, ThemeProvider } from '@mui/material'; import { Global } from '@emotion/r..

프로그래머스 Lv.0 | 이진수 더하기

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120885 💻 풀이 풀이 1 - 진법 변환 이용 2진수를 10진수로 변환해서 계산 후, 다시 2진수로 변환하기 function solution(bin1, bin2) { const sum = parseInt(bin1, 2) + parseInt(bin2, 2); return sum.toString(2); } 풀이 2 - 2진수 자릿수 올림 이용 예를 들어 1001 + 1111을 숫자 그대로 더하면 2110이 된다. 맨 뒷자리부터 검사해서 만약 숫자가 2라면 그 자릿수는 0으로 바꾸고 앞자리에는 1을 더해준다. 원래 2였는데 뒷자리로부터 1을 올림받아 3이 된 경우도 있을 것이다. 그런 경우에는 그 ..

프로그래머스 Lv.0 | 문자열 계산하기

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120902 💻 풀이 이 문제를 보고 eval()로 풀고 싶다는 유혹을 받았으나... 정정당당하게 알고리즘으로 승부를 보자. 공백으로 split 해서 숫자와 연산자를 순서대로 담은 배열을 만든다. 짝수번째 인덱스에는 숫자가, 홀수번째 인덱스에는 연산자가 담겨있다. sum 변수를 생성하고, i=0부터 2씩 증가시키며 i번째 숫자를 계속 sum에 축적하면 된다. 덧셈인지 뺄셈인지는 바로 앞에 위치한 i-1번째 연산자를 확인하면 된다. 다만 0번 인덱스에 있는 숫자부터 sum에 축적하려고 보면 확인할 i-1번째 연산자라고 할 게 없으므로, sum에 기본적으로 arr[0]을 설정한 다음 i=2부터 축적하..

프로그래머스 Lv.0 | 공던지기

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120843 💻 코드 풀이 1 '오 이건 원형리스트고 맨 앞에가 공 던지는 사람이 되도록 배열을 2개씩 shift, push, shift, push 반복하면 되겠다!' 하고 냅다 풀었는데 너무 날것이라 내가 생각해도 좀 웃김 function solution(numbers, k) { for(let i = 1; i 0번째 수인 1 이라는 결과가 나오는 것이다. 그러면 4번째 인덱스가 최종적으로 공을 던진다는 것을 어떻게 하면 한번에 알 수 있을까? 공을 건너뛰어서 던지지 않고 바로 옆자리 사람에게 패스하면 [3-1] 인덱스의 사람이 마지막으로 던졌을 텐데 (3번째 사람이긴 한데 인덱스로 따지면 1을 ..

프로그래머스 Lv.0 | 구슬을 나누는 경우의 수

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120840 💻 풀이 원래 5, 6, 7, 28, 33, 34, 35번 테스트 케이스에서 에러가 났다. 원인을 찾아보니까 balls와 share가 최대 30인데 곱셈을 축적해서 팩토리얼을 구하는 방식으로는 값을 감당하지 못해서 그런거였다. 분수 부분 결과값이 너무 커서 그런가 생각해서 factorial(balls) / factorial(balls - share) / factorial(share)로 이 부분을 바꿔봤는데도 틀린다. 내 생각에는 여전히 수가 크기때문에 계속 부동소수점 이슈가 발생하는 듯 싶다. 그래서 그냥 BigInt()를 씌워서 아래와 같이 풀었다. function solution(..

프로그래머스 Lv.0 - 직각삼각형 출력하기 +) nodejs readline

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120823 문제 자체는 어렵지 않다. 다만 아래처럼 nodejs의 readline 모듈을 이용해 입출력을 받아야 해서 당황했는데, 차근차근 해석하면 로직을 어디에 작성해야 할 지 알 수 있다. const readline = require('readline'); const rl = readline.createInterface({ input: process.stdin, output: process.stdout }); let input = []; rl.on('line', function (line) { input = line.split(' '); }).on('close', function () { c..

프로그래머스 Lv.0 | 최빈값 구하기

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120812 💻 풀이 최빈값을 count하기 위해 Map() 객체로 값 - 빈도수 쌍을 저장할 것이다. get()으로 쉽게 해당 값의 빈도수를 참조할 수 있기 때문이다. 주어진 숫자 배열을 돌며 최빈값을 기록하는 Map 객체에 현재 숫자가 저장되어 있다면 횟수를 +1 하고, 없다면 새로 추가한다. Array.from으로 Map을 배열로 만든 다음, 오름차순 정렬한다. 맨 뒤와 뒤에서 두번째값을 비교해서 숫자가 같다면 최빈값이 여러개이므로 -1을 반환하고, 아니라면 가장 큰 값인 맨 뒷 값을 반환한다. ...는 아이디어인데 여기에 함정이 있다. 맨 뒤와 뒤에서 두번째값을 비교하려다가 같은 숫자만 여..

프로그래머스 Lv.0 | 분수의 덧셈

문제 https://school.programmers.co.kr/learn/courses/30/lessons/120808 📝풀이 분모를 서로 곱해 통분하고, 각 분자에는 상대방의 분모를 곱해 통분한 다음 더해준다. 기약분수가 되려면 분모와 분자를 두 수의 최대공약수(GCD)로 나눠줘야 한다. (GCD - Greatest Common Divisor) 최대공약수의 범위는 1에서부터 최대 Math.min(분모, 분자)까지 될 수 있다. 따라서 for문을 돌며 분모와 분자를 나눠 나누어 떨어지게 하는 수를 gcd에 저장하고, for문이 종료될 때 나오는 최종 gcd로 분모와 분자를 나눈 결과를 반환하면 된다. 💻코드 function solution(numer1, denom1, numer2, denom2) { l..