https://github.com/serbanghita/learn-react

Learn React.js with TypeScript in a step-by-step tutorial.
https://github.com/serbanghita/learn-react

react reactjs typescript

Last synced: about 2 months ago
JSON representation

Learn React.js with TypeScript in a step-by-step tutorial.

• Host: GitHub
• URL: https://github.com/serbanghita/learn-react
• Owner: serbanghita
• Created: 2018-03-26T10:18:47.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2022-09-19T20:20:08.000Z (about 3 years ago)
• Last Synced: 2025-04-11T04:35:39.906Z (6 months ago)
• Topics: react, reactjs, typescript
• Homepage:
• Size: 1.34 MB
• Stars: 4
• Watchers: 3
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Learn React

> Learn React.js with TypeScript

**Chapters**

1. [Starter](../../tree/starter)

   > Learn how to start a React.js project from scratch. No boilerplate involved.

1. [Saving local state](../../tree/saving-local-state)

   > Learn how to save the state internally.

1. [Handling events](../../tree/handling-events)

   > Learn how to handle events.

1. [Conditional rendering](../../tree/conditional-rendering)

   > Learn how to handle conditional rendering of view elements.

1. [Decorators](../../tree/decorators)

   > Learn how to use decorators.

   > We create a `bind` method decorator.

1. [Lists](../../tree/lists)

   > Learn how to deal with lists of view elements.

1. [Lifting local state](../../tree/lifting-local-state)

   > Learn how to lift local state as a "source of truth". \

   > We build a simple currency converter.

1. [Thinking in React](../../tree/thinking-in-react)

   > Learn how to think the React way of building your app. \

   > We build a recursive tree menu with a search attached.

1. [Prototyping in React](../../tree/prototyping-in-react)

   > Learn how to prototype a webapp in React using fake storage data. \

   > Apply all the principles learned in the previous chapters. \

   > Hit the limitation of not using a router.

1. [Using routes](../../tree/using-routes)

   > Decouple component logic into separate files. \

   > Use `react-router` to create routes and links. \

   > Facilitate prototyping and navigation between pages.

1. Using async data

   > Make your prototype use data coming from an XHR request. \

   > Hit the limitations of the prototype.

1. Using Flux

   > Use Flux pattern to manage data flow in your application.

1. Testing

   > Testing your components with Enzyme. \

   > Testing your app with Jest. \

   > Testing with E2E tests from a user's POV.

1. Optimization

   > Common optimization techniques and checks.