https://github.com/danielkhakbaz/notes-app
a Note-app using LocalStorage API, so your data will never be removed unless you choose to remove it.
https://github.com/danielkhakbaz/notes-app
daisyui eslint git husky javascript nextjs prettier tailwindcss
Last synced: about 1 month ago
JSON representation
a Note-app using LocalStorage API, so your data will never be removed unless you choose to remove it.
- Host: GitHub
- URL: https://github.com/danielkhakbaz/notes-app
- Owner: Danielkhakbaz
- Created: 2023-03-07T10:11:31.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-11-02T13:51:18.000Z (11 months ago)
- Last Synced: 2025-07-20T15:24:45.790Z (3 months ago)
- Topics: daisyui, eslint, git, husky, javascript, nextjs, prettier, tailwindcss
- Language: JavaScript
- Homepage: https://danial-notes-app.vercel.app/
- Size: 106 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Notes App
A simple, elegant Notes application built with [Next.js](https://nextjs.org/), providing a smooth and interactive user experience for managing notes. This app utilizes modern frontend technologies like Tailwind CSS and DaisyUI for styling and React Icons for visual consistency.
## Project Overview
The Notes App is designed for users who want a simple yet effective way to organize their notes. With a responsive interface, this app works well on both desktop and mobile devices.
## Table of Contents
- [Features](#features)
- [Technologies Used](#technologies-used)
- [Installation](#installation)
- [Development Scripts](#development-scripts)
- [Folder Structure](#folder-structure)
## Features
- **Create, Edit, and Delete Notes**: Full CRUD functionality for managing notes.
- **Unique Identifiers**: Each note has a unique ID, powered by `uuid`.
- **Responsive Design**: Adapts seamlessly to any screen size.
- **DaisyUI**: Simplifies component styling with Tailwind integration.
- **Linting and Formatting**: Ensures consistent code style with ESLint and Prettier.
## Technologies Used
- **[Next.js](https://nextjs.org/)** - Framework for React with server-side rendering and static generation.
- **[React](https://reactjs.org/)** - JavaScript library for building user interfaces.
- **[Tailwind CSS](https://tailwindcss.com/)** - Utility-first CSS framework.
- **[DaisyUI](https://daisyui.com/)** - Tailwind CSS components library for rapid UI development.
- **[React Icons](https://react-icons.github.io/react-icons/)** - Popular icons for React applications.
- **[uuid](https://www.npmjs.com/package/uuid)** - Generates unique identifiers.
- **[Husky](https://typicode.github.io/husky/)** - Git hooks for automated workflows.
## Folder Structure
Here's an overview of the project structure:
```plaintext
notes-app/
├── public/
├── app/
│ ├── components/ # Reusable components
│ ├── notes/ # Notes page with all its components
│ └── styles/ # Global CSS and Tailwind configurations
│
├── .eslintrc.json # ESLint configuration for code quality
├── .prettierrc # Prettier configuration for code formatting
├── next.config.js # Next.js configuration
├── package.json # Project metadata, scripts, and dependencies
└── README.md # Project documentation
```
## Installation
To set up this project locally, follow these steps:
1. **Clone the repository**:
```bash
git clone https://github.com/Danielkhakbaz/Notes-App
cd danielo-portfolio
2. **Install dependencies**:
```tsx
yarn
3. **Run the development server**:
```tsx
yarn dev
4. **Open http://localhost:3000 in your browser to see the project**.
## Development Scripts
Here are some helpful scripts to assist in the development and maintenance of this project:
```dev```: Runs the app in development mode.
```build```: Compiles the app for production.
```start```: Starts the production server.
```lint```: Lints and fixes files using ESLint.
```fix```: Formats files using Prettier.
```check-prettier```: Checks the code format without making changes.