한입크기로잘라먹는리액트 [Udemy] React 기본 - 일기장 만들기(2) src/App.js src/DiaryEditor.js ☑️ 사용자 입력을 받는 form (input, textarea) 요소에 특정 길이 이상의 입력이 제대로 들어왔는지 확인하는 코드 작성 ☑️ const handleSubmit : 일기 저장하기 버튼을 눌렀을 때 수행되는 함수를 수정 ☑️ 작성자란(input)에 1글자 미만, 일기본문(textarea)가 5글자 미만일 경우 조건 추가 (al... useRefproject유데미udemy한입크기로잘라먹는리액트DOM리액트DOM [Udemy] React 기본 - 일기장 만들기(1) ☑️ DiaryEditor : 일기장 컴포넌트 ☑️ useState : 요소를 리액트가 직접 핸들링할 수 있도록 만들어야 함 ☑️ 상태변화 함수 : input과 textarea가 받는 value prop으로 전달 값이 실시간으로 바뀌도록 이벤트 설정(콜백함수 등록하여 event 객체인 e를 매개변수로 전달받게 됨) 사용자가 입력을 하면 어떤 사건이 발생했다고 인식하는데 onChange는 값이... onchangeStateprojectuseState유데미udemy한입크기로잘라먹는리액트리액트State [Udemy] React - CRA, JSX, State, Props ☑️ node_modules : 많은 모듈 패키지 설치, node_modules가 없거나 지워져도 package.json이나 package-lock.json 또는 npm i로 다시 설치할 수 있음. ☑️ 컴포넌트 방식 : JSX 문법을 사용해서 웹에 필요한 요소를 함수에 담아서 리턴 후 내보내서 index.js같은 다른 파일에서도 사용할 수 있게 함 ☑️ ESModule System : Co... JSXState유데미udemy한입크기로잘라먹는리액트ReactPropsCRA리액트CRA 한 입 크기로 잘라먹는 React - Day 6 리액트는 컴포넌트 기반의 UI 라이브러리이기 때문에 중복 코드를 수정해야 할 때 중복된 코드가 많다면 수정해야 할 게 많아짐 ‘컴포넌트화' 방식을 사용해서 수정 시 공수를 줄일 수 있음 리액트는 선언형 프로그래밍이기 때문에 jQuery: 명령형 프로그래밍 (절차를 하나하나 다 나열해야 함) 선언형 프로그래밍: 목적을 바로 얘기함 발생되는 변화를 가상의 DOM에 미리 업데이트를 시킨 다음에..... 한입크기로잘라먹는리액트리액트공부리액트공부 한 입 크기로 잘라먹는 React - Day 7 🗓 진행일: 2022.04.16 MyHeader, MyFooter js 파일 만들어서 App.js에서 불러오기 MyHeader.js App.js React에서 지켜야 하는 몇 가지 규칙 닫힘 규칙: 여는 태그가 있다면 반드시 닫는 태그도 존재해야 한다 (그래서 Image, br 같은 태그는 열자마자 닫아줘야 한다 → 셀프 클로징 태그) 최상위 태그 규칙: return 하는 컴포넌트는 반드시 ... 한입크기로잘라먹는리액트리액트공부리액트공부 [JavaScript for React] 응용1 복습 (Udemy) 💬 함수,객체,배열 응용하여 다루기연습 💬 이 강의 나만 보기 아깝다(널리널리 알려지기를..) 입문자레벨 눈높이에 맞춰 이해하기 쉽게 설명해준다 강의력 👍 자바스크립트에 막막했는데 내가 💩멍청이는 아니구나를 알게해준 강의….. 강사가 OKKY에서 한 리액트 세미나도 어제 추가로 들어봤는데 나중에 리액트 포스팅때도 올릴 생각 📌 Truthy & Falsy ✔️ 핵심 Point Truthy 참 ... udemy유데미한입크기로잘라먹는리액트자바스크립트udemy [JavaScript for React] 기본 복습 (Udemy) 원시타입/비원시타입, 콜백함수, 호이스팅, 함수선언식/표현식, 객체, 배열 등등 헥갈린 기본 개념들을 쉽게 이해할 수 있었다. (특히 지난 자바스크립트 퀴즈를 풀 수 있었던 것도 이 강의를 돌려보고 MDN 등 활용했기에.) 📌 변수와 상수 변하지 않는 것, 선언 이후에 값을 바꿀 수 없다 📌 자료형과 형 변환 ✔️ 원시타입/비원시타입 Point 한번에 하나의 값만 가질 수 있음 비원시타입 (... udemy유데미한입크기로잘라먹는리액트자바스크립트udemy 한 입 크기로 잘라먹는 React - Day 2 🗓 진행일: 2022.04.06(수) 함수 표현식 함수를 값(변수)에 담을 때는 이름을 굳이 지정해주지 않아도 된다 (무명함수) 화살표 함수 함수 표현식, 화살표 함수는 호이스팅의 대상이 아님 → 선언한 다음에야 사용할 수 있음 함수를 매개변수로 보내줘서 걔를 call 할 수 있도록 했음 (= 함수 표현식) 함수명만 보내줘서 실행은 하지 않고, 이름만 보내면 거기서 실행... Non-Prim... 한입크기로잘라먹는리액트리액트공부리액트공부 한 입 크기로 잘라먹는 React - Day 3 🗓 진행일: 2022.04.07 (새벽) 자바스크립트의 조건식에는 boolean형을 넣지 않아도 참 또는 거짓으로 인식을 하는 기능이 있다. Truthy (참 같은 값): 빈 배열 [], 객체 리터럴 {}, 숫자, 문자열 “0”, 문자열 “false”, Infinity Falsy (거짓 같은 값): null, undefined, 숫자 0, -0, NaN, “” (빈 문자열) 이걸 어따 쓰냐면... 한입크기로잘라먹는리액트리액트공부리액트공부
[Udemy] React 기본 - 일기장 만들기(2) src/App.js src/DiaryEditor.js ☑️ 사용자 입력을 받는 form (input, textarea) 요소에 특정 길이 이상의 입력이 제대로 들어왔는지 확인하는 코드 작성 ☑️ const handleSubmit : 일기 저장하기 버튼을 눌렀을 때 수행되는 함수를 수정 ☑️ 작성자란(input)에 1글자 미만, 일기본문(textarea)가 5글자 미만일 경우 조건 추가 (al... useRefproject유데미udemy한입크기로잘라먹는리액트DOM리액트DOM [Udemy] React 기본 - 일기장 만들기(1) ☑️ DiaryEditor : 일기장 컴포넌트 ☑️ useState : 요소를 리액트가 직접 핸들링할 수 있도록 만들어야 함 ☑️ 상태변화 함수 : input과 textarea가 받는 value prop으로 전달 값이 실시간으로 바뀌도록 이벤트 설정(콜백함수 등록하여 event 객체인 e를 매개변수로 전달받게 됨) 사용자가 입력을 하면 어떤 사건이 발생했다고 인식하는데 onChange는 값이... onchangeStateprojectuseState유데미udemy한입크기로잘라먹는리액트리액트State [Udemy] React - CRA, JSX, State, Props ☑️ node_modules : 많은 모듈 패키지 설치, node_modules가 없거나 지워져도 package.json이나 package-lock.json 또는 npm i로 다시 설치할 수 있음. ☑️ 컴포넌트 방식 : JSX 문법을 사용해서 웹에 필요한 요소를 함수에 담아서 리턴 후 내보내서 index.js같은 다른 파일에서도 사용할 수 있게 함 ☑️ ESModule System : Co... JSXState유데미udemy한입크기로잘라먹는리액트ReactPropsCRA리액트CRA 한 입 크기로 잘라먹는 React - Day 6 리액트는 컴포넌트 기반의 UI 라이브러리이기 때문에 중복 코드를 수정해야 할 때 중복된 코드가 많다면 수정해야 할 게 많아짐 ‘컴포넌트화' 방식을 사용해서 수정 시 공수를 줄일 수 있음 리액트는 선언형 프로그래밍이기 때문에 jQuery: 명령형 프로그래밍 (절차를 하나하나 다 나열해야 함) 선언형 프로그래밍: 목적을 바로 얘기함 발생되는 변화를 가상의 DOM에 미리 업데이트를 시킨 다음에..... 한입크기로잘라먹는리액트리액트공부리액트공부 한 입 크기로 잘라먹는 React - Day 7 🗓 진행일: 2022.04.16 MyHeader, MyFooter js 파일 만들어서 App.js에서 불러오기 MyHeader.js App.js React에서 지켜야 하는 몇 가지 규칙 닫힘 규칙: 여는 태그가 있다면 반드시 닫는 태그도 존재해야 한다 (그래서 Image, br 같은 태그는 열자마자 닫아줘야 한다 → 셀프 클로징 태그) 최상위 태그 규칙: return 하는 컴포넌트는 반드시 ... 한입크기로잘라먹는리액트리액트공부리액트공부 [JavaScript for React] 응용1 복습 (Udemy) 💬 함수,객체,배열 응용하여 다루기연습 💬 이 강의 나만 보기 아깝다(널리널리 알려지기를..) 입문자레벨 눈높이에 맞춰 이해하기 쉽게 설명해준다 강의력 👍 자바스크립트에 막막했는데 내가 💩멍청이는 아니구나를 알게해준 강의….. 강사가 OKKY에서 한 리액트 세미나도 어제 추가로 들어봤는데 나중에 리액트 포스팅때도 올릴 생각 📌 Truthy & Falsy ✔️ 핵심 Point Truthy 참 ... udemy유데미한입크기로잘라먹는리액트자바스크립트udemy [JavaScript for React] 기본 복습 (Udemy) 원시타입/비원시타입, 콜백함수, 호이스팅, 함수선언식/표현식, 객체, 배열 등등 헥갈린 기본 개념들을 쉽게 이해할 수 있었다. (특히 지난 자바스크립트 퀴즈를 풀 수 있었던 것도 이 강의를 돌려보고 MDN 등 활용했기에.) 📌 변수와 상수 변하지 않는 것, 선언 이후에 값을 바꿀 수 없다 📌 자료형과 형 변환 ✔️ 원시타입/비원시타입 Point 한번에 하나의 값만 가질 수 있음 비원시타입 (... udemy유데미한입크기로잘라먹는리액트자바스크립트udemy 한 입 크기로 잘라먹는 React - Day 2 🗓 진행일: 2022.04.06(수) 함수 표현식 함수를 값(변수)에 담을 때는 이름을 굳이 지정해주지 않아도 된다 (무명함수) 화살표 함수 함수 표현식, 화살표 함수는 호이스팅의 대상이 아님 → 선언한 다음에야 사용할 수 있음 함수를 매개변수로 보내줘서 걔를 call 할 수 있도록 했음 (= 함수 표현식) 함수명만 보내줘서 실행은 하지 않고, 이름만 보내면 거기서 실행... Non-Prim... 한입크기로잘라먹는리액트리액트공부리액트공부 한 입 크기로 잘라먹는 React - Day 3 🗓 진행일: 2022.04.07 (새벽) 자바스크립트의 조건식에는 boolean형을 넣지 않아도 참 또는 거짓으로 인식을 하는 기능이 있다. Truthy (참 같은 값): 빈 배열 [], 객체 리터럴 {}, 숫자, 문자열 “0”, 문자열 “false”, Infinity Falsy (거짓 같은 값): null, undefined, 숫자 0, -0, NaN, “” (빈 문자열) 이걸 어따 쓰냐면... 한입크기로잘라먹는리액트리액트공부리액트공부