React

What Is React?

React (also known as ReactJS or React.js) is an open-source declarative, efficient and flexible JavaScript library for building user interfaces. React was developed by Facebook and first deployed in the Facebook news feed in 2011.

React.js lets you compose complex UIs from small, isolated and resuable pieces of code called "components". In terms of websites and web applications, UIs are the collection of on-screen menus, search bars, buttons, and anything else someone interacts with to use a website or app.

Why React?

In addition to providing reusable React library code (saving development time and cutting down on the chance for coding errors), React comes with two key features that add to its appeal for JavaScript developers:

JSX
Virtual DOM

JSX

JSX (short for JavaScript eXtension) is a React extension that makes it easy for web developers to modify their DOM by using simple, HTML-style code. And—since React JS browser support extends to all modern web browsers—JSX is compatible with any browser platform you might be working with.

Virtual DOM

React.js creates a Virtual DOM which is the copy of site's DOM. React uses this copy to see what parts of the actual DOM is changed when an event happens (like a user clicking a button) and selectively updates the DOM only.

Companies Using React

React Is Awesome

Getting Started

React Fundamentals Workshop

This workshop was held on Thursday Oct 28th, 2021 by UTM GDSC and CSSC! In it, you'll learn about all the fundamentals of React and go step by step to building a full stack react application.

Github Repo

Zoom Recording, PWD: reactworkshop$1

Introduction to Reactjs

Reactjs In-Depth Course

Roadmap

Cheat Sheet

Cheat sheets save you time and energy by giving you essential syntax at your fingertips.

Essential Syntax

VS Code Extensions

glean

ES7 React/Redux/React-Native Snippets

Useful Resources

Awesome Resources From the React Ecosystem

React Router

Using Google Maps in React

Official Documentation

Official GitHub

Further Steps

We at the CSSC believe in learning by doing. So here are some ideas for a few projects that you can work on to hone your skills.