Skip to content

Latest commit

 

History

History
62 lines (42 loc) · 1.68 KB

README.md

File metadata and controls

62 lines (42 loc) · 1.68 KB
Raw

Modern ToDo CRUD App (Vite + React)

I created this React ToDo app that saves and loads to local storage. The React App includes full CRUD functionality: create, read, update, and delete. It's also customised with Light/Dark Mode and a Color Theme switcher.

Main Learning Points:

  • Building Components in React.
  • Passing Props between Components.
  • Creating your own Custom Hooks to read and write data to your local storage.
  • How to deal with State locally and pass it between Components.
  • Working with Heroicons (Beautiful hand-crafted SVG icons, by the makers of Tailwind CSS).
  • Accessibility (aria-label, color theme switcher).
  • Working with Vite JS, for a faster and smoother development workflow. It immediately updates your changes in the browser.
  • Customised App by adding Light/Dark Mode.
  • Customised App by adding color theme switcher.

Built with:

  • React.js
  • JavaScript
  • Node.js
  • Vite JS
  • HTML
  • CSS
  • Heroicons

Deployed with:

  • Deployed using Netlify

Project Setup & Running:

  • Prerequisites

    • None

  • Clone Repo https://github.com/MiguelLamas/react-todo.git

  • Before starting the project, follow these steps to create project, install Vite JS and get your server up and running:

    • npm create vite@latest
    • add <your-project-name>
    • select a framework
    • select a variant
    • cd <your-project-name>
    • npm install
    • npm run dev

  • To make your dev experience easier, download these VS code extensions:

    • ES7 React/Redux/GraphQL/React-Native snippets
    • ESLint

Developer:

License:

Copyright (c) 2023 Miguel Lamas - https://github.com/MiguelLamas