Skip to content

This is my first react js project. This project containing three main feautures: todo, notes, and expense tracker

License

Notifications You must be signed in to change notification settings

Alvalens/react-tools

Repository files navigation

React Tools

visitor badge

React Tools is a project that provides a collection of tools and components built using popular technologies like React, React Router, and TailwindCSS. Also this project implement browser local storage so it didnt need any databases. React Tools offers features such as a Todo List, Note-taking, and Expense Tracking. This project is also my first react project. If you find any bugs please contact me, I'll try my best to fix it.

JavaScript React React Router TailwindCSS

Features

  • Todo List: Manage your tasks with a simple and intuitive todo list.
  • Note-taking: Take notes and organize your thoughts efficiently.
  • Expense Tracking: Keep track of your expenses and manage your finances.

Installation

  1. Clone the repository:

    https://github.com/Alvalens/react-tools.git
    
  2. Navigate to the project directory:

    cd react-tools
  3. Install dependencies:

    npm install
    
  4. Start the development server

    npm start

Usage

You can access these menu on home page on the navbar, feauture section and footer. You can also access those feauture by direclt type the url /todo /note and /expense-tracker.

Todo List

  • add new todo list: You can add new todo by pressing the new todo button
  • Edit existing todo list: Click the edit button on the right side of todo to modify it.
  • Remove todo: Use the delete button to remove a todo from the list.
  • Mark as complete: You can mark or unmark todo as complete by clicking the blue check button on each todo.
  • Clear Todo: Selete all of your todos

Note

  • Create new notes: You can create new notes by clicking new note button, you can start writing note after creating one.
  • Edit notes: Edit your by directly type in note card to update information.
  • Delete notes: Remove notes that are no longer needed by clicking the trash icon.
  • Clear Notes: Delete all of your notes

Expense tracker

  • Add new expense or income: Record your expenses or income by adding details.
  • Edit existing expenses or income: Edit the details of your recorded expenses or income.
  • Delete expenses or income: Remove expenses from your tracker.
  • Total balance: Auto calculated based on your expense and income.

Contributing

Contributions are welcome! If you find any issues or have suggestions, feel free to open an issue or submit a pull request.

License

This project is licensed under the GPL-3.0 License seethe LICENSE file for details.

About

This is my first react js project. This project containing three main feautures: todo, notes, and expense tracker

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published