나보단 잘하자

2. JSX 소개 const element = Hello, world!; JSX는 리액트 엘리먼트를 생성함. 리액트의 컴포넌트는 마치 레고조각처럼 유닛으로 관심사들을 분리한다. 예를 들어, header 컴포넌트는 header만 다루는 레고조각이다. jsx 컴파일이 끝나면 정규 자바스크립트 함수 호출이 되고 객체로 인식된다. jsx는 html보다는 자바스크립트에 가깝기 때문에, 리액트 돔은 html 어트리뷰트 이름 대신에 카멜케이스 명명 규칙을 사용한다. 예를 들어 class는 class-name이 아닌 className이 된다! 태그가 비어있다면 아래와 같이 바로 닫아주어야 한다. const element = ; 기본적으로 모든 값을 렌더링 전에 ///이스케이프 시키기 때문에 악성 인풋은 주입되지 않는다..

문제 https://programmers.co.kr/learn/courses/30/lessons/81301 코딩테스트 연습 - 숫자 문자열과 영단어 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자 programmers.co.kr 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자릿수를 영단어로 바꾸는 예시입니다. 1478 → "one4seveneight" 234567 → "23four5six7" 10203 → "1zerotwozero3" 이..

문제 점심시간에 도둑이 들어, 일부 학생이 체육복을 도난당했습니다. 다행히 여벌 체육복이 있는 학생이 이들에게 체육복을 빌려주려 합니다. 학생들의 번호는 체격 순으로 매겨져 있어, 바로 앞번호의 학생이나 바로 뒷번호의 학생에게만 체육복을 빌려줄 수 있습니다. 예를 들어, 4번 학생은 3번 학생이나 5번 학생에게만 체육복을 빌려줄 수 있습니다. 체육복이 없으면 수업을 들을 수 없기 때문에 체육복을 적절히 빌려 최대한 많은 학생이 체육수업을 들어야 합니다. 전체 학생의 수 n, 체육복을 도난당한 학생들의 번호가 담긴 배열 lost, 여벌의 체육복을 가져온 학생들의 번호가 담긴 배열 reserve가 매개변수로 주어질 때, 체육수업을 들을 수 있는 학생의 최댓값을 return 하도록 solution 함수를 작성..

css, scss의 사용을 위해 항상 다른 파일을 만들어야 하거나 styled component처럼 새 파일이나 마찬가지인 코드를 작성해야 하거나 그렇다고 부트스트랩처럼 자유도가 떨어지는 것 도 아닌 테일윈드를 요즘 애용중이다. 테일윈드로 아래처럼 연속으로 이어지는 것 같은 x축 슬라이드를 구현해보고자 한다. 1. tailwind.config.js 테일윈드의 모든 추가 속성은 이곳에서 적용시킨다. 키 프레임과 애니메이션은 헷갈리지 않게 아래의 루트에 넣어주자. module.exports = { theme: { extend: { keyframes: { 키프레임 적는 곳 }, animation: { 애니메이션 적는 곳 } }, } } 참고로 본인의 버전은 아래와 같다. { "dependencies": { "..