<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: 'Tunde Yusuf</title>
    <description>The latest articles on DEV Community by 'Tunde Yusuf (@iamtunde).</description>
    <link>https://dev.to/iamtunde</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F835612%2F8944c195-b382-491e-83e6-c53f411631a2.jpeg</url>
      <title>DEV Community: 'Tunde Yusuf</title>
      <link>https://dev.to/iamtunde</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/iamtunde"/>
    <language>en</language>
    <item>
      <title>Setting up Radius AuthX for Password-less user onboarding.</title>
      <dc:creator>'Tunde Yusuf</dc:creator>
      <pubDate>Thu, 24 Mar 2022 08:10:03 +0000</pubDate>
      <link>https://dev.to/iamtunde/setting-up-radius-authx-for-password-less-user-onboarding-53d1</link>
      <guid>https://dev.to/iamtunde/setting-up-radius-authx-for-password-less-user-onboarding-53d1</guid>
      <description>&lt;p&gt;Hello friends, Today will show how to setup a password-less authentication without having to build an authentication feature into your application with Radius AuthX.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://authx.radius.africa/"&gt;AuthX&lt;/a&gt; is an O-auth2 provider developed by &lt;a href="https://radius.africa/"&gt;Radius Africa&lt;/a&gt;, It is a service that allows engineers onboard users without having to setup the entire onboarding suite which includes; Authentication and KYC.&lt;/p&gt;

&lt;h2&gt;
  
  
  Getting Started
&lt;/h2&gt;

&lt;p&gt;To get started, we will need the following.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;A Radius AuthX account, you can sign up here - 
&lt;a href="https://dashboard.radius.africa/register"&gt;https://dashboard.radius.africa/register&lt;/a&gt;.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Creating an AuthX app
&lt;/h2&gt;

&lt;p&gt;Once an account is created and activated on &lt;a href="https://dashboard.radius.africa/register"&gt;Radius&lt;/a&gt;. what to do next is to create an AuthX app, an AuthX app is basically designing an authentication form, customizable to meet the requirements of our app's user onboarding process.&lt;/p&gt;

&lt;p&gt;To do this you will have to login to our dashboard.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ob2wvNuA--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wrs9ojvovhshhplcvsco.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ob2wvNuA--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wrs9ojvovhshhplcvsco.png" alt="Radius AuthX Login Screen" width="880" height="857"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;After supplying your login details, hit the login button and your will be presented to your dashboard, On the dashboard by the side menu you will locate the AuthX section, click on it to view start creating apps.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--05nucsW8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3szu4vrwzrsvt6dlzkwb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--05nucsW8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3szu4vrwzrsvt6dlzkwb.png" alt="Radius AuthX dashboard" width="880" height="366"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;On the AuthX page, you will see a list of already created apps you can also find the &lt;strong&gt;Add New&lt;/strong&gt; button, clicking on will present you a page with forms to start designing.&lt;/p&gt;

&lt;p&gt;Provide the necessary data for the form such as Name, Description, Company Name and Color theme for app personalization.&lt;/p&gt;

&lt;p&gt;The verification section of the form is where you specify a unique identifier for your app on-boarding, you can choose between Usernames or Email address.&lt;br&gt;
For passwords, you can configure the validation strength of user input upon sign up.&lt;br&gt;
Alternatively, you can activate social sign on with Gmail or Facebook by toggling the options.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--AV8LYCfn--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wb0rybw998j5pk85x629.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--AV8LYCfn--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wb0rybw998j5pk85x629.png" alt="AuthX Verification" width="880" height="464"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Also, you can create additional fields of your choice depending on the onboarding requirement of your application.&lt;/p&gt;

&lt;p&gt;In the Development section, you are to provide an hosted URL, AuthX will then make requests to the URL and also redirect to the URL supplied in the Redirect URL field upon user authentication success and or failures.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;NOTE:&lt;/strong&gt; The URL to supply in the above fields must be live/hosted valid URLs, you can setup a netlify or heroku app URLs if you don't have a domain for your app yet. However if your application is an SPA (Single Page Application) There is no need to provide a redirect URL, you only need to let AuthX know by toggling the SPA option.&lt;/p&gt;

&lt;p&gt;For extra security and user data protection, you can also setup a 2FA for either signup or login scenarios, hit the save button to finish your customization.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--CtlTJWzi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4w0zbjcqjpvocsj51uso.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--CtlTJWzi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4w0zbjcqjpvocsj51uso.png" alt="AuthX Security and 2FA" width="880" height="451"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;AuthX will then generate necessary credentials for your form integration as well as a javascript embeddable code for you to copy and paste in your application.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Copy and save these keys in a safe place.&lt;/strong&gt;&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--8QpFbfXj--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s11hla3vn8shulm9qgpu.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--8QpFbfXj--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s11hla3vn8shulm9qgpu.png" alt="AuthX Credentials" width="880" height="449"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Once you have your configuration saved, an option for you to get embeddable code will be available click on it to see your code.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--FlT8NwVo--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/piur711qkensj3mchv7r.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--FlT8NwVo--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/piur711qkensj3mchv7r.png" alt="AuthX Preview embeddable code" width="880" height="866"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You also get a preview of the form before you integrate the customized form on your app.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--K56VqDOV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6tilswmyn580jc8ftt3.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--K56VqDOV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6tilswmyn580jc8ftt3.png" alt="AuthX form preview" width="880" height="873"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;There you have it, you have just AuthXed like a Pro!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--FzcXuB02--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6a7wa0ifom3an2p30jn.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--FzcXuB02--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6a7wa0ifom3an2p30jn.gif" alt="Daniel Craig 007 Credit: Giphy.com" width="480" height="270"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You can explore more on AuthX by going through the API documentation here - &lt;a href="https://documenter.getpostman.com/view/15324321/TzJoDLJB"&gt;https://documenter.getpostman.com/view/15324321/TzJoDLJB&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Important to Note
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Additional Fields on forms can not be edited.&lt;/li&gt;
&lt;li&gt;URL supplied must be a live/hosted URL.&lt;/li&gt;
&lt;li&gt;You can not re-use the same URL in a different AuthX app.&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>oauth</category>
      <category>javascript</category>
      <category>webdev</category>
      <category>tutorial</category>
    </item>
  </channel>
</rss>
