Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/softchris/react-book

Free book on React. Beginner to intermediate.
https://github.com/softchris/react-book

book free javascript programming react react-book reactjs webdevelopment

Last synced: about 1 month ago
JSON representation

Free book on React. Beginner to intermediate.

Awesome Lists containing this project

README

        

[![GitHub license](https://img.shields.io/github/license/softchris/react-book.svg)](https://github.com/softchris/react-book/blob/master/LICENSE)
[![GitHub contributors](https://img.shields.io/github/contributors/softchris/react-book.svg)](https://GitHub.com/softchris/react-book/graphs/contributors/)
[![GitHub issues](https://img.shields.io/github/issues/softchris/react-book.svg)](https://GitHub.com/softchris/react-book/issues/)
[![GitHub pull-requests](https://img.shields.io/github/issues-pr/softchris/react-book.svg)](https://GitHub.com/softchris/react-book/pull/)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)

[![GitHub forks](https://img.shields.io/github/forks/softchris/react-book.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/softchris/react-book/network/)
[![GitHub stars](https://img.shields.io/github/stars/softchris/react-book.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/softchris/react-book/stargazers/)
[![GitHub watchers](https://img.shields.io/github/watchers/softchris/react-book.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/softchris/react-book/watchers/)

# React Book, your beginner guide to React

This is a completely free book on React.js

Why did I write it? Knowledge deserves to be free. Note, things changes fast, and I would love to have your help keeping it up to date.

Hope the book helps you in your career.

## Need to brush up on Web Dev basics?

I know we sometimes have a tendency to learn a framework before we know the basics of a language. It's fine, no shame. But if you need to brush up on your Web Dev basics then this repo takes you from the very beginning to some decently advanced projects on HTML, CSS and JavaScript

I've co authored this repo on web fundamentals.

Check it out 👉 [Web dev for beginners](https://github.com/microsoft/Web-Dev-For-Beginners)

## Contact

I'm easiest to find on Twitter.

👉 [Chris Noring](https://twitter.com/chris_noring)

## Table of Contents

- [Contributions](#contributions)
- [Translations](#translations)
- [GitHub Pages](#github-pages)
- [Links](#links)

The book
- Basics
- [JSX](./1-basics/jsx.md)
- [Setup](./1-basics/setup.md)
- [First component](./1-basics/first-component.md)
- [Props](./1-basics/props.md)
- [State](./1-basics/state.md)
- [Methods](./1-basics/methods.md)
- [Thinking in Components](./1-basics/thinking-in-components.md)
- [Conditional](./1-basics/conditional.md)
- Styling
- [Styled components](./2-styling/styled-components.md)
- Images
- [Importing images](./3-images/images.md)
- Routing
- [Routing](./4-routing/routing.md)
- [Router and query parameters](./4-routing/params.md)
- [Programmatic navigation](./4-routing/programmatic-navigation.md)
- [Lazy loading](./4-routing/lazy-loading.md)
- Advanced
- [Context API](./5-advanced/context-api.md)
- [Hooks](./5-advanced/hooks.md)
- [render-props](./5-advanced/render-props.md)
- Testing
- [Jest](./6-testing/jest.md)
- [nock](./6-testing/nock.md)
- [react-testing-library](./6-testing/react-testing-library.md)
- Redux
- [Redux basics](./7-redux/redux.md)
- [Actions](./7-redux/actions.md)
- [Reducers](./7-redux/reducers.md)
- [Store](./7-redux/store.md)
- [Adding Redux to React](./7-redux/adding-redux-to-react.md)
- [Sagas, side effects](./7-redux/sagas.md)
- [Redux form](./7-redux/redux-form.md)
- Tools
- [Storybook](./8-tools/storybook.md)
- Forms
- [forms](./9-forms/forms.md)
- [Forms validation](./9-forms/forms-validation.md)
- [Formik part I](./9-forms/formik-partI.md)
- [Formik part II](./9-forms/formik-partII.md)

## Contributions

Contributions are very welcome. Please raise an issue of you see something or a PR.

I welcome contributions on:

- Suggestions on topics to cover
- Correctness issues
- Spelling
- Suggestions on better formatting

I hope I hear from you. :)

## Translations

This book now supports Docsify and really welcomes translations. Check out [Translations.md](./TRANSLATIONS.md)

## GitHub Pages

This book can also be read on GH Pages

> https://softchris.github.io/react-book/

## Links

- 👉 [Publish a React App to Azure](https://docs.microsoft.com/en-us/learn/modules/publish-app-service-static-web-app-api/?WT.mc_id=academic-0000-chnoring) This module takes you through using the so called Azure Static Web Apps service, you can select the path that fits your framework, i.e React, Angular, Vue or Svelte.

- 👉 [Node.js 5 modules](https://docs.microsoft.com/en-us/learn/paths/build-javascript-applications-nodejs/?WT.mc_id=academic-0000-chnoring) You're going to need a backend API sooner or later. Node.js is good choice for backend and there are many frameworks that will help you build an API like Express, Koa, Nest, Fastify etc.