console.log('로그 - 기본적인 출력')console.info('로그 - 기능적으로는 log와 같음. 사용하기에 따라 용도 구분 가능')console.warn('경고 - 문제가 될 수 있는 부분')console.error('오류 - 에러 발생 상황')let은

: attr controls, attr (loop) autoplay 사용 형태도 가능, src 사용 시 type도 추가해주면 좋음\*audio와 video 치환 가능<iframe src='' frameborder=''></iframe>: HTML 문서

blockquote cite='인용 사이트': 내용 전체가 하나의 인용문일 경우 사용q(quotation): 문장 내에 들어가는 인용문일 경우 사용cite: 인용 출처div(division): 의미가 없으나 css 스타일링에 유용span: 의미가 없고, text lev

브라우저를 통해 무언가를 보기 위해서는 tag로 표현되어야 함.웹페이지라는 것은 결국 html을 통해 표현이 된다.html이 결국 웹페이지를 통해 전달하고자 하는 모든 컨텐츠의 집합체이다.문서의 구조와 정보 위계가 명확하게 보이고, SEO에 도움이 된다.코드를 짜는 것

LifeCycle Method(생명주기 메서드)는 컴포넌트가 브라우저상에 나타나고, 업데이트되고, 사라질 때 호출되는 메서드들을 의미한다. 컴포넌트에서 에러가 발생했을 때 호출되는 메서드도 존재한다.생명주기 메서드는 클래스형 컴포넌트에서만 사용할 수 있다.출처: htt

REST(Representational State Transfer) API는 다음의 구성으로 이루어져 있다.자원(Resource): URL행위(Verb): HTTP METHOD표현(Representations)Uniform (유니폼 인터페이스)Uniform Interf

리덕스에서 dispatch를 하면 action이 reducer로 전달이 되고, reducer는 새로운 state를 반환한다.미들웨어를 사용하면 이 과정 사이에 우리가 하고 싶은 작업들을 넣어서 할 수 있다.보통 Redux 미들웨어를 사용하는 이유는 서버와의 통신을 위해

keys(), values(), entries()를 사용할 수 있는 자료구조는 다음과 같다.MapSetArray일반 객체엔 다음과 같은 메서드를 사용할 수 있다.Object.keys(obj)-객체의 키만 담은 배열을 반환한다.Object.values(obj)-객체의 값

본격적인 복습을 하는 중이다. 어제 TIL을 못 쓴 핑계를 대자면 복습하느라 피곤했다.'props'가 input, return이 output제목은 대문자로 시작함수가 시작되는 부분부터 return 사이는 JavaScript 영역return문 안쪽은 JSX(JavaScr

최근 급하게 쌓아온 모래성같은 실력이 손 틈새로 빠져나가는 느낌을 지울 수 없다.그런 이유로 흐릿해진 중요 개념들을 복기해야겠다는 생각이 들었다.props는 프로퍼티(properties)의 준말이다.상위 컴포넌트가 하위 컴포넌트에 값을 전달할 때 사용한다. (단방향 데

리덕스 툴킷은 리덕스를 개량한 것으로 생각하면 된다.리덕스를 사용하기 위해 작성했던 ducks 패턴의 요소들이 전체적인 코드의 양을 늘린다는 개발자들의 불만이 발생했고, 리덕스 팀에서는 이것을 수용하여 코드는 더 적게, 그리고 리덕스를 더 편하게 쓰기 위한 가능들을 흡

Axios는 node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트이다. 동일한 코드베이스로 브라우저와 node.js에서 실행할 수 있다. 서버 사이드에서는 네이티브 node.js의 http 모듈을 사용하고, 클라이언트(브라우저)에서는 XMLHttpRe

useSelector에 대해 다시금 생각해보는 시간을 전 조원들과 함께 가졌다.정리를 하고 나니 원리가 머릿속에 좀 더 명료하게 그려졌다.여러 번 써보면서 익숙해지는 건 별개의 문제지만...

새 TodoList를 실행하는데 오류가 났다.Can't resolve 'react-redux'구글링을 해보니 대체로 yarn 이용자는 node_modules 폴더와 yarn.lock, npm이용자는 node_modules 폴더와 package.lock.json파일을 지

현재 실행중인 코드가 끝나야 다음 코드를 실행하는 방식, 일반적인 프로그래밍 세계에서는 코드는 모두 동기적으로 실행된다. 즉, 앞선 코드가 끝나야만 그 다음 코드가 수행이 된다.실행중인 코드의 완료 여부와 무관하게 즉시 다음 코드로 넘어가는 방식setTimeout, a

자바스크립트의 컴파일러는 토큰화(Tokenizing)와 렉싱(Lexing)을 처음에 하는데 이는 코드를 토큰 단위로 분리하여 의미를 매핑시키는 단계이다.Lex-time이란 토큰에 의미를 부여하는 렉싱 과정을 말하며, 이 때 자바스크립트의 스코핑 개념인 렉시컬 스코프가

이미 TIL로 정리한 내용이지만 과제 제출용으로 한 번 더 정리하는 Virtual DOM, props, state이다.\-DOM ( The Document Object Model, 문서 객체 모델)은 HTML, XML(Extensible Markup Language)

\-동일한 데이터는 항상 같은 곳에서 가지고 온다.\-즉, 스토어라는 하나뿐인 데이터 공간이 있다는 의미이다.\-리액트에서는 setState 메서드를 활용해야만 상태 변경이 가능하다.\-리덕스에서도 액션이라는 객체를 통해서만 상태를 변경할 수 있다.\-변경은 순수함수로

오늘 공부한 부분 정리\-일반적인 방법: 배치성으로 처리 (배치 업데이트 = React에서 렌더링을 위해 state를 파악)\-함수형 업데이트: 명령들을 모아서 순차적으로 한 번씩 시행렌더링이 잦다 => 성능 이슈 => React에서는 명령들을 모아 한 번에 처리하는

시멘틱 태그는 div 태그의 기능과 마찬가지로 block element이면서 사이트의 구조(레이아웃)을 설계하기 위한 태그이다.HTML의 구조를 설계하는 데 있어 태그에 의미를 부여함으로써 사이트의 구조를 파악하기 용이할 수 있도록 도와주기 위해 만들어졌다.SEO 최적