https://github.com/alphaolomi/vite-react-typescript-react-dnd

React Dnd Example/Boilerplate
https://github.com/alphaolomi/vite-react-typescript-react-dnd

boilerplate-template react react-dnd react-dnd-html5-backend typescript vite

Last synced: 12 months ago
JSON representation

React Dnd Example/Boilerplate

• Host: GitHub
• URL: https://github.com/alphaolomi/vite-react-typescript-react-dnd
• Owner: alphaolomi
• Created: 2023-05-14T12:05:39.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2023-05-15T20:20:27.000Z (over 2 years ago)
• Last Synced: 2025-01-11T16:24:53.856Z (about 1 year ago)
• Topics: boilerplate-template, react, react-dnd, react-dnd-html5-backend, typescript, vite
• Language: TypeScript
• Homepage: https://vite-react-typescript-react-dnd.vercel.app
• Size: 413 KB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# React Dnd Example/Boilerplate

> `vite-react-typescript-react-dnd`

This is a simple boilerplate example of using React Dnd for drag and drop functionality. Utilizing HTML5 Drag and Drop API.

![React Dnd Example](./public/react-dnd-example.png)

## Features (per page)

- [x] Simple Cards reorder by Drag and Drop (Currently index page)

- [ ] Cards can be dragged to the Trash

- [ ] Prodcut drop to the Cart

## Tech Stack

- [x] React

- [ ] React Router

- [x] Typescript

- [x] React Dnd

- [x] Vite

- [ ] Tailwindcss

## Getting started

```bash

yarn install

yarn dev

```

Open [http://localhost:5173/](http://localhost:5173/) to view it in the browser.