A simple and elegant personal diary web application built with React, Vite, and Tailwind CSS. It allows users to write, manage, and store daily entries with a clean and responsive UI.
🌐 Live Site: https://rajvikmadhani.github.io/Personal-Diary/
📤 Deployment: This project is deployed using GitHub Pages via gh-pages
.
To deploy:
npm run build # Builds the app to the dist/ folder
npm run deploy # Publishes dist/ to the gh-pages branch
📄 License: This project is open-source and available under the MIT License.
Made with ❤️ by @rajvikmadhani
- 🖋️ Add, edit, and delete diary entries
- 📅 Entry timestamps with
date-fns
- ✅ Form validation with
react-hook-form
andYup
- 🎨 Responsive UI with Tailwind CSS and DaisyUI
- ⚡ Fast build and dev experience with Vite
- 🚀 Deployed to GitHub Pages
- Frontend: React, Vite
- Styling: Tailwind CSS, DaisyUI
- Form Validation: React Hook Form, Yup
- Date Utilities: date-fns
To run this project locally:
# Clone the repository
git clone https://github.com/rajvikmadhani/Personal-Diary.git
cd Personal-Diary
# Install dependencies
npm install
# Start the local development server
npm run dev
npm run dev # Start the dev server
npm run build # Create a production build in the dist/ folder
npm run preview # Preview the production build
npm run lint # Run ESLint on source files
npm run deploy # Deploy dist/ to GitHub Pages
Personal-Diary/
├── public/ # Static files
├── src/ # Source code
│ ├── components/ # Reusable components
│ ├── pages/ # Page-level components
│ ├── App.jsx
│ └── main.jsx
├── dist/ # Build output (after `npm run build`)
├── vite.config.js # Vite configuration
└── package.json # Project metadata and dependencies
Contributions are welcome!
If you'd like to improve something, feel free to fork the repo, make changes, and open a pull request.
If you have any questions or suggestions, feel free to reach out via GitHub issues or at @rajvikmadhani.