FireflyFolio

TodoList Web

Overview

Objectives

A small, iterative, educational project to develop skills in React and its ecosystem in particular,
as well as the main front-end frameworks such as Vue, Angular, and their respective derivatives.

Features

This is a simple task management application with the following functions:

  • Add a task
  • Edit a task
  • Delete a task
  • Display the task list
  • Filter and sort tasks

Planned roadmap

React

  • React Hooks
  • Redux Toolkit
  • TanStack Query
  • Zustand

Vue

  • Vue Reactivity
  • Vuex
  • Pinia
  • TanStack Query

Angular

  • Angular Signals
  • RxJS
  • NgRx
  • TanStack Query

Tests Frontend

  • Jest
  • Testing Library
  • Vitest
  • Playwright
  • Cypress

Forms

  • React Hook Form
  • Zod
  • Formik
  • Yup

Frameworks

  • Next.js
  • Remix
  • Gatsby
  • Redwood.js
  • Refine.dev
  • Nuxt.js

i18n

  • i18next
  • Lingui.js
  • React Intl

Styling

  • Tailwind CSS
  • Styled Components
  • Emotion
  • Vanilla Extract

Theming

  • UIkit
  • Tailwind UI
  • Material UI
  • Shadcn
  • Chakra UI
  • Headless UI
  • Radix UI
  • Ant Design

Animations

  • Framer Motion
  • GSAP
  • React Aria

Data Visualization

  • D3.js
  • Chart.js
  • Recharts
  • ECharts
  • Victory Charts

Backlog

Click on the story number to access Github.
Click on the status to view the demo if available.

React

#StoryStatut
001-01List tasks, Create, Read, Update, DeleteDone
002-01Priority, Status, Sorting, FilteringDone
003-01TaskApp, TaskList, TaskCreate, TaskEdit, Inline editingDone
004-01TypescriptDone
005-01Redux ToolkitDone
006TanStack QueryTodo
007ZustandTodo

Vue

#StoryStatut
101-01Composition: List tasks, Create, Read, Update, DeleteDone
102-01Options: List tasks, Create, Read, Update, DeleteDone
103-01Priority, Status, Sorting, FilteringDone
104-01TaskApp, TaskList, TaskCreate, TaskEdit, Inline editingDone
104TypescriptTodo
105VuexTodo
106PiniaTodo
107TanStack QueryTodo

Angular

#StoryStatut
201-01List tasks, Create, Read, Update, DeleteDone
202-01Signals: List tasks, Create, Read, Update, DeleteDone
203-01Priority, Status, Sorting, FilteringDone
204-01TaskApp, TaskList, TaskCreate, TaskEdit, Inline editingDone
204RxJSTodo
205NgRxTodo
206TanStack QueryTodo