React Study JAM

React Study JAM Slides and workshop materials

React Ecosystem Presentation

Overview

• What is React?

  • JS UI Library, Components based, Refreshing when data change.
  • Used by: Facebook, Instagram, Netflix, New York Times, Khan Academy,...

• Main Concepts

  • JSX
  • State
  • Props

UI/Components Libraries

• Why UI Library?

  • Fast.
  • Reliable.

• Library selection strategy

  • Popularity on Github: Stars, Forks and Teams size.
  • Repo Activity.
  • Downloads on npm.

• Main Libraries

  • Material UI: 45,422 stars, 1,174 contributors, 182,719 npm weekly downloads.
  • Ant Design: 44.077 stars, 786 contributors, 284,468 npm weekly downloads.

React Native

• Build cross platform mobile apps

  • Render using native UI components.
  • Native Apis bridge.
  • Powered by React and JS.

• Requirements to start React Native Projet.

  • Install the Platform SDK.
  • Intall the platform Emulator.
  • Set the configuration files.

Backend Options

• Firebase.

• Rest Api.

• Mern Stack.

State Management

• What is State Management?

• Main Solutions: "Redux", "Context API",...

API Clients

• Fetch Api.

• Axios.

Testing and Debugging

• React Developer Tools.

• Testing Library: "Jest".

Deployment

• Github + Netlify.

• Heroku.

Resources and Docs

• Official docs website.

• Best Youtube Channels for React.

• Linkedin Learning.

References

• Sites using react.