Notes_App_ReactJS Tailwind Templates

Notes_app_reactjs

creating a Notes app using React JS and Tailwind CSS

๐Ÿ“ Notes App

A modern and minimal Notes App built with React, Vite, and Tailwind CSS. This app allows users to create, edit, archive, pin, and delete notes with support for a trash bin that auto-clears after 30 days. Fully responsive and optimized for all devices.


๐Ÿš€ Features

  • ๐Ÿ“ Add Notes with title and text
  • ๐Ÿ“Œ Pin Important Notes
  • ๐Ÿ—„๏ธ Archive Notes
  • ๐Ÿ—‘๏ธ Delete Notes to Bin
  • โ™ป๏ธ Restore from Bin or Delete Permanently
  • ๐Ÿงน Auto-delete notes in Bin after 30 days
  • ๐Ÿ’พ Data persists with localStorage
  • ๐Ÿ“ฑ Fully Responsive Design

โš™๏ธ Tech Stack

  • โš›๏ธ React (with Hooks & Context API)
  • โšก Vite (for fast bundling)
  • ๐ŸŽจ Tailwind CSS (for styling)
  • ๐Ÿ—ƒ๏ธ LocalStorage (for persistence)

๐Ÿ–ผ๏ธ Screenshots

You can include screenshots or GIFs here showing the UI and features.


๐Ÿ“ฆ Installation

Clone the repository:

https://github.com/digvijayabhishikth/Notes_App_ReactJS.git

npm install
npm run dev

###๐Ÿง  Concepts Used

React Hooks (useState, useEffect, useReducer, useContext)

LocalStorage Sync with useEffect

Component-based architecture

Tailwind utility-first styling

Route-based rendering using react-router-dom

Auto-delete logic using timestamps

###๐Ÿค Contributing

Pull requests are welcome! Feel free to open an issue or suggest new features.

Top categories

Loading Svelte Themes