# Set up React-app with uppy in front-end

**URL:** <https://community.transloadit.com/t/set-up-react-app-with-uppy-in-front-end/14877>\
**Category:** Uppy\
**Created:** [April 10, 2019, 3:47pm UTC](https://community.transloadit.com/t/set-up-react-app-with-uppy-in-front-end/14877 "2019-04-10T15:47:42Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![jfi1509](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/jfi1509/32/107_2.png) [@jfi1509](https://community.transloadit.com/u/jfi1509)\
**Post date:** [April 10, 2019, 3:47pm UTC](https://community.transloadit.com/t/set-up-react-app-with-uppy-in-front-end/14877/1 "2019-04-10T15:47:42Z")

</div>

How to link uppy to my react app, on following the doc I cannot find uppy in my node\_modules and I cannot use it. Please help me integrating uppy with my react-app.

---

<div class="post-metadata">

**Author:** ![ajkachnic](https://yyz2.discourse-cdn.com/flex032/user_avatar/community.transloadit.com/ajkachnic/32/260_2.png) [@ajkachnic](https://community.transloadit.com/u/ajkachnic)\
**Post date:** [July 9, 2020, 2:01pm UTC](https://community.transloadit.com/t/set-up-react-app-with-uppy-in-front-end/14877/2 "2020-07-09T14:01:02Z")

</div>

Sorry for the late reply, but if this is still an issue for you or anyone, I should be able to assist.

Assuming you’re starting out with something like `create-react-app`, the first thing you’d need to do is install the packages for Uppy

```auto
npm install @uppy/react @uppy/core

```

Following this, you should set up a component with your uppy instance and a Dashboard

```javascript
// src/components/Dashboard.jsx

import React from 'react'
import Uppy from '@uppy/core'
import { DashboardModal } from '@uppy/react'

// Adds all the needed css
import '@uppy/core/dist/style.css'
import '@uppy/dashboard/dist/style.css'

export default class Dashboard extends React.Component {
  constructor (props) {
    super(props)
    this.uppy = Uppy()
    // load your plugins here
  }

  componentWillUnmount () {
    this.uppy.close()
  }

  render () {
    // pass any options that would be used when initializing the dashboard as props
    return <DashboardModal uppy={this.uppy}/>
  }
}

```

Then wherever you need your Dashboard, you can import this component. Most of this code comes from [here](https://uppy.io/docs/react/dashboard-modal/)

I hope this helps. Let me know if you have any further problems or questions

- Andrew
