# Passing data from React frontend to Django Backend

**URL:** <https://forum.djangoproject.com/t/passing-data-from-react-frontend-to-django-backend/3536>\
**Category:** Using Django\
**Created:** [July 21, 2020, 1:13am UTC](https://forum.djangoproject.com/t/passing-data-from-react-frontend-to-django-backend/3536 "2020-07-21T01:13:59Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![ShaanLuthra1](https://avatars.discourse-cdn.com/v4/letter/s/65b543/32.png) [@ShaanLuthra1](https://forum.djangoproject.com/u/ShaanLuthra1)\
**Post date:** [July 21, 2020, 1:13am UTC](https://forum.djangoproject.com/t/passing-data-from-react-frontend-to-django-backend/3536/1 "2020-07-21T01:13:59Z")

</div>

I have a completed react app and I have a textarea and button in it and I want the textarea text to be passed to the django backend when the button is pressed. In my folder, I have a React UI, Django project, along with a Django app inside of that project. I know I have to use the django REST framework but I dont know how to pass the text from the React UI to the backend of Django.

---

<div class="post-metadata">

**Author:** ![KenWhitesell](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/kenwhitesell/32/280_2.png) [@KenWhitesell](https://forum.djangoproject.com/u/KenWhitesell)\
**Post date:** [July 21, 2020, 1:57am UTC](https://forum.djangoproject.com/t/passing-data-from-react-frontend-to-django-backend/3536/2 "2020-07-21T01:57:31Z")

</div>

Just a clarification, you don’t _need_ to use DRF. Depending upon how much functionality you need to implement in the back end and how many endpoints you need to provide, you _can_ implement this using just the regular Django view interfaces. (The `request.body` attribute gives you access to a JSON payload submitted from the front end.)

Regarding React, you might find someone here who can help you - but really, all you’re looking to do is issue an http POST from your app, probably with a JSON payload. (Or, if React can submit a request as standard POST data, you could pass it through to a view as if it were from a typical HTML form.) You might find more effective help on a React-related site.

Ken

---

<div class="post-metadata">

**Author:** ![Suttonium](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/suttonium/32/1264_2.png) [@Suttonium](https://forum.djangoproject.com/u/Suttonium)\
**Post date:** [July 21, 2020, 2:02pm UTC](https://forum.djangoproject.com/t/passing-data-from-react-frontend-to-django-backend/3536/3 "2020-07-21T14:02:56Z")

</div>

First, you’re going to have to install axios into your react environment. This is a super simple package that routes HTTP requests.

> **[How To Use Axios with React | DigitalOcean](https://www.digitalocean.com/community/tutorials/react-axios-react)**
>
> Axios is a lightweight, promise-based HTTP client. In this article, you will explore examples of how to use Axios to access the popular JSON Placeholder API …

I would take a look at that link to get an understanding of how axios works.

TLDR, you’ll be able to tell axios what request data to send and what method/url to send the data to. In this case, you will be sending the information to a url defined in your django project – which has a view connected – and that view will return a Response object that will bounce back to the react project.

CodingEntrepreneurs has a great set of videos that goes through the whole process.

[![](https://us1.discourse-cdn.com/flex026/uploads/djangoproject/original/2X/1/1b5cd73d64b2ef4b1658afd28b1bdb8617b083d0.jpeg "Create a Twitter-like App with Python Django JavaScript and React. Full TUTORIAL") ](https://www.youtube.com/watch?v=f1R_bykXHGE)

I would suggest taking some time and going through this tutorial before jumping into cross-framework development so you truly understand what’s going on in the background.