분류 Reactjs

모든 초보자가 시도해야 하는 5 가지 React 기반 프로젝트

컨텐츠 정보

  • 조회 335 (작성일 )

본문

소개 


React는 커뮤니티에서 사용 가능한 인기 있는 JavaScript 프레임 워크 중 하나입니다. React는 매우 강력하며 react를 사용하여 다양한 웹앱을 개발할 수 있습니다. 그래서 오늘은 리액트 프레임 워크를 사용하여 만들 수 있는 5 개의 프로젝트를 나열하겠습니다.


https://dev.to/dailydotdev/5-react-based-projects-every-beginner-must-try-571o


1. COVID-19 Info App 


Alt Text 


COVID-19의 현재 정보와 통계를 보여주는 웹 페이지를 만들 수 있습니다. API를 사용하여 COVID-19에 대한 데이터를 가져올 수 있습니다. 페이지에 원하는 정보를 표시 할 수 있습니다. disease.sh에서 API를 사용하여 데이터를 가져올 수 있습니다.


무엇을 배우게 될까요? 

  • API Management
  • Props
  • State Management
  • Flexbox For Containers

2. Weather App 

Alt Text 


날씨를 알기 위해 우리 자신의 날씨를 만들 수 있습니다. 다른 도시를 검색하는 입력 상자도 가질 수 있습니다. 입력 상자를 만들어 도시 이름을 가져오고 웹 페이지에 날씨 정보를 표시 할 수 있습니다. OpenWeather는 날씨 정보를 제공하는 내가 가장 좋아하는 API 중 하나입니다. API는 아이콘 코드와 함께 제공됩니다. 이 코드를 사용하여 날씨에 따라 아이콘을 표시 할 수 있습니다.


무엇을 배우게 될까요? 

  • API Management
  • Props
  • State Management
  • Reusable Component

3. Recipe App 

Alt Text 


네, 맛있는 음식을 요리하고 싶은 여러분과 다른 사람들을 돕는 레시피 앱 이 앱에서는 검색된 입력에 따라 음식 레시피를 표시 할 수 있습니다. 몇 가지 주요 레시피도 표시 할 수 있습니다. Edamam은 레시피 앱용 API를 제공합니다. 사용 가능한 최고의 레시피 API 중 하나입니다.


무엇을 배우게 될까요? 

  • API Management
  • Props
  • State Management
  • Reusable Component

4. Calculator App 

Alt Text 


react를 사용하여 기초부터 고급 공학용 계산기까지 개발할 수 있습니다. 계산기를 설계하면 언어를 이해하는 데 도움이 될 수 있습니다. 또한 수학 지식도 테스트합니다. 그러나 계산기를 설계하고 필요에 따라 기능을 제공하는 것은 매우 재미 있습니다.


무엇을 배우게 될까요? 

  • Props
  • State Management
  • Reusable Component

5. Todo App 


Alt Text 


입력 상자가 있는 할일 앱을 만들어 새 할일 항목을 목록에 추가 할 수 있습니다. 할일 앱에 새 작업을 입력하기 위한 입력 상자를 가질 수 있습니다. 해당 정보를 저장할 데이터베이스를 가질 수 있습니다. Firebase를 사용하여 데이터를 저장하고 실시간 업데이트를 받을 수 있습니다. 완료되거나 완료되지 않은 작업에 대한 애니메이션을 가질 수 있습니다. 완료된 작업에 따라 사용자에게 포인트를 줄 수도 있습니다.


무엇을 배우게 될까요? 

  • Firebase Database Management
  • Props
  • State Management
  • Reusable Component
  • Realtime Database Update