본문 바로가기

분류 전체보기102

[TypeScript] 타입스크립트 셋업 Typescript 기반 React 앱 설치 처음 프로젝트를 만든다면 create react app을 만드는 명령어에 --template typescript를 추가로 붙여준다. npx create-react-app 앱 이름 --template typescript // or yarn create react-app 앱 이름 --template typescript 기존 프로젝트에 타입스크립트 추가하기 npm install --save typescript @types/node @types/react @types/react-dom @types/jest // or yarn add typescript @types/node @types/react @types/react-dom @types/jest 타입스크립트에게 사용.. 2022. 8. 4.
[백준 / node.js] 2480번: 주사위 세개 출처: 백준 문제 1에서부터 6까지의 눈을 가진 3개의 주사위를 던져서 다음과 같은 규칙에 따라 상금을 받는 게임이 있다. 같은 눈이 3개가 나오면 10,000원+(같은 눈)×1,000원의 상금을 받게 된다. 같은 눈이 2개만 나오는 경우에는 1,000원+(같은 눈)×100원의 상금을 받게 된다. 모두 다른 눈이 나오는 경우에는 (그 중 가장 큰 눈)×100원의 상금을 받게 된다. 예를 들어, 3개의 눈 3, 3, 6이 주어지면 상금은 1,000+3×100으로 계산되어 1,300원을 받게 된다. 또 3개의 눈이 2, 2, 2로 주어지면 10,000+2×1,000 으로 계산되어 12,000원을 받게 된다. 3개의 눈이 6, 2, 5로 주어지면 그중 가장 큰 값이 6이므로 6×100으로 계산되어 600원을 .. 2022. 7. 5.
[백준 / node.js] 2525번: 오븐 시계 출처: 백준 2525번: 오븐 시계 첫째 줄에 종료되는 시각의 시와 분을 공백을 사이에 두고 출력한다. (단, 시는 0부터 23까지의 정수, 분은 0부터 59까지의 정수이다. 디지털 시계는 23시 59분에서 1분이 지나면 0시 0분이 된다.) www.acmicpc.net 문제 KOI 전자에서는 건강에 좋고 맛있는 훈제오리구이 요리를 간편하게 만드는 인공지능 오븐을 개발하려고 한다. 인공지능 오븐을 사용하는 방법은 적당한 양의 오리 훈제 재료를 인공지능 오븐에 넣으면 된다. 그러면 인공지능 오븐은 오븐구이가 끝나는 시간을 분 단위로 자동적으로 계산한다. 또한, KOI 전자의 인공지능 오븐 앞면에는 사용자에게 훈제오리구이 요리가 끝나는 시각을 알려 주는 디지털 시계가 있다. 훈제오리구이를 시작하는 시각과 오.. 2022. 7. 4.
[백준 / node.js] 18108번: 1998년생인 내가 태국에서는 2541년생?! 출처: 백준 18108번: 1998년생인 내가 태국에서는 2541년생?! ICPC Bangkok Regional에 참가하기 위해 수완나품 국제공항에 막 도착한 팀 레드시프트 일행은 눈을 믿을 수 없었다. 공항의 대형 스크린에 올해가 2562년이라고 적혀 있던 것이었다. 불교 국가인 태국 www.acmicpc.net 문제 ICPC Bangkok Regional에 참가하기 위해 수완나품 국제공항에 막 도착한 팀 레드시프트 일행은 눈을 믿을 수 없었다. 공항의 대형 스크린에 올해가 2562년이라고 적혀 있던 것이었다. 불교 국가인 태국은 불멸기원(佛滅紀元), 즉 석가모니가 열반한 해를 기준으로 연도를 세는 불기를 사용한다. 반면, 우리나라는 서기 연도를 사용하고 있다. 불기 연도가 주어질 때 이를 서기 연도로.. 2022. 7. 3.
[백준 / node.js] 10926번: ??! 출처: 백준 10926번: ??! 준하는 사이트에 회원가입을 하다가 joonas라는 아이디가 이미 존재하는 것을 보고 놀랐다. 준하는 놀람을 ??!로 표현한다. 준하가 가입하려고 하는 사이트에 이미 존재하는 아이디가 주어졌을 때 www.acmicpc.net 문제 준하는 사이트에 회원가입을 하다가 joonas라는 아이디가 이미 존재하는 것을 보고 놀랐다. 준하는 놀람을 ??!로 표현한다. 준하가 가입하려고 하는 사이트에 이미 존재하는 아이디가 주어졌을 때, 놀람을 표현하는 프로그램을 작성하시오. 입력 첫째 줄에 준하가 가입하려고 하는 사이트에 이미 존재하는 아이디가 주어진다. 아이디는 알파벳 소문자로만 이루어져 있으며, 길이는 50자를 넘지 않는다. 출력 첫째 줄에 준하의 놀람을 출력한다. 놀람은 아이디 .. 2022. 7. 2.
[React] 여러가지 CSS방식 - Styled component React에서 css를 사용하는 방법은 몇 가지가 있다. - 하나의 css파일에서 애플리케이션 전체에 스타일 정의하기 // 클래스 이름의 중복을 피하기 위해 신경 써야 한다. - JSX 내부에서 css 정의하기 // 코드 가독성이 떨어지고 css의 다양한 속성 활용이 어렵다. - css 모듈화 하기 // 각 컴포넌트 별로 스타일을 정의할 수 있어서 클래스 이름이 중복되는 걱정을 안 해도 돼서 편하다! // 하지만 매번 요소에 className={styles.~} 작성하는 것이 번거롭다. 개인적으로 중복되는 클래스 이름을 신경 쓰지 않는 것이 너무 좋았기 때문에 css를 모듈화 하는 방식을 사용해왔다. 이번에는 styled-components를 공부하면서 어떤 방식이 효율적인지 알아보고 싶다. 공부한 몇 .. 2022. 7. 2.
728x90

티스토리툴바