Skip to content

Zorkham/alpine-project-planner

Repository files navigation

Alpine Project Planner

Alpine Project Planner is a simple project management tool that allows users to add, edit, delete, search, and move tasks between different status columns. The application uses local storage to persist data and works on all devices.

Demo: alpine-project-planner.vercel.app

Preview

Features

  • Add Tasks: Add a new task by clicking the "New Task" button.
  • Edit Tasks: Edit a task by clicking the "Edit" button.
  • Remove Tasks: Remove a task by clicking the "Delete" button.
  • Search Tasks: Search for a task by typing in the search bar.
  • Move Tasks: Move a task between different status columns by dragging and dropping.
  • Board View: View tasks in a board view with different status columns.
  • List View: View tasks in a list view with different status lists.
  • Local Storage: The application uses local storage to persist data.
  • Responsive Design: The application is responsive and works on all devices.

Tech Stack

JavaScript TypeScript Alpine.js HTML5 CSS3 Tailwind CSS ESLint Prettier Jest Cypress Cucumber PNPM Vite Vercel

Getting Started

To get started with this project, follow these steps:

  1. Clone the repository:
git clone https://github.com/zorkham/alpine-project-planner.git
  1. Install dependencies:
pnpm install
  1. Run project locally:
pnpm dev
  1. Open your browser: Go to http://localhost:3000 to see the app in action.

Testing

This project uses Jest, Cypress, and Cucumber for testing. To run the tests, use the following commands:

  • Unit Tests:

    pnpm test
  • E2E Tests:

    pnpm test:e2e
  • All Tests:

    pnpm test:all

Other Projects