Recaptcha Instructions.md

Recaptcha using React Exercise:

Instructions:

Create an app that provides a solution similar to Recaptcha.

Requirements:

• You will need to load 6 images and present them to the user (see documentation below for the endpoint that should return random images)
• The app should require the user to select images with "Pies" in them.
• When a user selects an image you should confirm if the image has pies using the clarifai API (look at the documentation below)
• When the user selects an image with a pie, that image should be removed and it should present a new one, until the user has selected 3 pies.
• Once the user selects 3 pies, a message should be presented stating that the user was validated, showing the three valid pie images.

External Resources:

Use the following endpoint to receive a random image as a response:

Endpoint: https://xtima6ctq9.execute-api.us-east-1.amazonaws.com/dev/

Response:

{
  "imageUrl": "https://picsum.photos/id/201/200/200"
}

Clarifai API, this api allows you to validate the content from an image

Credentials:

• API Key: 10a253b5940d49eab778ec456dff4a55

Endpoint: https://api.clarifai.com/v2/models/bd367be194cf45149e75f01d59f77ba7/outputs

Method: POST

Request Body:

{
  inputs: [
    {
      data: {
        image: {
          url: imageUrl
        }
      }
    }
  ]
}

Request Headers:

• Content type: application/json
• Authorization: "Key {{API Key goes here}}"

Cache Settings:

• cache: "no-cache"

Example Response:

{
    "status": {
        "code": 10000,
        "description": "Ok",
        "req_id": "0ca37b9f1610c790decccd1e44e15dff"
    },
    "outputs": [
        {
            "id": "c0ef9f0612cd42fa9aab631f2c2e2d19",
            "data": {
                "concepts": [
                    {
                        "id": "ai_kTsPMX36",
                        "name": "wine",
                        "value": 0.91680574,
                        "app_id": "main"
                    }
                ]
            }
        }
    ]
}