#7: Fetch API to Check If Contrast Is Okay - Githubissues

levinthiel / color-theme

https://color-theme-chi.vercel.app

0 stars 0 forks source link

#7: Fetch API to Check If Contrast Is Okay #2

Closed levinthiel closed 2 days ago

levinthiel commented 4 days ago

As a Developer

I want to check the contrast ratio via an API when colors are added or edited

in order to ensure accessibility compliance.

https://github.com/neuefische/web-react-recap-project/assets/93415777/acb2b6f6-6a34-4300-957b-b766de773c7f

Acceptance Criteria

An API call is made automatically when a color or contrast text is added or edited.
The application displays a message indicating whether the contrast ratio is sufficient next to the respective color card.

Tasks

Use this Contrast Checker API to display the overall a11y score for each color

Hint

This is how you can send data to an API, it is called a post request.

 async function postFetch() {
      const response = await fetch(
        "https://www.some-api-url.com/api",
        {
          method: "POST",
          body: JSON.stringify({ cool: true }),
          headers: {
           "Content-Type": "application/json",
         },
        }
      );
}

levinthiel commented 2 days ago

[ ] find out where to put the API
[ ] fetch the checker
[ ] start the function on add and on edit (*)
[ ] put the text in
[ ] check if it works

(*)so I had a thinking issue, I had to check ALL the colors in the array and keep the constrast check up to date so my initial path was completely wrong (but funny enough the function kinda worked)