Atomic Habits

setTimeout 메서드는 일정시간후 함수를 실행한다. setTimeout(fn, delay); setTimeout(function(){console.log('setTimeout')}, 1000); //1초후 setTimeout출력 setInterval 메서드는 일정시간마다 함수를 실행한다. setInterval(fn, delay); setInterval(function(){console.log('setInterval')}, 1000) //1초마다 setInterval출력 한가지 주의할 점이 있다 아래와 같이 입력해보면 setInterval(console.log('setInterval'), 1000) //setInterval 한번만 출력 차이점은 함수안에 있을때 반복해서 실행한다는 점이다. 다음으로 c..

git3 - Sourcetree branch & conflict 4.2. 병합 : 서로 다른 파일 병합 목표 : master 브랜치와 새로운 opentutorials 브랜치가 각각 다른 파일(파일명이 다른 파일)을 수정 후 병합하자. 1) 마스터 외 기존 브랜치 삭제 - 마스터에 접속 - 삭제할 브랜치 우클릭 - Delete 브랜치명 클릭 - Force delete : 삭제할 브랜치와 병합하지 않아서, 지워질 브랜치의 버전(내용물)이 유실될까봐 묻는 항목 - 강제 삭제 2) 새 브랜치 생성 (opentutorials 브랜치) 3) 마스터 접속 유지 - 파일 생성 및 내용 추가 후 커밋( 메세지 : master work 5 ) 4) opentutorials 관련 사항 - opentutorials 브랜치 접..

git3 - Sourcetree branch & conflict 2. 실습준비 1) 로컬 저장소 생성 2) .git 폴더 생성 확인 / text파일 생성 및 내용 추가 후 SourceTree 반영 확인(stage) 저장소를 만드는 순간 master라는 기본 브랜치 위에서 작업을 하게 된다. 3) 버전1 완성 - [모두 스테이지에 올리기] 클릭 후 커밋 수행 4) 버전2 생성 ( 기존 txt 파일에 내용 추가 작업 ) 5) 버전3 생성 ( 기존 txt 파일에 내용 추가 작업 ) git3 - Sourcetree branch & conflict 3. 브랜치의 기본사용법 커밋, 병합 되는 History 구조 이해력 중요 1) 브랜치 생성 2) 브랜치 확인 3) master 브랜치에서 work.txt 파일 추가(..

○ 리액트 공식문서 (https://ko.reactjs.org/docs/rendering-elements.html) ○ React element는 불변객체(immuterble) - element가 한번 만들어지고 ReactDOM.render로 주입 요청 -> 변경 판단 및 반영은 리액트가 알아서 한다. ○ 재조정 (Reconciliation) (https://ko.reactjs.org/docs/reconciliation.html) - 비교 알고리즘 (Diffing Algorithm) 두 개의 트리(변경 전, 변경 후)를 비교할 때, React는 두 엘리먼트의 루트(root) 엘리먼트부터 비교합니다. 이후의 동작은 루트 엘리먼트의 타입에 따라 달라집니다. 엘리먼트의 타입이 다른 경우( 변경 전 : 버튼 요..

○ 바닐라 JS -> 변경으로 인해 Element를 다시 그림 React -> 변경된 부분만 다시 그림

○ CDN 서비스 : 리액트를 샌드박스에서 static-HTML 환경에서 사용하기 위해서 CDN서비스를 활용해야 하는데, CDN 서비스 중에 한 종류인 unpkg ○ React-dom 으로 element 생성했고, appendChild와 같은 효과를 내는 ReactDOM.render()로 rootElement에 요소를 추가함 ○ JSX : React.crerateElement 표현식의 간편한 표기법( HTML도 JS도 아닌 리액트만의 표현법 ) ○ Babel : 브라우저에서 JSX를 JS처럼 이해할 수 있도록 하는 js compiler를 이용 ( CDN으로 불러옴 ) ※ 실제 웹서비스를 제공하는 단계에서는 Babel을 웹상에서 돌아가게 하지 말고 빌드한 파일을 제공해야 한다. ○ Fragment : JS..

○ Tip - 개발자 도구 > console 창 > "jimmy".charAt(2); > 바로 결과 확인 가능 ▷ "jimmy".charAt(0); [enter] -> 'j' ▷"jimmy".charAt(0) === "jimmy".charAt(0).toUpperCase(); [enter] -> false ▷const text = "Text"; [enter] text.charAt(0) === text.charAt(0).toUpperCase(); [enter] -> true ○ HTML tag 를 생성할 때, js의 복잡한 연산을 적용할 수 있다. ○ 코드

1. 기호와 영어 이름 ~ : Tilde ` : Grave accent ! : Exclamation mark, Exclamation point ? : Question mark @ : At sign # : Hash, Pound sign, Number sign, Sharp(샾) $ : Dollar sign % : Percent sign ^ : Caret, Circumflex ( 한국어로는 윗꺽쇠) & :Ampersand, And sign * : Asterisk, Star sign ( ) : Parenthesis, Round bracket, (한국어로는 소괄호) [ ] : Square bracket (한국어로는 대괄호) { } : Curly bracket (한국어로는 중괄호) - : Hyphen, Dash, ..

○ 코드