안랩샘아카데미React로시작하는프론트엔드

안랩샘아카데미 React로 시작하는 프론트엔드 수업 1주차 정리 웹개발의 기본 HTML: 웹 문서의 뼈대 CSS: 웹 문서의 꾸밈 JavaScript: 사용자 동작에 반응,웹브라우저에서 사용,작동하는 프로그래밍언어로 기존의 웹페이지보다 많은 기능을 구현할 수 있다.

switch 조건문\-특정 값의 조건을 비교할 때 사용한다. 조건비교해서 해당하는 조건으로 바로 점프할 수 있다.break명령어로 조건이 만족되면 switch문을 탈출할 수 있고,default는 if문에서 else와 같이 사용할 수 있다.결과예측a의 값은 4로 case

콜백함수자신이 아닌 다른함수에 인수로써 전달된 함수function main(value) {value();}function sub() {console.log(“sub”);}main(sub);sub함수를 선언하지않고 화살표함수로 변경하기1부터 5까지 출력하기(두배,세배의

구조분해할당구조분해할당(비구조화할당) 문법은배열이나 객체에 저장된 여러 개의 값들을 분해해서 각각 다른 변수에 할당하고객체 안에 있는 값을 추출해서 변수 혹은 상수로 바로 선언할 수 있다.실습구조분해할당 - 함수파라미터함수의 파라미터에서도 비구조화 할당 가능Spread

es모듈시스템을 사용하기위해서 package.json 파일에 "type": "module" 추가해준다. 설정후 npm run start를 하면 모듈을 사용했기때문에 에러가 발생하고 require대신 import를 사용해야한다고나온다. math.js와 index.js

React App 구동 순서React App 생성 (npm create vite@latest .)npm 라이브러리 설치 (npm i)React App 가동 (npm run dev)React App 접속 ( 로컬호스트 주소로 접속)불필요한 파일 제거하고 환경설정파일 수정

React Counter App 초기화하는 0버튼 만들어주고 onClickButton 이벤트 변경해주기 리액트 컴포넌트 라이프 사이클 Mount-탄생, 페이지에 나타남 Update-업데이트, State업데이트,Props업데이트,부모컴포넌트 리렌더 Unmount-죽음,

todolistapp TodoItem.jsx input쪽에서 checked를 사용해서 발생하는 경고 를 없애기위해 onChange나 readOnly 속성을 줘야해서 임시로 readOnly 속성을 준다. TodoItem.jsx List.jsx에서 구분하는 key값이