Today I Learned

협업: 수도코드 먼저 작성 'how to' 이 단어로 구글 검색을 시작하세요. Good question ex) "array의 reduce 메서드 사용 시 accumulator 인자의 작동이 이해되지 않습니다."

변수 Intro변수 기초, 변수 실습타입함수 Intro함수 기초, 함수 실습

원활한 커뮤니케이션을 위해서는 기본적인 이름을 알아야 상대방이 이해할 수 있다는 것을 알 수 있었다. 아래의 링크는 이름을 보기 좋게 정리했다. https://velog.io/@inyong_pang/Programming-%ED%8A%B9%EC%88%98-%EB

HTML 배움 목표 HTML을 CSS를 적용하고, JavaScript로 개발할 수 있게(Programmable) 작성할 수 있다.HTML이 Markup language라는 것을 이해할 수 있다."구조를 표현하는 언어" 라는 의미를 자신의 언어로 표현할 수 있다.HTML

id는 문서 내에 단 하나의 요소에만 적용할 수 있는 유일한 이름이어야 합니다.id가 있는 요소를 선택할 때에는 #기호를 이용합니다.

원시형(Primitive) vs 참조형(Reference) 자료형 원시형: 참조형: function , array, object

spread 와 restDom이벤트객체 고차함수 React

rouguter: 와이파이 공유기처럼 연결해줌

React의 규칙 태그는 꼭 닫혀있어야 합니다.두개 이상의 태그는 무조건 하나의 태그로 감싸져있어야 합니다. (\*div로 감싸기 애매할땐 Fragment 로 감싸라! )Javascript의 변수는 {}로 감싸라 Class -> className 바꿔서 써라JSX에 s

논리연산자!: NOT&&: AND : false 찾기둘 다 true 일때만 결과물이 true둘 중 하나가 false 이면 return false ||: OR : true 찾기 양쪽의 값 중 하나라도 true 라면 결과물이 true두 값이 둘 다 false 일 때에만 f

같은 객체 생성자 함수를 사용하는 경우, 특정 함수 또는 값을 재사용 할 수 있는데 바로 프로토타입입니다.

ES6 에서 도입된 spread 와 restspread는 펼치다 라는 의미로 배열과 객체를 ...변수이름 으로 사용가능

비동기처리(Asynchronous) <-> 동기적 처리 (synchoronous)비동기 처리 하는 이유? 어떤 작업이 끝나고 그 다음 작업을 기다리지 않고 동시에 작업을 처리하기 위해서 '비동기 처리'

Block vs Inline 차이

a 태그 (achor) 다른 URL로 링크를 걸 수 있다. a href= "링크 URL" -> 최신 html5 에서는 생략가능하다.target 링크 URL의 표시(브라우저 탭) 위치: target="\_self" ->현재창에 띄움(디폴트값)target="\_blank

**input 태그**

hover태그:hover{}마우스 커서를 대면 작동하는 태그

float , flex

grid

flex vs grid

이러다 CSS 장인이 될 것 같아.... ~.~

source tree GUI 로 작동할때 한눈에 볼 수 있는 프로그램

GitHub 클론 코딩을 하면서 느낀점 반응형 웹페이지를 만드는 것이 많은 디테일이 필요하다.내가 알아야할 CSS 선택자들이 수도 없이 많았다.media선택자를 이용해서 웹사이트의 크기를 다르게 만드는 법을 더 공부해야겠다.내가 생각해보지 못한 빈공간의 위치를 놓는 것

primitive typepremitive type 을 알아볼때는 ''-> 문자열안으로 넣으면 안된다!

배열과 객체의 구조를 이해하고 언제, 어떻게 사용하는 지 이해할 수 있다.배열과 객체의 특징을 구분하여 사용할 수 있다. (순서를 가진다, 의미를 가진다)배열과 객체의 특징에 따라 실생활에서 언제 쓰는지 이해할 수 있다.객체 속성(property)의 추가, 조회, 변경

css유용 웹사이트 및 css 레이아웃배치

css grid와 flex에 도움이 되는 게임, position, flex

스코프의 의미와 적용 범위를 이해할 수 있다스코프의 주요 규칙을 이해할 수 있다중첩 규칙 block scope와 function scope전역 스코프와 지역 스코프전역 변수와 지역 변수간의 우선 순위let, const, var 의 차이전역 객체(window)의 이해클로

React 에서 DOM 을 접근할 수 있다? (O/X)접근 할 수 있다. useRef()를 사용하자!

Css배경 도형만든것: border-radius:100% 0;애니메이션 : animation삼각형: border-top:Border-bottom: Transparent->투명하게 반응형 웹페이이지 @Media screen ->css에 쓰면 된다. 애니매이션해당 에니매

고차함수: 함수를 리턴하는 함수 함수를 인자로 받을 수 있는 함수 callback 함수:인자로 받아지는(들어가는,불려지는) 함수

state, props의 개념에

prototype을 사용 하는 이유?다른 언어와 달리 자바스크립트는 class에 포함되어있는 상속의 기능이 없다.공통적으로 사용하는 함수를 받아서 쓸 수 있다. 그래서 prototype을 통해서 원래 원형을 복사해서 상속 할 수 있다.(최근 문법은 class가 추가되었

콜백함수:callback 다른함수에서 함수를 호출해서 인.자에 전달된다 \->호출되서 돌아오는 함수

자바스크립트의 핵심은 asyn & 이다 비동기커피주문을 예시로 들 수 있다.a라는 직원은 cashierb는 barista 서로 분업해서 할 수 있다. 동기적 사장님 혼자서 주문하는경우사장님이 한사람의 주문을 받고 커피를 만들고 커피를 서빙하고, 그 다음 사람이 주문을

알고리즘 :홀수 중에서 최솟값 구하기 & 홀수의 합 구하기

알고리즘: 세변의 길이로 삼각형이 완성되는가?

컴포넌트 기반 개발컴포넌트? 코드를 묶어놓은 덩어리 ex) class, function\-> 이 코드가 어떤 역할을 하는지 쉽게 확인하기 위해서 useRef 를 사용하는 이유?React는 DOM에 직접 접근하지마라.하지만, DOM에 접근해야하는 경우가 있다.ex)애니매

forEach 문첫번째 값은 배열의 요소가 나온다.두번째 파라미터는 인덱스가 나온다.forEach 다음에는 무조건 함수를 써야한다.

클로저란?함수와 lexical 환경의 조합함수가 생성될 당시의 외부 변수를 기억생성 이후에도 계속 접근 가능

리액트를 쓰는이유? 데이터 바인딩이 쉬움 : {}로 변수명,함수형 데이터 집어 넣을 수 있음이미지는 import 로 이미지 넣고, src={} 가로 안에 집어 넣는다. \-style 은 style={{key:value}} obj 형식으로 넣으면 가능하다. 리액트 데이터

New를 붙이면 return문을 따로 넣지않아도 실행이 된다.즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression)이라고 하며, 함수를 정의함과 동시에 실행한다.function 키워드와 Arrow function의 차이