FireflyFolio

TodoList Web

Présentation

Objectifs

Petit projet pédagogique et itératif pour monter en compétence sur React et son écosystème en particulier,
ainsi que les principaux frameworks Frontend tels que Vue, Angular et leurs dérivés respectifs.

Fonctionnalités

Il s'agit d'une simple application de gestion de tâches comportant les fonctions suivantes :

  • Ajouter une tâche
  • Modifier une tâche
  • Supprimer une tâche
  • Afficher la liste des tâches
  • Filtrer et trier les tâches

Programme prévisionnel

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

Formulaires

  • React Hook Form
  • Zod
  • Formik
  • Yup

Frameworks

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

i18n

  • i18next
  • Lingui.js
  • React Intl

Styles

  • Tailwind CSS
  • Styled Components
  • Emotion
  • Vanilla Extract

Thématisation

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

Animations

  • Framer Motion
  • GSAP
  • React Aria

Dataviz

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

Backlog

Cliquez sur le numéro de la story pour accéder au Github.
Cliquez sur le statut pour voir la démo si disponible.

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