Upload files with cloudinary

Context

Use vite with React and Typescript to upload files to cloudinary. Create a form with a file input and a submit button. When the user clicks on the submit button, the file is uploaded to cloudinary and the url is displayed on the page.

The image should be displayed on the page using the url generated by cloudinary.

Instructions

Create a new vite project with React and Typescript
Create a cloudinary account with Github authentication
Install the cloudinary package
Create a new cloudinary project
Create a new upload preset
Create a new file cloudinary.ts and add the following code:

import { v2 as cloudinary } from 'cloudinary';

Create a form with a file input and a submit button
When the user clicks on the submit button, upload the file to cloudinary
Display the url of the uploaded file on the page
Display the image on the page using the url of the uploaded file

https://cloudinary.com/documentation/upload_images#direct_uploading_from_the_browser

ThomasLaforge/test-upload-cloudinary

Upload files with cloudinary

Context

Instructions