https://github.com/mohdafjal2004/simple-to-do-app

A simple todo app built using Reactjs with all crud operations , use of props to display data and modify it, styled using Bootstrap alpha
https://github.com/mohdafjal2004/simple-to-do-app

bootstrap5 crud props-and-state-components props-drilling reactjs todo todolist todolist-application

Last synced: 4 days ago
JSON representation

A simple todo app built using Reactjs with all crud operations , use of props to display data and modify it, styled using Bootstrap alpha

• Host: GitHub
• URL: https://github.com/mohdafjal2004/simple-to-do-app
• Owner: mohdafjal2004
• Created: 2023-04-10T14:22:14.000Z (over 1 year ago)
• Default Branch: master
• Last Pushed: 2023-05-16T10:37:37.000Z (over 1 year ago)
• Last Synced: 2024-11-07T22:31:08.419Z (about 2 months ago)
• Topics: bootstrap5, crud, props-and-state-components, props-drilling, reactjs, todo, todolist, todolist-application
• Language: JavaScript
• Homepage: https://simple-to-do-app-kappa.vercel.app
• Size: 309 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ReactJS Project with CRUD Functionality and Bootstrap Styling

This is a sample ReactJS project that demonstrates CRUD (Create, Read, Update, Delete) operations. The project uses Bootstrap for styling and data is passed as props between components.

## Features

- Create: Add new items to the data list.

- Read: Display the data list with Bootstrap-styled components.

- Update: Edit existing items in the data list.

- Delete: Remove items from the data list.

## Prerequisites

To run this project, you need to have the following installed:

- Node.js

- npm (Node Package Manager)

## Getting Started

1. Clone the repository:

git clone 

markdown

Copy code

2. Install the dependencies:

npm install

markdown

Copy code

3. Start the development server:

npm start

The project will be running at `http://localhost:3000`.

- `components`: Contains the individual components for CRUD operations.

- `App.js`: The main component that renders the other components.

- `index.js`: The entry point of the application.

## Usage

To use the CRUD features of this project, follow these steps:

1. Create: Fill out the form and click the "Add" button to add a new item to the data list.

2. Read: Display the data list with Bootstrap-styled components.

3. Update: Click the "Edit" button next to an item in the data list . Edit the item's details and click the "Save" button to update it.

4. Delete: Click the "Delete" button next to an item in the data list to remove it from the data list.

## Contributing

Contributions are welcome! If you find any issues or have suggestions for improvements, please create an issue or submit a pull request.

## License

This project is licensed under the [MIT License](LICENSE).