프로젝트 의 React 스킬 트리

대화형 React 컴포넌트 구축

초급

이 프로젝트에서는 React 를 사용하여 간단한 표시/숨기기 기능을 만드는 방법을 배우게 됩니다. 페이지에서 이미지의 가시성을 토글하는 버튼을 구현하게 됩니다.

reactjavascriptweb-development

💡 이 튜토리얼은 영어로 번역되었습니다. 원본을 보려면 영어로 전환

소개

이 프로젝트에서는 React 를 사용하여 간단한 show/hide 기능을 만드는 방법을 배우게 됩니다. 페이지에서 이미지의 가시성을 토글하는 버튼을 구현할 것입니다.

👀 미리보기

project preview

🎯 과제

이 프로젝트에서 다음을 배우게 됩니다:

  • HTML, CSS 및 JavaScript 파일을 사용하여 React 프로젝트를 설정하는 방법
  • useState 훅을 사용하여 애플리케이션의 상태를 관리하는 방법
  • 상태에 따라 컴포넌트를 조건부로 렌더링하는 방법
  • CSS 를 사용하여 컴포넌트의 스타일을 지정하는 방법

🏆 성과

이 프로젝트를 완료하면 다음을 수행할 수 있습니다:

  • 기본적인 React 애플리케이션을 생성할 수 있습니다.
  • 요소의 가시성을 제어하기 위해 상태 관리를 구현할 수 있습니다.
  • React 프로젝트에서 HTML, CSS 및 JavaScript 를 통합할 수 있습니다.
  • React 를 사용하여 대화형 사용자 인터페이스를 구축하는 기본 사항을 이해할 수 있습니다.

강사

labby
Labby
Labby is the LabEx teacher.