https://github.com/harikrishna-9885699666/blog-app-react-redux-vite-tailwind

Blog Post CRUD Operations with React, Vite, Redux, Typescript and Tailwind CSS
https://github.com/harikrishna-9885699666/blog-app-react-redux-vite-tailwind

react react-hook-form redux tailwind typescript vite

Last synced: 2 days ago
JSON representation

Blog Post CRUD Operations with React, Vite, Redux, Typescript and Tailwind CSS

• Host: GitHub
• URL: https://github.com/harikrishna-9885699666/blog-app-react-redux-vite-tailwind
• Owner: HariKrishna-9885699666
• Created: 2024-05-27T09:09:44.000Z (8 months ago)
• Default Branch: main
• Last Pushed: 2024-05-30T09:40:35.000Z (8 months ago)
• Last Synced: 2024-05-30T11:16:38.784Z (8 months ago)
• Topics: react, react-hook-form, redux, tailwind, typescript, vite
• Language: TypeScript
• Homepage: https://blog-app-react-redux-vite-tailwind.netlify.app/
• Size: 74.2 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Blog Post CRUD Operations with React, Vite, Redux, Typescript and Tailwind CSS

Blog Post CRUD Operations with React, Vite, Redux, Typescript and Tailwind CSS

A simple yet powerful blog application built with the modern React ecosystem. This project allows you to create, read, update, and delete (CRUD) blog posts with a clean and intuitive user interface.

## Live Demo

You can check out the live demo of the application here: [Blog Post CRUD Operations](https://blog-app-react-redux-vite-tailwind.netlify.app/)

## Features

- **CRUD Operations:** Easily add, edit, and delete blog posts.

- **Redux State Management:** Centralized data storage and management for efficient updates.

- **Local Storage Persistence:** Posts are saved to your browser's local storage, ensuring your content is not lost on refresh.

- **Tailwind CSS Styling:** A highly customizable utility-first CSS framework for a sleek and responsive design.

- **Vite Build Tooling:** Fast development server and optimized production builds for a smooth developer experience.

- **Human-Readable Dates:**  Post creation dates are displayed in a user-friendly format (e.g., "5 minutes ago").

- **Form Validation:** Uses React Hook Form for streamlined input validation.

## Technologies Used

- **React:** The core library for building the user interface.

- **Redux Toolkit:** Simplifies Redux state management with efficient and predictable updates.

- **Tailwind CSS:** Utility-first CSS framework enabling rapid UI development with customizable components.

- **Vite:**  A fast build tool that provides a quick development server and optimized production bundles.

- **Date-fns:** A library for working with dates and time, used for formatting post creation times.

- **React Hook Form:** A library for simplified form management and validation.

## Installation & Setup

1. **Prerequisites:**

   - Node.js (version 14 or higher)

   - npm (or yarn): Usually comes bundled with Node.js.

2. **Clone the repository:**

   ```bash

   git clone https://github.com/HariKrishna-9885699666/blog-app-react-redux-vite-tailwind.git

   cd blog-app-react-redux-vite-tailwind

   npm install

   npm run dev