Build a Trello Clone in Angular using NgRx

In this project, we'll create a clone of Trello, the kanban-style list-making application. We will manage the states using NgRx. The ngrx-store-localstorage node package will be used to sync the NgRx store with the local storage of the browser.

We'll make a dashboard with multiple columns. Each column will, in turn, contain multiple tasks. We will allow the user to add, delete, or update tasks present in a column. The user will also be able to reorder columns using the drag-and-drop functionality.

We'll start by setting up the reducers and actions for the NgRx store, and then we'll create a board, its columns, and tasks for each column. We'll also add a new task addition option in each column. Next, we'll add drag-and-drop features not only for tasks but also for columns. We will implement this functionality using the Angular CDK's drag-and-drop feature. Finally, we'll sync our NgRx store with the local storage.