기록

클래스 컴포넌트 - lifecycle 과 state를 사용할 수 있다. class App extends Component { render() { return ( ) } } export default App; 함수 컴포넌트 - state를 사용할수 없었으나 훅이 업데이트되면서 사용가능 - useEffect 로 lifecycle 과 유사한 기능을 사용가능 - 근래엔 함수컴포넌트를 많이 사용함. - 리액트에서도 함수 컴포넌트 사용을권장 - 클래스보다 선언이 편리하고 메모리자원을 덜 사용 한다 const App = () => { return } export default App;

문제 부터 2,147,483,647 사이의 숫자들 중에서 하나가 주어지면 그 숫자를 2진수로 변환했을때 1과 1 사이의 연속적인 0의 길이가 긴 길이를 리턴 풀이 function solution(N) { const binary = N.toString(2); const binaryGaps = binary.slice(binary.indexOf('1') + 1, binary.lastIndexOf('1')); if (!binaryGaps) { return 0; } const zeroArray = binaryGaps.split('1').map(zeros => zeros.length); return Math.max(...zeroArray) } binary -> 2진수binaryGaps -> 첫위치 1과 마지막 1 ..

문제 풀이 function solution(s){ return s.toUpperCase().split("P").length == s.toUpperCase().split("Y").length; } toUpperCase() -> 문자열 대문자로변경 "pPoooyY" -> "PPOOOYY" split() -> 문자열을 매개변수별로 자르고 배열로 반환 매개변수는 삭제 되고 반환 split("P") -> ["", "", "OOOYY"] split("Y") -> ["PPOOO", "", ""] length -> 배열의길이 길이가 같으므로 true 리턴

소스코드 import { useState } from 'react'; import styled from 'styled-components'; const StyledCollapse = styled.div` .content{ background: blue; color: white; max-height: 0; bottom: 0; overflow: hidden; -webkit-transition: max-height 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); transition: max-height 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); } .content.on { max-height: 500px; -webkit-transition: max-h..

React? 사용자 인터페이스를 구축하기 위한 선언적이고 효율적이며 유연한 Javascript 라이브러리 시작하기 CRA 설치 CRA: webpack 등 별도의 세팅없이 리액트를 사용할수 있는 보일러플레이트 npx create-react-app project-name ## typescript 추가시 --template typescript cd project-name npm start 쓰지않는 파일들 제거

HTML 이란? HyperText Markup Language 의 약자이며, 웹페이지를 위한 마크업 언어. HyperText - 한 문서에서 다른 문서로 즉시 접근할 수 있는 텍스트 Markup - 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어 마크업 언어 Language - 언어 확장자 - *.html, *.htm HTML 기본구조 태그설명 태그 기본 구조 // opening tag // closing tag 태그 설명 - Html 문서의 최상단 요소. - html 문서에대한 메타데이터를 포함, 제목, 스크립트, 스타일시트 등등.. - 웹페이지 문서 제목 브라우저탭에 보여지는 페이지 이름 - , , , , 과 같은 다른 메타관련 요소로 나타낼 수 없는 메타데이터 - 실질적으로 웹페이지에 보여..