치춘짱베리굿나이스

react-modal 설치 $> npm install --save react-modal # 또는 yarn add react-modal npm 링크 react-modal 용례 모달 띄우기 import Modal from 'react-modal'; const testPage = () => { return ( Hello World! ); } 코드를 실행시키고 해당 페이지를 렌더링해 보면 모달 창이 렌더링된 것을 볼 수 있다 내부에 다른 컴포넌트를 넣거나, 여러 태그를 조합하여 렌더링할 수 있다 모달이 하나의 컨테이너라고 생각하면 된다 버튼으로 모달 껐다 켰다 하기 import Modal from 'react-modal'; const App = () => { const [isOpen, setIsOpen] = u..

Styled Components 설치 $> npm i styled-components npm 링크 styled-components 용례 html 태그에 스타일 적용하기 import styled from 'styled-components'; const TestDiv = styled.div` background-color: magenta; `; const Styled = { TestDiv }; export default Styled; styled-components 라이브러리를 불러와서, 스타일을 적용하고자 하는 태그를 불러온다 예시에서는 div에 스타일을 적용하고자 했으니 styled.div를 불러오면 되고, body에 적용을 원할 경우 styled.body 이런 식으로 가져오면 된다 불러온 컴포넌트에 따..

긴자리 계산 문제 두 수 A, B를 입력받아, A+B, A-B, A×B를 구하는 프로그램을 작성하시오. 입력 첫째 줄에 A가, 둘째 줄에 B가 주어진다. 각각의 수는 10진수로 1,000자리를 넘지 않으며 양수와 음수가 모두 주어질 수 있다. 출력 첫째 줄에 A+B, 둘째 줄에 A-B, 셋째 줄에 A×B를 출력한다. 각각을 출력할 때, 답이 0인 경우를 제외하고는 0으로 시작하게 해서는 안 된다(1을 01로 출력하면 안 된다는 의미). 풀이 const bigint = () => { let input = require("fs") .readFileSync("/dev/stdin") .toString() .trim() .split("\\n") .map(BigInt); console.log( `${input[0]..

쿼드트리 문제 흑백 영상을 압축하여 표현하는 데이터 구조로 쿼드 트리(Quad Tree)라는 방법이 있다. 흰 점을 나타내는 0과 검은 점을 나타내는 1로만 이루어진 영상(2차원 배열)에서 같은 숫자의 점들이 한 곳에 많이 몰려있으면, 쿼드 트리에서는 이를 압축하여 간단히 표현할 수 있다. 주어진 영상이 모두 0으로만 되어 있으면 압축 결과는 "0"이 되고, 모두 1로만 되어 있으면 압축 결과는 "1"이 된다. 만약 0과 1이 섞여 있으면 전체를 한 번에 나타내지를 못하고, 왼쪽 위, 오른쪽 위, 왼쪽 아래, 오른쪽 아래, 이렇게 4개의 영상으로 나누어 압축하게 되며, 이 4개의 영역을 압축한 결과를 차례대로 괄호 안에 묶어서 표현한다 위 그림에서 왼쪽의 영상은 오른쪽의 배열과 같이 숫자로 주어지며, 이..

별 찍기 - 11 문제 예제를 보고 규칙을 유추한 뒤에 별을 찍어 보세요. 입력 첫째 줄에 N이 주어진다. N은 항상 3×2k 수이다. (3, 6, 12, 24, 48, ...) (0 ≤ k ≤ 10, k는 정수) 출력 첫째 줄부터 N번째 줄까지 별을 출력한다. 풀이 const recurStar = (n) => { if (n === 3) return [" * ", " * * ", "*****"]; const ret = recurStar(n / 2); let arr = []; for (let j of ret) arr.push(" ".repeat(n / 2) + j + " ".repeat(n / 2)); for (let j of ret) arr.push(j + " " + j); return arr; }; c..

등록 문제 자신이 백준 온라인 저지(BOJ)에서 맞은 문제의 수와 아이디를 그대로 출력하는 프로그램을 작성하시오. 입력 이 문제는 입력이 없다. 출력 첫 줄에 자신이 맞은 문제의 수, 둘째 줄에 아이디를 출력한다. 풀이 const baekjoon = () => { console.log("208\nchichoon"); }; baekjoon(); 반성회 함수형을 선호해서 그렇지 console.log("208\nchichoon"); 한줄로도 됨

Next in line 문제 You know a family with three children. Their ages form an arithmetic sequence: the difference in ages between the middle child and youngest child is the same as the difference in ages between the oldest child and the middle child. For example, their ages could be 5, 10 and 15, since both adjacent pairs have a difference of 5 years. Given the ages of the youngest and middle childr..

1로 만들기 풀이 const makeOne = () => { let input = parseInt( require("fs").readFileSync("/dev/stdin").toString().trim() ); let dp = Array.from({ length: 1000001 }, (n) => 0); for (let i = 2; i