Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mtguerson/clonefy
📌 This repository contains a simplified clone of Pipefy, showcasing drag-and-drop functionality similar to Trello. Built with React and enhanced with styled-components for dynamic styling, it serves as an interactive demonstration of integrating a simple JavaScript API for data management.
https://github.com/mtguerson/clonefy
react styled-components
Last synced: 26 days ago
JSON representation
📌 This repository contains a simplified clone of Pipefy, showcasing drag-and-drop functionality similar to Trello. Built with React and enhanced with styled-components for dynamic styling, it serves as an interactive demonstration of integrating a simple JavaScript API for data management.
- Host: GitHub
- URL: https://github.com/mtguerson/clonefy
- Owner: mtguerson
- Created: 2024-02-29T19:16:40.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2024-03-05T13:34:50.000Z (11 months ago)
- Last Synced: 2024-11-09T10:27:07.452Z (3 months ago)
- Topics: react, styled-components
- Language: JavaScript
- Homepage:
- Size: 212 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pipefy Clone with React and JavaScript API
This project is a simplified clone of Pipefy, focusing on the drag-and-drop functionality among columns, similar to Trello. It utilizes React for the frontend and a simple JavaScript API to manage the data. The aim of this project is to demonstrate the construction of an interactive application with React, integrated with a simple backend API.
## Technologies Used
- React: Used to build the user interface with reusable components.
- JavaScript: Programming language used to create the application logic and the simple backend API.
- CSS: For styling the components and the application layout.
- Styled-components: Utilized for styling within the component files in React, allowing for a more modular and dynamic approach to CSS.
- Other libraries and tools like React DnD for drag-and-drop functionality.
## Prerequisites
Before starting, ensure you have Node.js and npm (or yarn) installed on your machine. These tools are necessary to run the project locally.
## Setup and Execution
1. Clone the repository to your local machine:
```
git clone
```
2. Enter the project directory:
```
cd
```
3. Install the project dependencies:
```
npm install
```
or if you are using yarn:
```
yarn
```
4. To start the application in development mode, run:
```
npm start
```
or if you are using yarn:
```
yarn start
```
This will start the development server and open the application in your default browser.
## Project Structure
Describe the directory structure of your project here, explaining what each file or directory does, for example:
- `src/components`: Contains all reusable React components.
- `src/api`: Contains the JavaScript API simulation for data management.
- `src/styles`: CSS style files for application customization.
---
This README is a basic starting point. Adapt and expand it as necessary for your specific project.