🥹

아좌잣 홧팅이닷!

토독토독..💻
반응형

react 24

[React Project: 간단한 일기장(9)] 로직 분리하기 -useReducer

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(8)] 최적화3 - useCallback 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 간단한 일기장 만들기는 최적화도 했으니 모두 완료가 되었다!..

[React Project: 간단한 일기장(8)] 최적화3 - useCallback

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(7)] 최적화2 - React.memo 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 앞서 다룬 useMemo와 React.memo를 통해서 지금까..

[React Project: 간단한 일기장(7)] 최적화2 - React.memo

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(6)] 최적화1 - useMemo 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 앞서서 우리는 함수의 연산결과를 재사용해 최적화를 해 보았다 오늘은..

[React Project: 간단한 일기장(6)] 최적화1 - useMemo

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(5)] 배열사용해서 데이터 조작하기3- 데이터 삭제및 수정 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 지금까지의 코드 ↓ 더보기 App.js i..

[React] 리액트 useEffect? feat. Lifecycle (+예제코드)

Lifecycle? useEffect를 알아보기 전 알아야 할 개념이다 말 그대로 생애주기, 탄생부터 죽음에 이르기까지를 뜻한다 리액트에서도 이 생애주기가 있다 이 생애주기를 함수형으로 다루기 위해 우리는 React hook 기능 중 하나은 useEffect를 사용한다 software를 견고하고 좀 더 효율적으로 개발하기 위해서 자신이 만든 기술의 lifecycle를 잘 이해하고 있어야 한다 useEffect의 구조이다 사용법은 mount, update, unmout 시 각각 다르다 Mount useEffect(()=>{ console.log("Mount!"); },[]); mount 시에는 defendency array를 빈배열로 주면 mount 시 실행이 된다 Update useEffect(()=>{..

[React Project: 간단한 일기장(5)] 배열사용해서 데이터 조작하기3- 데이터 삭제및 수정

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(4)] 배열사용해서 데이터 조작하기2- 데이터 추가 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 리스트 렌더링(조회) 데이터 추가 데이터 삭제 데..

[React Project: 간단한 일기장(4)] 배열사용해서 데이터 조작하기2- 데이터 추가

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(3)] 배열사용해서 데이터 조작하기1- 리스트 렌더링 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 리스트 렌더링(조회) 데이터 추가 데이터 삭제 ..

[React Project: 간단한 일기장(3)] 배열사용해서 데이터 조작하기1- 리스트 렌더링

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(2)] DOM 조작하기 - useRef 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 배열을 사용해서 데이터를 조작해볼 것이다 목차는 아래와 같다 ..

[React Project: 간단한 일기장(2)] DOM 조작하기 - useRef

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com [React Project: 간단한 일기장(1)] React 사용자 입력 처리 (+ useState 활용) 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응 su-vin25.tistory.com 이어서... 전 포스팅에서 이어서 시작한다. 마지..

[React Project: 간단한 일기장(1)] React 사용자 입력 처리 (+ useState 활용)

한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com 완성본 간단한 일기장 만들기를 해볼 것이다 UI는 간단하다 1. 작성자를 입력받을 input 2. 일기 본문을 입력받을 textarea 3. 감정점수를 매길 select 바로 만들어보자 우선 일기를 관리할 DiaryEditor 컴포넌트를 하나 만들어 줄 것이다 DiaryEditor 컴포넌트 깡통 하나 만들어주고 루트 컴포넌트에 자식 컴포넌트로 추가해준다 1.input 만들기 작성자를 입력할 i..

반응형