늘 겸손하게

목차 TypeScript의 타입들 string number boolean Null / Undefined 배열 객체 함수 Any Unknown Tuple Never Union Intersection TypeScript의 타입들 타입스크립트에서 변수에 값이 할당될 때 : (콜론) 기호로 변수에 할당될 값을 고정시킬 수 있다. let age: number = 30 let name: string = 'Mike' string // string let str: string // 지금은 undefined가 할당되어도 나중에는 string 타입이 와야한다는 의미 let red: string = "Red" let blue: string = "Blue" let templateStr: string = `I have colo..

목차 case문 syntax-구문 예시 CASE 문 MySQL 구문으로 프로그래밍 언어의 if, else 문과 똑같은 역할을 한다. Syntax - 구문 CASE WHEN 조건1 THEN 결과1 WHEN 조건2 THEN 결과2 .. .. WHEN 조건N THEN 결과N ELSE 결과 END; 다른 프로그래밍 언어와 같이 위에서 아래로 조건을 탐색하다가 맞는 조건의 결과를 반환하고 탐색이 중단된다. 만약 어떤 조건도 맞추지 못한다면 ELSE 문의 결과를 반환한다. ELSE 문도 없다면 NULL을 반환한다. 예시 car price 소나타 3,000 람보르기니 30,000 위와 같은 테이블이 있다고 가정할때 select car, case when price > 10000 then 'expensive' whe..

목차 문제 상황 문제 원인 해결책 - dependencies 배열 (의존성 배열) dependencies 배열 특징에 따른 결과 문제 상황 useEffect 메서드의 첫 번째 인자로 컴포넌트가 렌더링 된 이후에 실행할 코드를 넘겨주었습니다. api를 통해 데이터를 가져오는 코드였는데 데이터를 성공적으로 가져오면 dataRead state를 true로 변경하여 loading 화면에서 실제 앱 화면으로 변환되도록 구현했습니다. 하지만 불필요하게 api 호출을 두 번하는 문제가 발생했습니다. useEffect(() => { async function fetch_data() { console.log("fetch_data") console.log("dataRead : ", dataRead) const api_ke..

목차 hover 코드 hover 특정 버튼 위에 마우스 포인터를 올리면 확대되는 이펙트를 본 적이 있을 겁니다. 이를 css로 구현 가능합니다. 코드 해당 요소에 대해 hover 되기 이전과 hover 된 상태의 css 스타일이 각각 한 개씩 필요합니다. 위 gif에서 화살표 버튼의 id는 'scroll-to-top'입니다. 그러므로 마우스가 요소 위로 올라왔을때올라왔을 때 요소 크기를 키우기 위해서는 ':hover' 가상 선택자를 붙여주고 transform: scale() 속성을 사용합니다. 아래와 같은 css를 적용하면 마우스가 요소 위로 올라왔을 때 요소 크기는 1.2배로 커집니다. #scroll-to-top:hover { transform: scale(1.2); } 여기에 자연스러운 전환을 적용하..