오늘의 요약 = 부실공사는 무너지는 법이다.
1교시 : 뛰기전에 걷기부터 하자.
Component의 구 와 신
class
올드스쿨
function
최-신 기술
React 는 Component를 얼마나 잘만드냐는 것.
사용자 정의 태그.
component 재사용성이 많은 것을 태그로 만들어, 필요시 편하게 사용하기 위함.
전개 연산
객체를 가져올때 props로 가져올 수도 있지만, 전개연산 {}(중괄호)을 사용하여,
중괄호 안에 객체의 속성명을 전개한다.
배열 전개 연산
const [a,b,c] = [10,40,500];
객체의 전개 연산
const {a,b,c} = {a:apple,b:bear,c:carrot};
어려운 이유
리액트는 웹 어플리케이션을 만드는 것.
웹페이지도 못만드는데, 어플리케이션을 만들려하니.
걷지도 못하는데 어찌 뛰기를 바랄까.
불편함을 모르는데, 수업이 어찌 깊숙히 이해가 될까.
수업의 진도
현실상 수업의 진도를 나가야 하기에, 연습하는 것은 각자의 몫이다.
그러니 HTML로 구조를 잡아야하는 연습을 열심히 해야한다는 것.
구조 분석
알파이며,오메가다.
기초를 탄탄하게 다지자.
그림으로 시각화 연습
페이지의 구성요소를 색을 정해 그리면서 구조화 연습을 하자.
나눈 구성요소를 명명하는 것도 하자.
그룹화 하고 사이트를 보는 눈을 길러라.
많은 연습하자.
다양한 페이지를 직접 모방해보자
2 ~ 4 교시 : 리액트 구조 실습
얽힌 구조속에 머리속은 붕괴.
5교시 :
반복문이 함수와 만나면.
한가지의 일을 했던 반복문이 함수와 매개변수를 만나면 폭발적인 힘을 낸다.
이해가 될듯 말듯
알 것 같기도 아닌 것 같기도
6교시 : 많은 생각은 방해가 된다.
여러가지 생각이 있으면 프로그램 개발(단일 동작)을 어렵게 한다.
외부에서 데이터 받을것인가?
- 통으로 받을 것인가?
- props => function name (props){ 통을 분해하는 내용 들어감.}
- : props.속성명
- 낱개로 받을 것인가?(분해)
- function name ({}){}
만들어내는 결과물이 외부 데이터를 활용하는가?
- No
- 일반 데이터를 생성해야한다
- return 구문 이전에 일반적인 방법으로 데이터를 생성하면 된다.
- // 배열 요소가 100개인 배열 만들고, 요소값은 모두 0인 배열 만들기
- const arrName = new Array(100).fill(0);
- 상태를 생성해야 한다.
- import {상태관리의 종류}from 'react';
- : import{useState}from 'react';
- : const statevar = useState();
- : const
[상태 변수명, set상태변수명]
= stateVar;- 두줄 요약 const
[상태변수명,set상태변수명]
=useState(초기값); - 대문자 사용.
- 두줄 요약 const
- 상태 변수의 값이 변경되면 , 화면이 새롭게 구성된다.(바뀐다.)
Top-down VS bottom-up
- import {상태관리의 종류}from 'react';
- 일반 데이터를 생성해야한다
7교시 : 모험 VS 안정
state
변경 가능한 데이터 저장소. 반응이 필요한 곳에 사용되는 (reRendering)
UseStateApp함수는 배열로 반환을 한다. 배열안에는 2개의 요소가 있다.
get,set mehod
두뇌 지진
% 나머지 연산자 활용.
컴포넌트(요소) 함수 만들기
spa(SinglePageApplication) 3대장
- Angular
- React
- Vue
- svelte (따끈따끈)
- Rust
8교시 : 부족함을 알고, 반성을 한다.
반성
많은 연습을 해야, 문제에 많이 직면하고, 풀면서 상황자체에 익숙해진다.
익숙해지는것. 그것이 더 나아가고 있다는 것.
현재 나는 인풋만 하고 있다. 결과값을 내지 않고, 인풋만 하니,
밑빠진 독에 물 붓고, 모래위에 성을 짓는 것과 같다.
그렇게 지금 리액트까지 왔는데, 아직 구조도 제대로 설계도 못하는 상태이다.
많은 연습이 필요하다.
부실 공사는 언제든 무너지는 법이니까.
'공부 > 오늘 배운것' 카테고리의 다른 글
22.10.20.Thu - 방대한 DB의 세계 맛보다. (0) | 2022.10.20 |
---|---|
22.10.19.Wed - 도장깨기의 마음으로 (0) | 2022.10.19 |
22.10.17.Mon - 필요한 부품을 만들거나 끌어와 사용해서 멋진걸 만들자. (0) | 2022.10.17 |
22.10.14.Fri - 오류는 마법이다. 알고나면 허탈한 것이 (0) | 2022.10.14 |
22.10.13.Thu - 태산이 높다 하되 (0) | 2022.10.13 |