title: React
category: page
slug: react
sortorder: 0424
toc: False
sidebartitle: React
meta: Learn about React and JavaScript frameworks for web applications on Full Stack Python.


[React](https://reactjs.org/) is a [JavaScript](/javascript.html) web 
application framework for building rich user interfaces that run in web 
browsers.

<a href="https://reactjs.org/" style="border:none"><img src="/img/logos/react.png" width="100%" alt="React framework logo." class="shot"></a>


<div class="well see-also">React is an implementation of the <a href="/javascript.html">JavaScript frameworks</a> concept. Learn how these pieces fit together in the <a href="/web-development.html">web development</a> chapter or view the <a href="/table-of-contents.html">table of contents</a> for all topics.</div>


### Beginner React tutorials
Generally before you start working with React you will want to learn how 
to build your Python backend with a [web framework](/web-frameworks.html)
such as [Django](/django.html), [Flask](/flask.html) or 
[Pyramid](/pyramid.html). Once you get comfortable with the 
[web development](/web-development.html) basics with one of those frameworks
as well as [JavaScript](/javascript.html) then it will be much easier to 
tack on React to build your client-side user interfaces.

* [JavaScript fundamentals before learning React](https://www.robinwieruch.de/javascript-fundamentals-react-requirements/)
  provides a gut check that you have the prerequisite knowledge to avoid
  getting impossibly stuck while trying to learn React.

* The [official React tutorial](https://reactjs.org/tutorial/tutorial.html)
  is one of the best ways to start using React because many other tutorials
  quickly fall out of date while this one tends to stick to the basics
  that are relevant to beginners.

* [9 things every React.js beginner should know](https://camjackson.net/post/9-things-every-reactjs-beginner-should-know)
  is not a tutorial but instead the author gives some strong opinions for
  what beginners should know as they start learning React.

* [React Bootstrap](https://react-bootstrap.github.io/) 
  ([source code](https://github.com/react-bootstrap/react-bootstrap) replaces
  the existing Bootstrap JavaScript with React components that do not
  rely on jQuery.


## Python+React tutorials
* [How to set up Django with React](https://mattsegal.dev/django-react.html)
  presents one developer's opinionated way of combining a 
  [Django](/django.html)-powered back end with React on the front end,
  including how to serve up static assets.

* [Django REST with React (Django 2.0 and a sprinkle of testing)](https://www.valentinog.com/blog/tutorial-api-django-rest-react/)
  combines a [Django](/django.html) plus 
  [Django REST Framework (DRF)](/django-rest-framework-drf.html) backend 
  with React on the front end and shows how to stich it all together.

* This Modern Django 4-part tutorial series is well-done, has 
  [freely available source code](https://github.com/v1k45/ponynote) 
  and includes:

    1. [Setting up Django and React](http://v1k45.com/blog/modern-django-part-1-setting-up-django-and-react/)
    2. [Redux and React Router setup](http://v1k45.com/blog/modern-django-part-2-redux-and-react-router-setup/)
    3. [Creating an API and integrating with React](http://v1k45.com/blog/modern-django-part-3-creating-an-api-and-integrating-with-react/)
    4. [Adding authentication to React SPA using DRF](http://v1k45.com/blog/modern-django-part-4-adding-authentication-to-react-spa-using-drf/)


* [Build a Simple CRUD App with Python, Flask, and React](https://developer.okta.com/blog/2018/12/20/crud-app-with-python-flask-react)
  shows how to combine a [Flask](/flask.html) backend with React.

* [Learn React app](https://github.com/tyroprogrammer/learn-react-app)
  is a Git repository with a code tutorial and instructions for how to
  follow along, as well as exercises to ensure you are tested as you go.


### Other React resources
* [React interview questions](https://tylermcginnis.com/react-interview-questions/)
  is a good quiz to see what you know or still need to learn about the
  fundamentals of using React.

* [Under-the-hood-ReactJS](https://bogdan-lyashenko.github.io/Under-the-hood-ReactJS/)
  examines the React codebase itself rather than teaching you how to use it.
