Integrate Initials Authentication with airSlate SignNow

Integrate initials authentication

>> Hi, everyone. My name is Simona Cotin and I'm a Web Developer here at Microsoft. In this video, I'm going to show you how to add authentication to a web application. Azure Static Web Apps manages authentication, which is the process of verifying the user's identity out-of-the-box. By default, you have access to a series of pre-configured authentication providers or the option to register a custom provider. The pre-configured ones include Twitter, GitHub, and Azure Active Directory. To implement a full authentication workflow in our Static Web App, we can use a set of system endpoints that will enable us to add functionality like login, logout, as well as retrieve authentication related to user information. Let's go ahead and implement and use some of these endpoints in our application. As you can see here, I have my application running in my local environment. If you haven't already, I highly recommend you check out the previous videos where you can learn how to set up this application, as well as how to setup the Azure Static Web Apps CLI in your local environment. Throughout this video, I'm actually going to go step-by-step through one of the Microsoft Learn modules that we have available, which is authenticate users with Azure Static Web Apps. Here you can see that you have the instructions to run your application in your local, and one of the first things that we're going to do is really get the user login status. We do that by making a query to one of the system endpoints that I mentioned earlier, which is /.auth./me in our client application, and in our case that's a React application. Let's go ahead and edit the Navbar component, and I'm going to copy and paste the code here. So going into VS Code, opening the Navbar component. At the top of the function, I'm going to paste in this code. We also need to make sure that we import use state and use effect, which will help us to store our user information into the state. You can see here that we are fetching information from the system endpoint that allows us to retrieve that information and then we store it in our component state. We also want to add the login and logout buttons. But before we do that, I mentioned that we have a couple of providers that are configured by default. Those are Twitter, GitHub, and Azure Active Directory. Let's go ahead and copy this providers array and paste it at the top of our function. With Azure Static Web Apps, we also have the option of specifying or redirect URL once the login and logout actions are being completed. We want that redirect to have to be back to the page, the current page where we are at. I'm going to define a variable here called redirect, which is going to retrieve the current path. Then let's go and add our login and logout buttons. You can see...