Skip to content

Latest commit

 

History

History
116 lines (78 loc) · 3.93 KB

README.md

File metadata and controls

116 lines (78 loc) · 3.93 KB
Raw

CRUD Fundamentals - Next 🪖

Cover

This project demonstrates the fundamental concepts of CRUD (Create, Read, Update, Delete) operations by building a straightforward employee management system. It emphasizes best practices for utilizing TanStack React Query, Axios, and other technologies to develop a functional CRUD application using Next.js with TypeScript.

📝 Features

  • Create: Add new employees to the system with relevant details.
  • Read: Fetch and display employee information from the backend.
  • Update: Modify existing employee records as needed.
  • Delete: Remove employee records from the system.

💻 Technologies

  • Next.js: A React framework for building server-side rendered and static web applications.
  • Zod: A TypeScript-first schema declaration and validation library.
  • Axios: A promise-based HTTP client for making requests to the server.
  • @tanstack/react-query: A data-fetching library for managing server state in React applications.
  • React-Hot-Toast: A lightweight and customizable toast notification library for React.
  • Next.js TopLoader: A customizable top-loading bar for Next.js that provides visual feedback for page transitions and loading states.

🧑🏻‍💻 Installation

To get started with this project, you can either run it locally or use Docker:

Local Installation

  1. Clone the Repository

    git clone https://github.com/WannaCry081/CrudFundamentals-Next.git

  2. Navigate to the Project Directory

    cd crudfundamentals-next

  3. Create a .env.local file and include the following variables

    # .env.local
NEXT_PUBLIC_API_URL=

  4. Install Dependencies

    npm install
# or
yarn install

  5. Run the Development and JSON Server

    npm run app
# or
yarn app

    Your application will be available at http://localhost:3000 and http://localhost:8000.

Docker Installation

  1. Clone the Repository

    git clone https://github.com/WannaCry081/CrudFundamentals-Next.git

  2. Navigate to the Project Directory

    cd crudfundamentals-next

  3. Run the bash file by executing the code below

    ./run.sh

    Ensure that Docker is installed on your system for this to work.

📦 Usage

After running the development and JSON server, you can access the following features:

  • Add New Employees: Navigate to the employee creation form or access the endpoint /employees/create to add new employee records.
  • View Employee List: Access the employee list page at /employees to view all employees.
  • View Employee Details: Access the employee details page at /employees/{id} to view information about a specific employee.
  • Edit Employees: Click "Update" on the employee details page or navigate to /employees/{id}/edit to update employee information.
  • Delete Employees: Remove employees from the system via the employee edit page or employee details page.

🚚 Contributing

If you'd like to contribute to this project, please follow these guidelines:

  1. Fork the repository.
  2. Create a new branch (git checkout -b feature/YourFeature).
  3. Commit your changes (git commit -am 'Add new feature').
  4. Push to the branch (git push origin feature/YourFeature).
  5. Create a new Pull Request.

☎️ Contact

For any questions or feedback, feel free to reach out: