import ReactDOM from 'react-dom' // 리액트 컴포넌트 => htmlelement 연결하기 import React from 'react'; // 리액트 컴포넌트 만들기 ReactDOM.render( . document.getElementById('hello-example') //이걸 통해서 얻어온 html 앨리먼트(실제 DOM) 에 이 컴포넌트를 그려라 라는 의미 ); class HelloMessage extends React.Component { //리액트 컴포넌트 render() { return ( Hello {this.props.name} ); } } ReactDOM.render 어떤 컴포넌트를 실제로 웹에 표현하기 위해선 실제 어던 HTML 앨리먼트에 이 컴포넌트를 그리라..

❓ 구조 분해 할당이란 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다. 간단히 알아보기 var x = [1, 2, 3, 4, 5]; var [y, z] = x; // 미리 저장해둔 배열로부터 할당받음 console.log(y); // 1 console.log(z); // 2 활용 let array = [1, 2, 3, 4, 5]; let [a, b, ...rest] = array; console.log(rest); // [3, 4, 5]; 응용 배열의 첫번째 요소와 두번째 요소를 변수에 담기 보통의 경우 const array = [1, 2, 3]; const firstElement = array[0]; const secondElement = ar..

💭 querySelector()는 Element 인터페이스의 메소드로, CSS 선택자에 매치되는 하나 이상의 element 중 첫 번째 항목을 반환해준다. 💭 createElement()는 객체에 메소드를 실행하여 메모리상에 인수 값을 넣어주고, 그 값을 생성한 변수에 넣어줄 수 있다. 💭 addEventListener(’click’ , ) 는 페이지 상에서 클릭할때마다 특정 이벤트를 발생시킨다. 💭 appendChild()는 html 구조에는 존재하지 않는 요소를 자바스크립트를 활용하여 넣어줄 수 있다. ul태그만 존재하는 html 에서 js 를 활용하여 li 요소 만들어 출력하기 html 상의 ul 태그에 해당하는 요소를 찾아준다. const ulEl = document.querySelector('u..

비교 연산자 “ ===” 를 활용 function isEqual(x , y) { return x === y } console.log(isEqual(1 , 1)) // true console.log(isEqual(2 , '2')) // false 논리 연산자 대표적으로 "&&", "||", "!" 연산자가 있습니다. const c = 1 === 1 const d = 'ab' === 'ab' console.log(a && b) //and 연산자 - 모두 다 true 여야함 console.log(a || b) // or 연산자 - 하나만 true 여도 true 삼항 연산자 if else 문은 더욱 직관적으로 볼 수 있지만, 삼항 연산자를 활용한다면 보다 더 간단히 식을 표현할 수 있다. const e = 1 ..

console.log : 코드 문제를 해결하거나 데이터 흐름을 추적할 때 사용하는 기능 가장 기본적으로 자바스크립트에선 console 이라는 객체에 메소드를 붙여 사용한다. console.log 를 활용해 로그에 “Hello World !” 를 출력해보자. console.log('Hello World !")​ ​ typeof 변수의 데이터타입을 반환하는 연산자 Hello World ! 의 데이터 타입을 알기 위해선 ? console.log(typeof 'Hello World!') 그 외의 다양한 데이터타입 추출 ​ console.log(typeof 'Hello World!') console.log(typeof 123) console.log(typeof true) console.log(typeof unde..

시작(다운로드) nvm-windows 검색 후 깃허브 참고하여 다운받기 (https://github.com/coreybutler/nvm-windows/releases)-nvm-setup.zip 다운 터미널 $ nvm --version 1. 정상적으로 다운되었다면 위 명령어로 버전 확인이 가능하다. $ nvm ls 2. 노드 버전 확인 아무것도 뜨지 않는다. $ nvm install 12.14.1 3. 다운로드 하고자 하는 노드의 버전을 입력하여 다운 (짝수 버전이 안정적인 버전이다.) $ nvm ls 4. 다시 버전을 확인해보면 다운받았던 버전이 뜬다. 만약 여러 버전을 다운받았다면 $ nvm use 12.14.1 4-1. 사용하고자 하는 버전 지정이 가능하다. 12.21.0 에서 12.14.1 로 변경..