리액트를 다루는 기술

바닐라 js를 이용한 to-do list web을 만드는 토이프로젝트를 끝냈으니 이제 리액트를 공부해봅시다! 앞으로 '리액트를 다루는 기술'이라는 책을 읽으며 실습과 함께 이론적인 부분을 다뤄보아요 : ) js 만을 이용해도 규모가 큰 애플리케이션을 만들 수 있음. 그

오늘은 JSX를 배우고 활용해보자! ✍ exampleimport 구문은 다른 파일을 불러와 사용할 때 활용됨. 브라우저에서 모듈을 불러와 사용하기 위해 번들러(bundler) 를 사용. 대표적인 번들러로는 웹팩, Parcel 등이 있으며 리엑트 프로젝트에서는 주로 웹

오늘은 컴포넌트에 대해서 배워보자 !! 📖 컴포넌트 > 컴포넌트의 기능은 단순한 템플릿 이상이다. 데이터가 주어졌을 때 이에 맞춰 UI를 만들어주고, 라이프사이클 API를 이용하여 컴포넌트가 화면에서 변화가 일어날 때 주어진 작업들을 처리할 수 있으며, 임의 메서

📖 이벤트 핸들링 > 사용자가 웹 브라우저에서 DOM 요소들과 상호 작용하는 것을 이벤트라고 한다. 4.1. 리액트의 이벤트 시스템 리액트의 이벤트 시스템은 웹 브라우저의 HTML 이벤트와 인터페이스가 동일하다. 4.1.1. 이벤트를 사용할 때 주의사항 이벤트 이

오늘은 ref에 대해서 공부해봅시다!HTML에서 id를 사용하여 DOM에 이름을 다는 것 처럼 리액트 프로젝트 내부에서 DOM에 이름을 다는 방법이 있다. 바로 ref(reference의 줄임말) 개념이다. ❓ 리액트 컴포넌트 안에서 id는 사용하면 안되나?\-id를

오늘은 지금까지 배운 지식을 활용하여 일정 관리 애플리케이션을 만들어보겠습니다! ✍ example프로젝트에서 Sass를 사용할 것이므로 sass 설치 classnames는 조건부 스타일링을 더 편하게 하기 위해 설치 ✍ example배경 회색으로 설정✔ 결과 확인앞으