> For the complete documentation index, see [llms.txt](https://cloudinary.gitbook.io/build-a-mini-netflix/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cloudinary.gitbook.io/build-a-mini-netflix/build-a-mini-netflix-with-cloudinary/add-upload-component.md).

# Upload Component

The **Upload** component will handle uploading of videos by registered users.

## Step 1

Create a *Upload.js* file in the `components` folder.

```
touch Upload.js
```

## Step 2

Add code to the *Upload.js* file so that it looks like this:

```
import React, { Component } from 'react';
import { Link } from 'react-router';
import Nav from './Nav';

class Upload extends Component {

  render() {

    return (
      <div>
        <Nav />
        <h3 className="text-center">Upload Your 20-second Video in a Jiffy</h3>
        <hr/>

        <div className="col-sm-12">
          <div className="jumbotron text-center">
            <button className="btn btn-lg btn-info"> Upload Video</button>
          </div>
        </div>
      </div>
    );
  }
}

export default Upload;
```