Skip to content

Latest commit

 

History

History
101 lines (65 loc) · 4.56 KB

README.md

File metadata and controls

101 lines (65 loc) · 4.56 KB
Raw

Face Recognition

⏲️ est. time to complete: 30 min. ⏲️

Here is what you will learn 🎯

In this challenge you will learn how to:

  • how to create a Face API service in Azure
  • how to connect you Face API service with your App
  • how to pass the API key to you App using GitHub Secrets
  • how to take a selfie 😉

API - Application Programming Interface: A software intermediary that allows two applications to talk to each other

Further informative resources:

Table of contents

Getting started

The first step in creating our Face API is to create a new resource.

Azure Resource: In Azure, the term resource refers to an entity managed by Azure. For example, virtual machines, virtual networks, and storage accounts are all referred to as Azure resources.

  • Click the + Create a resource on the home page
  • Pick the category "AI + Machine Learning"
  • Create a Face service.

Create Face Cognitive Service

  • Choose your Subscription
  • Choose your Resource Group (A storage for multiple resources)
  • Choose West Europe as Region (Location of datacenter where the service is deployed)
  • Create a unique name and select the Standard S0 Pricing Tier.
  • Hit Review + create and than Create

Integrate Face Service Credential into GitHub Secrets

The API key is a unique identifier, which we will add to our code. By doing so, we can connect our code to the API and perform API calls.

  • Navigate to the Face service in the Azure portal and there to Keys and Endpoint
  • Copy the Endpoint and the Key into a notepad.

In Action Secrets you can store encrypted variables that you create in an organization, repository, or repository environment. These secrets are available to use in GitHub Actions workflows.

  • Navigate to your GitHub repository's Settings, then to Secrets and Actions

  • Click on New repository secret

  • Set the name to VUE_APP_FACE_API_ENDPOINT

  • Set the value to your FACE service's endpoint: https://xxxxxxx.cognitiveservices.azure.com/

  • Add the secret

  • Create another New repository secret

  • Set the name to VUE_APP_FACE_API_KEY

  • Set the value to your FACE service's key that should be a string of letters and numbers.

  • Add the secret

Run Frontend Pipeline again

  • Navigate to Actions, than to your pages workflow and hit run workflow.

  • Wait a moment for your workflow to run and your changes to kick in. Click on the frontend link displayed under the deploy step under your pipeline https://<yourGithubHandle>.github.io/... or restart the App on your phone.

Our frontend application should now have a new button with a selfie 🤩 symbol that allows us to take selfies and estimate how old we are. These selfies will not be saved and will not appear on the timeline or News Feed.

Take Selfies! How old are you really? Play around!

So go ahead and take at least 5 selfies and tell us how old you are in all of them.

Take also pictures of people who are around you and estimate their age, you might surprise them. 😁

That's a wrap for today! Congrats! 🥳🙏

Now we will make our app understand when we talk 🗣️ to our Milligram Social Media App.

Overcharged? We got you covered

Ask your coach if you did not succeed. We have you covered with a back up. ⚠️

Use prepared Milligram Backend Service

Look at the prepared application with our pictures for you to play around Milligram.

Tipps 📝

◀ Previous challenge | 🔼 Home | Next challenge ▶