Skip to content

Latest commit

 

History

History
48 lines (36 loc) · 1.6 KB

README.md

File metadata and controls

48 lines (36 loc) · 1.6 KB

React + Vite

Todo App

Description

This Todo App is a simple yet powerful tool designed to help users manage their daily tasks efficiently. Built with React and styled with pure CSS, this app provides a clear and interactive interface for tracking tasks, including adding, removing, and updating items.

Features

  • View Todo List: Display all todo items fetched dynamically from Airtable.
  • Add Todo Items: Users can add new tasks to the list.
  • Remove Todo Items: Users can remove tasks they've completed or no longer need.
  • Update Todo Items: Users can edit the details of existing tasks.
  • Sorting Capability: Toggle between ascending and descending order of tasks based on the title.
  • Responsive Design: Ensures that the app is usable on both desktop and mobile devices.

Technology Stack

  • Frontend: React.js
  • API: Airtable
  • Styling: CSS with responsiveness supported.

Setup and Installation

Prerequisites

  • Node.js
  • npm or yarn
  • Airtable API Key and Base Configuration

Installation

  1. Clone the repository:

    git clone https://github.com/nata-kalina/react-todo-new.git
    cd todo-app
    
  2. Install dependencies:

    npm install
    
  3. Configure your Airtable API details:

    • Update VITE_AIRTABLE_API_TOKEN, VITE_AIRTABLE_BASE_ID, and VITE_TABLE_NAME with your Airtable details.
  4. Running the App

    • Execute the following command to start the development server:
    npm run dev
    

Usage

Once the app is running, you can start adding, removing, and updating your todo items. Use the sort button to toggle the order of the items.