enzom-uy / todoapp

Basic To-do app built with React, using localStorage.

Todo-app project

Basic Todo-app made with React for learning purposes.

Demo

📔 Table of Contents

• 📔 Table of Contents
  • 🌟 About the project
    • 📷 Screenshots
  • 👾 Technologies
  • Starting the project
    • Prerequirements
    • 🏃 Running the project locally

🌟 About the project

📷 Screenshots

👾 Technologies

• React.js
  • React is the Javascript framework that I chose for this project, since it's currently the one that interests me the most.
• Create React App
  • The project environment was built using Create-react-app.
• Firebase
  • Google's Firebase allowed me to use Firestore as a free and easy-to-use database.
• Chakra UI, Chakra UI Icons
  • I chose to use a Component Library like Chakra UI because it allowed me to be more focused on my code, instead of styling. It increased my development time, and it's the one that I find more easy to customize if I need to.
  • Chakra needs Framer-motion to work
• uuid
  • I used uuid to generate unique IDs for each task. At the moment of making the web app, React 18 was not officially released yet, so I couln't use the new useId() hook.

Starting the project.

Prerequirements

This project uses either yarn or npm as dependency/package manager. You should have npm installed if you already have Node. If you choose to use yarn, run the next command to install it:

 npm i -g yarn

🏃 Running the project locally

Clone the project:

  git clone https://github.com/enzom-uy/todoapp.git

Go to the project directory:

  cd todoapp

Install dependencies:

# with yarn:
  yarn
# with npm:
  npm install

Start the development server:

# with yarn:
  yarn start
# with npm:
  npm start