Authentication

[takuyakikuchi]

Deliverables

A user can log in to the application when a valid credential is given.
A user can't log in to the application when an invalid credential is given.

Todos

• Install libraries
  • MSW
  • @tanstack/react-query
  • react-query-auth
  • axios
  • mswjs/data
  • nanoid
  • vitest
  • Chance
  • testing-libarary-react
• Mock API
  • Define mocks
  • Integrate mocks with Service Worker
• Authentication
  • Register
  • Login
  • onSuccess
  • Check authentication on page load
  • Sign out
  • Loader component
• Test

References

• MSW: https://mswjs.io/
• react-query-auth: https://github.com/alan2207/react-query-auth
• react-query: https://tanstack.com/query/latest
• axios: https://github.com/axios/axios
• mswjs/data: https://github.com/mswjs/data
• nanoid: https://github.com/ai/nanoid
• jsonwebtoken: https://github.com/auth0/node-jsonwebtoken
• jsonwebtoken-esm: https://github.com/sanity-io/jsonwebtoken-esm
• jase: https://github.com/panva/jose
• vitest: https://vitest.dev/
• Chance: https://chancejs.com/
• testing library react: https://testing-library.com/docs/react-testing-library/intro/
• happy-dom: https://github.com/capricorn86/happy-dom

Other notes

Issue with JWT package

jsonwebtoken doesn't work with ES6 modules. So I changed it to jsonwebtoken-esm.
auth0/node-jsonwebtoken#655

Test

RegiterForm and LoginForm test will be done later.