{"componentChunkName":"component---src-templates-blog-list-template-js","path":"/87","result":{"data":{"allMarkdownRemark":{"edges":[{"node":{"excerpt":"Hello Guys!!!, today we will be implemented the authentication in the Angular 2+ application within 5 mins using LoginRadius. Configuring…","fields":{"slug":"/engineering/implementing-authentication-in-angular-2-plus-with-loginradius-cli/"},"html":"<p>Hello Guys!!!, today we will be implemented the authentication in the Angular 2+ application within 5 mins using <a href=\"https://accounts.loginradius.com/auth.aspx?return_url=https://dashboard.loginradius.com/login\">LoginRadius</a>.</p>\n<h2 id=\"configuring-loginradius\" style=\"position:relative;\"><a href=\"#configuring-loginradius\" aria-label=\"configuring loginradius permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Configuring LoginRadius</h2>\n<p>To implement authentication in the angular app first let's start with registering in the Loginradius and creating the application using <a href=\"https://github.com/LoginRadius/lr-cli\">LoginRadius CLI</a>.</p>\n<h3 id=\"why-loginradius-cli\" style=\"position:relative;\"><a href=\"#why-loginradius-cli\" aria-label=\"why loginradius cli permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Why LoginRadius CLI</h3>\n<p>Developer Experience plays a crucial role for us. We always think about the ways we can minimize the juggling between a quickstart tutorial, dashboard, and terminal. The LoginRadius CLI will simplify your flow by just using some simple commands to register, create an application, log in, etc., and enables you to get the job done in very little time without leaving the terminal.</p>\n<h3 id=\"loginradius-cli-setup\" style=\"position:relative;\"><a href=\"#loginradius-cli-setup\" aria-label=\"loginradius cli setup permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>LoginRadius CLI Setup</h3>\n<h4 id=\"mac-or-linux\" style=\"position:relative;\"><a href=\"#mac-or-linux\" aria-label=\"mac or linux permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Mac or Linux</h4>\n<ul>\n<li>\n<p>Install the tap via:</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"sh\" data-index=\"0\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk1\">$ brew tap loginradius/tap</span></span></code></pre>\n</li>\n<li>\n<p>Then, you can install LR CLI via:</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"sh\" data-index=\"1\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk1\">$ brew install lr</span></span></code></pre>\n</li>\n</ul>\n<h4 id=\"other-platforms\" style=\"position:relative;\"><a href=\"#other-platforms\" aria-label=\"other platforms permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Other Platforms</h4>\n<ul>\n<li>Download packaged binaries from the <a href=\"https://github.com/loginradius/lr-cli/releases/latest\">release page</a>.</li>\n</ul>\n<p>After installing the CLI, you can register into the LoginRadius via the below command.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"sh\" data-index=\"2\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk1\">$ lr register</span></span></code></pre>\n<p>This command will open the Loginradius in the browser to register yourself and create the app.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 60.92307692307693%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAABYlAAAWJQFJUiTwAAACC0lEQVQoz5WSW3PSUBRGU6fVUq3UC7XaqSjXpNxSLJdgCgFpba2X6tjfruNTI0P70IEmBEwQyOc+J8BAeTIz3+zkkLOy9uYIudwbKOUaKlodZUpa3kc0nkBMTFISSKZkpDNZXkUpuRBpN4WMTAxFRS6vQPCLKu6HC3gQLcIfL8EvvsWGpNKzghd7dfz4+QvNZhO6/hsXF/o0uk5V92qj0cDl5RWvwqpUxZZyBr98jDsxDcuvi1gJl7D0qoDA3hFsp4//uYSHyRoi2jmi2ncE1W94WfyIncIpnmTq2CSgYVr8xeFwCNPqon1jwrYdvua6Ls9oNJpG8Cc0hNQviJS/Ikw1pJ5hM3uEtfgBBzLIZHPLMHF13UK7Y8H+O8BgQKEPeb977wjruxVs50/J7BMep9/BF1NxL1Lird8Gts0umtc3ZN2BSVDDNGF1e3O2go9MtvaPeatPqU1mxrISUuaAI0+B3zuOjX7fm61LbbrjdQ8YO0BQ+Qyxes7nxuyY5XJo0XA43mx2OuiSGV+jlueAzOZ57oQbbuc/YCNZBRvDXQIHbgEng+/ZffT+2NPnOeC6VKGNh2B/zqNUjYfNkoGfZd/PAXnrBHDoKLHjxO5n58ePDQMyM9YuqwzGoDsFz9joWDObFs+dO7M4nqFKdlXPjLJGH/BJGpaCeQTkwwXDic1kBOwyDAOtVovf/wOvtKhoUmY20gAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Register Page\"\n        title=\"Register Page\"\n        src=\"/static/f7b929e780c62f831dea548530d792e3/e5715/resgister_page.png\"\n        srcset=\"/static/f7b929e780c62f831dea548530d792e3/a6d36/resgister_page.png 650w,\n/static/f7b929e780c62f831dea548530d792e3/e5715/resgister_page.png 768w,\n/static/f7b929e780c62f831dea548530d792e3/d9ed5/resgister_page.png 2880w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p>Once you successfully register you will be able to see the below message on the browser, you can close the tab and come back to the CLI.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"\" data-index=\"3\"><code class=\"grvsc-code\"><span class=\"grvsc-line\">You are Successfully Authenticated, Kindly Close this browser window and go back to CLI.</span></code></pre>\n<h3 id=\"get-your-application-api-credentials\" style=\"position:relative;\"><a href=\"#get-your-application-api-credentials\" aria-label=\"get your application api credentials permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Get Your Application API Credentials</h3>\n<p>Once you <strong>login/register</strong> using the CLI, You can now run the <code>lr get config</code> command to get your API credentials. </p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 40%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAICAYAAAD5nd/tAAAACXBIWXMAABYlAAAWJQFJUiTwAAABXElEQVQoz53RzU6DQBAH8Nldln7AQoECBSytHH0SD8Z69QX06NdRjc9h4tFEX8hUW6LWlgVLfAeHBpPG9NTDLzPZ2fknmwUAiAkhh5TSEfZHWxjVDlAIGHbSarU+hBBjxtgrHq4bm6Y5CYIg9Txvqmna27/56g56QRN0jOAKvdfD6X+KoqRcVVOF8xRfkW66s7Z7WgVeswbLFE2dNTqtBReNRds1MqrSBc6+1sw3+Jt9ohk6qwJvhRV+u70k88OksL24cPpJ4WDVhZvrvU7O/SgnwpZWsylF1M3bjpG3vU5uh26hMTWrw6rgiyrwRtcj6ZjDedeIpaFHma4HmeMMpIU6cVeq/USy4V6u2n7m2pa0dwNp7LjSGvjSilHozgVvVoHnVeAdAPnBz8kJoUvsS+wRXQECCCtXS6CsJABLqmClpISq56xkXCkoENyFS6i//gE9ouctPNW792j/F0p7gNt6dwoRAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"LoginRadius CLI Get Config\"\n        title=\"LoginRadius CLI Get Config\"\n        src=\"/static/a473438676d4734d4d95e8b084db1f16/e5715/lr_get_config.png\"\n        srcset=\"/static/a473438676d4734d4d95e8b084db1f16/a6d36/lr_get_config.png 650w,\n/static/a473438676d4734d4d95e8b084db1f16/e5715/lr_get_config.png 768w,\n/static/a473438676d4734d4d95e8b084db1f16/dd104/lr_get_config.png 1064w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<h3 id=\"configuring-callback-urls\" style=\"position:relative;\"><a href=\"#configuring-callback-urls\" aria-label=\"configuring callback urls permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Configuring Callback URLs</h3>\n<p>A callback URL is a URL in your application where LoginRadius redirects the user after they have authenticated. The callback URL for your app must be added to your Application Configuration. If this field is not set, users will be unable to log in to the application and get an error.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 49.69230769230769%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAYAAAC0VX7mAAAACXBIWXMAABYlAAAWJQFJUiTwAAABR0lEQVQoz62S23KCMBCGef/H6sFqKVwiAiYBZMLBKiDi2b/ZbR31qnWmO/Oxm+zkzy5Za7fboWlatG2LruvY13Vt9hpQ7ng8/onD4cBYdKjIC8zncyyXtfGfmM1mzGazwSPGgvTReQ6lFGIVI0lSLBYLhi4jO5/Pd/7ObvZYcL/fI0lTBEGAMAgRhiHKskJVVVwhiVzaOp1Ov7ZtUdC2DbeYGuE4jploOoWUEuPxmC9TUsH3fc4J8Z2TQnIRQgh0qxWLWnRrURRwHAe2bWM0smG/O3A+XDw/veLF4JrYdVwMBm/cQa419A+5zvl83/dXwbIsMRyODEMEkxDK1xBexkhPQ4kEE1MlVRVFETzP46qCYGIIkcQJ/x4WpL5pRLIs40ehken7NdbrznDrr1A1t2satztBek16HIq32y0nH+Vy3roM5H/xBU+R+aSCVKLIAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Whitelist domain error\"\n        title=\"Whitelist domain error\"\n        src=\"/static/d1d9601855b3d84f38f961c307c7958b/e5715/whitelist_domain_error.png\"\n        srcset=\"/static/d1d9601855b3d84f38f961c307c7958b/a6d36/whitelist_domain_error.png 650w,\n/static/d1d9601855b3d84f38f961c307c7958b/e5715/whitelist_domain_error.png 768w,\n/static/d1d9601855b3d84f38f961c307c7958b/00172/whitelist_domain_error.png 1044w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p>To get the list of whitelisted domains, you can run <code>lr get domain</code> command from the cmd prompt. And to add a domain in the list using <code>lr add domain</code> command. </p>\n<blockquote>\n<p>If you are following this tutorial, you should set the  <code>http://localhost</code> as a whitelisted domain. Check the below image for how to add the domain using LoginRadius CLI.</p>\n</blockquote>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 45.230769230769226%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAABYlAAAWJQFJUiTwAAABWElEQVQoz53RzU7CQBAH8G1pAt1+7G4XSlkggBAS44PwDqAXvXtEnsI7B9/LQAXB7m6rL+G0WY0hHtDDL5NOd/6dtgghNLJte16r1RaWZV3D9c0flTMLMC+zEITcua57CIJg4zjOFpoby0KbspYIIS9CiF2r1drBmfSrf+IZ7MEtQPcgNc3tKdg8hQdV4E22v50xs6nJQst63c6w5xwi1pCM1mVX+ApjJ4N7b2fam7osA1dJSPQkbsu4Geq4RfJOQnJKPe37nobPUVKEBhp7rg5DX9u2JWEu++Fg6qoK5ATrXptkgz7NhwOaT8e84AzrbjvMry7jYthj+SQWhWA8Z4zkTU4rGDcUzMvTwIcmd6UQ/nE6Znp8QXU/pmoUxYoFnkwSpjtJpFkQKOJ7EjZUUUQU51QxFlbgx75CzvF7Q/ABNCjAe8ky9UzaZFSBM/AI1uDpn9YmY/YJItCUJ5C8j5gAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"LoginRadius CLI Add Domain\"\n        title=\"LoginRadius CLI Add Domain\"\n        src=\"/static/8473d7ec2aa6a7836c5d621070194fc5/e5715/lr_add_domain.png\"\n        srcset=\"/static/8473d7ec2aa6a7836c5d621070194fc5/a6d36/lr_add_domain.png 650w,\n/static/8473d7ec2aa6a7836c5d621070194fc5/e5715/lr_add_domain.png 768w,\n/static/8473d7ec2aa6a7836c5d621070194fc5/1ff84/lr_add_domain.png 1040w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<h3 id=\"setup-angular-application\" style=\"position:relative;\"><a href=\"#setup-angular-application\" aria-label=\"setup angular application permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Setup Angular application</h3>\n<p>You can implement the LoginRadius authentication in your existing Angular application, or you can start from scratch by following <a href=\"https://angular.io/guide/setup-local\">this tutorial</a>.</p>\n<blockquote>\n<p>You need to enable the routing for this tutorial if you are not aware of how to enable routing in the angular application, kindly follow <a href=\"https://angular.io/guide/router\">this tutorial</a></p>\n</blockquote>\n<ul>\n<li>\n<p>Create <code>src/app/config.ts</code> and add the below application configuration</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"4\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk12\">config</span><span class=\"mtk1\"> = {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">APP_NAME:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;&lt;&lt;Your App Name&gt;&gt;&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">API_KEY:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;&lt;&lt;Your API Key&gt;&gt;&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">};</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk15\">default</span><span class=\"mtk1\"> </span><span class=\"mtk12\">config</span><span class=\"mtk1\">;</span></span></code></pre>\n</li>\n</ul>\n<h3 id=\"add-login-to-your-application\" style=\"position:relative;\"><a href=\"#add-login-to-your-application\" aria-label=\"add login to your application permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Add Login to Your Application</h3>\n<p>If you have already created the login component, add the following code in the <code>.ts</code> file else, generate the login component using ng CLI <code>ng generate component login</code>. Which will create a component inside the <code>app</code> folder. Add the following code to the <code>login.component.ts</code></p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"5\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Component</span><span class=\"mtk1\">, </span><span class=\"mtk12\">OnInit</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/core&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">ActivatedRoute</span><span class=\"mtk1\">, </span><span class=\"mtk12\">Router</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/router&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">config</span><span class=\"mtk1\"> </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;../config&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">@</span><span class=\"mtk11\">Component</span><span class=\"mtk1\">({</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">selector:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;app-login&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">templateUrl:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./login.component.html&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">styleUrls:</span><span class=\"mtk1\"> [</span><span class=\"mtk8\">&#39;./login.component.scss&#39;</span><span class=\"mtk1\">],</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">})</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">LoginComponent</span><span class=\"mtk1\"> </span><span class=\"mtk4\">implements</span><span class=\"mtk1\"> </span><span class=\"mtk10\">OnInit</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk4\">constructor</span><span class=\"mtk1\">(</span><span class=\"mtk4\">private</span><span class=\"mtk1\"> </span><span class=\"mtk12\">route</span><span class=\"mtk1\">: </span><span class=\"mtk10\">ActivatedRoute</span><span class=\"mtk1\">, </span><span class=\"mtk4\">private</span><span class=\"mtk1\"> </span><span class=\"mtk12\">router</span><span class=\"mtk1\">: </span><span class=\"mtk10\">Router</span><span class=\"mtk1\">) {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">route</span><span class=\"mtk1\">.</span><span class=\"mtk12\">queryParams</span><span class=\"mtk1\">.</span><span class=\"mtk11\">subscribe</span><span class=\"mtk1\">((</span><span class=\"mtk12\">params</span><span class=\"mtk1\">) </span><span class=\"mtk4\">=&gt;</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk15\">if</span><span class=\"mtk1\"> (</span><span class=\"mtk12\">params</span><span class=\"mtk1\">.</span><span class=\"mtk12\">token</span><span class=\"mtk1\"> || </span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">getItem</span><span class=\"mtk1\">(</span><span class=\"mtk8\">&#39;token&#39;</span><span class=\"mtk1\">)) {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">setItem</span><span class=\"mtk1\">(</span><span class=\"mtk8\">&#39;token&#39;</span><span class=\"mtk1\">, </span><span class=\"mtk12\">params</span><span class=\"mtk1\">.</span><span class=\"mtk12\">token</span><span class=\"mtk1\">);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">router</span><span class=\"mtk1\">.</span><span class=\"mtk11\">navigate</span><span class=\"mtk1\">([</span><span class=\"mtk8\">&#39;/profile&#39;</span><span class=\"mtk1\">]);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      } </span><span class=\"mtk15\">else</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk12\">window</span><span class=\"mtk1\">.</span><span class=\"mtk12\">location</span><span class=\"mtk1\">.</span><span class=\"mtk12\">href</span><span class=\"mtk1\"> = </span><span class=\"mtk8\">`https://</span><span class=\"mtk4\">${</span><span class=\"mtk12\">config</span><span class=\"mtk1\">.</span><span class=\"mtk12\">APP_NAME</span><span class=\"mtk4\">}</span><span class=\"mtk8\">.hub.loginradius.com/auth.aspx?return_url=</span><span class=\"mtk4\">${</span><span class=\"mtk12\">window</span><span class=\"mtk1\">.</span><span class=\"mtk12\">location</span><span class=\"mtk1\">.</span><span class=\"mtk12\">origin</span><span class=\"mtk4\">}</span><span class=\"mtk8\">/login`</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    });</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">ngOnInit</span><span class=\"mtk1\">(): </span><span class=\"mtk10\">void</span><span class=\"mtk1\"> {}</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">}</span></span></code></pre>\n<p>Here we are redirecting the application to the <strong>LoginRadius Auth Page</strong> where we are passing the <code>return_url</code> as the current origin, so after successful login, the <strong>LoginRadius Auth Page</strong> will redirect to the angular application with <code>token</code> as a query param. Later we will use <code>token</code> for all the user-related actions.</p>\n<h3 id=\"add-profile-page\" style=\"position:relative;\"><a href=\"#add-profile-page\" aria-label=\"add profile page permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Add Profile Page</h3>\n<p>As you have seen in the above code on successful login, we redirect to <code>/profile</code> page. So let us create a <strong>profile</strong> component using <code>ng</code> CLI <code>ng generate component profile</code>.\nAnd let's modify the <code>profile.component.ts</code> file in the <code>app/profile</code> folder generated by ng CLI.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"6\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Component</span><span class=\"mtk1\">, </span><span class=\"mtk12\">OnInit</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/core&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Router</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/router&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">config</span><span class=\"mtk1\"> </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;../config&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">ProfileService</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;../profile.service&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Profile</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./profile&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">@</span><span class=\"mtk11\">Component</span><span class=\"mtk1\">({</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">selector:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;app-profile&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">templateUrl:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./profile.component.html&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">styleUrls:</span><span class=\"mtk1\"> [</span><span class=\"mtk8\">&#39;./profile.component.scss&#39;</span><span class=\"mtk1\">],</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">})</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">ProfileComponent</span><span class=\"mtk1\"> </span><span class=\"mtk4\">implements</span><span class=\"mtk1\"> </span><span class=\"mtk10\">OnInit</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">profile</span><span class=\"mtk1\">: </span><span class=\"mtk10\">Profile</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">loginRadius</span><span class=\"mtk1\">: </span><span class=\"mtk10\">any</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk4\">constructor</span><span class=\"mtk1\">(</span><span class=\"mtk4\">private</span><span class=\"mtk1\"> </span><span class=\"mtk12\">configService</span><span class=\"mtk1\">: </span><span class=\"mtk10\">ProfileService</span><span class=\"mtk1\">, </span><span class=\"mtk4\">private</span><span class=\"mtk1\"> </span><span class=\"mtk12\">router</span><span class=\"mtk1\">: </span><span class=\"mtk10\">Router</span><span class=\"mtk1\">) {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk12\">token</span><span class=\"mtk1\"> = </span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">getItem</span><span class=\"mtk1\">(</span><span class=\"mtk8\">&#39;token&#39;</span><span class=\"mtk1\">);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">ngOnInit</span><span class=\"mtk1\">(): </span><span class=\"mtk10\">void</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">configService</span><span class=\"mtk1\">.</span><span class=\"mtk11\">getProfile</span><span class=\"mtk1\">().</span><span class=\"mtk11\">subscribe</span><span class=\"mtk1\">(</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      (</span><span class=\"mtk12\">data</span><span class=\"mtk1\">: </span><span class=\"mtk10\">Profile</span><span class=\"mtk1\">) </span><span class=\"mtk4\">=&gt;</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">profile</span><span class=\"mtk1\"> = { ...</span><span class=\"mtk12\">data</span><span class=\"mtk1\"> };</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      },</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      (</span><span class=\"mtk12\">err</span><span class=\"mtk1\">: </span><span class=\"mtk10\">any</span><span class=\"mtk1\">) </span><span class=\"mtk4\">=&gt;</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk15\">if</span><span class=\"mtk1\"> (</span><span class=\"mtk12\">err</span><span class=\"mtk1\">.</span><span class=\"mtk12\">status</span><span class=\"mtk1\"> === </span><span class=\"mtk7\">403</span><span class=\"mtk1\">) {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          </span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">removeItem</span><span class=\"mtk1\">(</span><span class=\"mtk8\">&#39;token&#39;</span><span class=\"mtk1\">);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">router</span><span class=\"mtk1\">.</span><span class=\"mtk11\">navigate</span><span class=\"mtk1\">([</span><span class=\"mtk8\">&#39;login&#39;</span><span class=\"mtk1\">]);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    );</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">logout</span><span class=\"mtk1\">() {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">removeItem</span><span class=\"mtk1\">(</span><span class=\"mtk8\">&#39;token&#39;</span><span class=\"mtk1\">);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">window</span><span class=\"mtk1\">.</span><span class=\"mtk12\">location</span><span class=\"mtk1\">.</span><span class=\"mtk12\">href</span><span class=\"mtk1\"> = </span><span class=\"mtk8\">`https://</span><span class=\"mtk4\">${</span><span class=\"mtk12\">config</span><span class=\"mtk1\">.</span><span class=\"mtk12\">APP_NAME</span><span class=\"mtk4\">}</span><span class=\"mtk8\">.hub.loginradius.com/auth.aspx?action=logout`</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">}</span></span></code></pre>\n<p>Similary add the below code to <code>profile.component.html</code> file.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"html\" data-index=\"7\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">div</span><span class=\"mtk1\"> </span><span class=\"mtk12\">class</span><span class=\"mtk1\">=</span><span class=\"mtk8\">&quot;container&quot;</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">h1</span><span class=\"mtk17\">&gt;</span><span class=\"mtk1\">Hello </span><span class=\"mtk4\">{</span><span class=\"mtk1\">{ profile?.Email</span><span class=\"mtk12\">[</span><span class=\"mtk7\">0</span><span class=\"mtk12\">]?.Value }}&lt;/h1&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk12\">  &lt;button (click)=&quot;logout()&quot;&gt;LogOut&lt;/button&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk12\">&lt;/div&gt;</span></span></code></pre>\n<p>The profile component will call the LoginRadius API to fetch the profile details and store them in the <code>profile</code> variable. Using that <code>profile</code>, we are displaying the email in the HTML.\nIt also has the <code>logout()</code> function where we pass the <code>action=logout</code> in the <strong>LoginRadius Auth Page</strong>, which will help us log out the user.</p>\n<p>In the profile component, you can see the two things are used.</p>\n<ul>\n<li>ProfileService - This is the service to fetch the user profile using the token.</li>\n<li>Profile - The model which will be used to store the profile information.</li>\n</ul>\n<p>You can generate the service in the angular using <code>ng</code> CLI by using this command <code>ng generate service profile</code> which will create <code>profile.service.ts</code> with required configuration. Add the below code in the <code>profile.service.ts</code> file.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"8\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">HttpClient</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/common/http&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Injectable</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/core&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">config</span><span class=\"mtk1\"> </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./config&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Profile</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./profile/profile&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">@</span><span class=\"mtk11\">Injectable</span><span class=\"mtk1\">({</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">providedIn:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;root&#39;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">})</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">ProfileService</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk4\">constructor</span><span class=\"mtk1\">(</span><span class=\"mtk4\">private</span><span class=\"mtk1\"> </span><span class=\"mtk12\">http</span><span class=\"mtk1\">: </span><span class=\"mtk10\">HttpClient</span><span class=\"mtk1\">) {}</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">getProfile</span><span class=\"mtk1\">() {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk3\">// now returns an Observable of Config</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk15\">return</span><span class=\"mtk1\"> </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">http</span><span class=\"mtk1\">.</span><span class=\"mtk11\">get</span><span class=\"mtk1\">&lt;</span><span class=\"mtk10\">Profile</span><span class=\"mtk1\">&gt;(</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk8\">`https://api.loginradius.com/identity/v2/auth/account?access_token=</span><span class=\"mtk4\">${</span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">getItem</span><span class=\"mtk1\">(</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk8\">&#39;token&#39;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      )</span><span class=\"mtk4\">}</span><span class=\"mtk8\">&apikey=</span><span class=\"mtk4\">${</span><span class=\"mtk12\">config</span><span class=\"mtk1\">.</span><span class=\"mtk12\">API_KEY</span><span class=\"mtk4\">}</span><span class=\"mtk8\">`</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    );</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">}</span></span></code></pre>\n<p>We will use the HTTP module to call the Rest API so let's add the <code>HttpClientModule</code> in the  <code>app.module.ts</code> file.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"9\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">HttpClientModule</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/common/http&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">...</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">@</span><span class=\"mtk11\">NgModule</span><span class=\"mtk1\">({</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">imports:</span><span class=\"mtk1\"> [</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    ...</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">HttpClientModule</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    ...</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  ],</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">})</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">AppModule</span><span class=\"mtk1\"> { }</span></span></code></pre>\n<p>Now let's create a <code>Profile</code> model which will be used for storing the user profile. </p>\n<ul>\n<li>\n<p>Add <code>src/app/profile/profile.ts</code></p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"10\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">interface</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Profile</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">Email</span><span class=\"mtk1\">: {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">Type</span><span class=\"mtk1\">: </span><span class=\"mtk10\">string</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">Value</span><span class=\"mtk1\">: </span><span class=\"mtk10\">string</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }[];</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">}</span></span></code></pre>\n</li>\n</ul>\n<h3 id=\"add-routes-for-login-and-profile\" style=\"position:relative;\"><a href=\"#add-routes-for-login-and-profile\" aria-label=\"add routes for login and profile permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Add Routes for Login and profile.</h3>\n<p>Lets modify the <code>app-routing.module.ts</code> and add the below Routes in it.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"11\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">NgModule</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/core&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">RouterModule</span><span class=\"mtk1\">, </span><span class=\"mtk12\">Routes</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/router&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">AppComponent</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./app.component&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">LoginComponent</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./login/login.component&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">ProfileComponent</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./profile/profile.component&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk12\">routes</span><span class=\"mtk1\">: </span><span class=\"mtk10\">Routes</span><span class=\"mtk1\"> = [</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">path:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;login&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">component:</span><span class=\"mtk1\"> </span><span class=\"mtk12\">LoginComponent</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  },</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  { </span><span class=\"mtk12\">path:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;profile&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">component:</span><span class=\"mtk1\"> </span><span class=\"mtk12\">ProfileComponent</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">];</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">@</span><span class=\"mtk11\">NgModule</span><span class=\"mtk1\">({</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">imports:</span><span class=\"mtk1\"> [</span><span class=\"mtk12\">RouterModule</span><span class=\"mtk1\">.</span><span class=\"mtk11\">forRoot</span><span class=\"mtk1\">(</span><span class=\"mtk12\">routes</span><span class=\"mtk1\">)],</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">exports:</span><span class=\"mtk1\"> [</span><span class=\"mtk12\">RouterModule</span><span class=\"mtk1\">]</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">})</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">AppRoutingModule</span><span class=\"mtk1\"> { }</span></span></code></pre>\n<p>Finally, to gather all, we need to modify the <code>app.component.ts</code> and add the routing logic.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"ts\" data-index=\"12\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Component</span><span class=\"mtk1\">, </span><span class=\"mtk12\">OnInit</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/core&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">Router</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;@angular/router&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">@</span><span class=\"mtk11\">Component</span><span class=\"mtk1\">({</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">selector:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;app-root&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">templateUrl:</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./app.component.html&#39;</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">styleUrls:</span><span class=\"mtk1\"> [</span><span class=\"mtk8\">&#39;./app.component.scss&#39;</span><span class=\"mtk1\">],</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">})</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">AppComponent</span><span class=\"mtk1\"> </span><span class=\"mtk4\">implements</span><span class=\"mtk1\"> </span><span class=\"mtk10\">OnInit</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk4\">constructor</span><span class=\"mtk1\">(</span><span class=\"mtk4\">private</span><span class=\"mtk1\"> </span><span class=\"mtk12\">router</span><span class=\"mtk1\">: </span><span class=\"mtk10\">Router</span><span class=\"mtk1\">) {}</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">ngOnInit</span><span class=\"mtk1\">() {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk15\">if</span><span class=\"mtk1\"> (</span><span class=\"mtk12\">window</span><span class=\"mtk1\">.</span><span class=\"mtk12\">location</span><span class=\"mtk1\">.</span><span class=\"mtk12\">pathname</span><span class=\"mtk1\"> === </span><span class=\"mtk8\">&quot;/&quot;</span><span class=\"mtk1\">) {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk15\">if</span><span class=\"mtk1\"> (</span><span class=\"mtk12\">localStorage</span><span class=\"mtk1\">.</span><span class=\"mtk11\">getItem</span><span class=\"mtk1\">(</span><span class=\"mtk8\">&#39;token&#39;</span><span class=\"mtk1\">)) {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">router</span><span class=\"mtk1\">.</span><span class=\"mtk11\">navigate</span><span class=\"mtk1\">([</span><span class=\"mtk8\">&#39;/profile&#39;</span><span class=\"mtk1\">]);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      } </span><span class=\"mtk15\">else</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">router</span><span class=\"mtk1\">.</span><span class=\"mtk11\">navigate</span><span class=\"mtk1\">([</span><span class=\"mtk8\">&#39;/login&#39;</span><span class=\"mtk1\">]);</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  }</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">}</span></span></code></pre>\n<p>And add the <code>router-outlet</code> to the <code>app.component.html</code> file.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"html\" data-index=\"13\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk17\">&lt;</span><span class=\"mtk10\">router-outlet</span><span class=\"mtk17\">&gt;&lt;/</span><span class=\"mtk10\">router-outlet</span><span class=\"mtk17\">&gt;</span></span></code></pre>\n<blockquote>\n<p>You can find the full code in <a href=\"https://github.com/LoginRadius/engineering-blog-samples/tree/master/Angular/angular-authentication-demo\">github</a></p>\n</blockquote>\n<h3 id=\"testing-the-application\" style=\"position:relative;\"><a href=\"#testing-the-application\" aria-label=\"testing the application permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Testing the application</h3>\n<p>Run <code>ng serve</code> to start the local server, and you will be able to see the output on locahost:4200.</p>\n<h3 id=\"adding-login-methods\" style=\"position:relative;\"><a href=\"#adding-login-methods\" aria-label=\"adding login methods permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Adding Login Methods</h3>\n<p>You can configure the LoginRadius Auth Page by adding social login methods like Facebook, Google, etc. To add the login method, you can use the command <code>lr get social</code> and <code>lr add social</code> command. Check the below image on how to add the social configuration.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 37.53846153846154%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAICAYAAAD5nd/tAAAACXBIWXMAABYlAAAWJQFJUiTwAAABQklEQVQoz6XQzVLCMBAA4Py0TZs2bUkbSoGCyMHn8lmcUTz4JjqexIMvo4UkFRnGGX0At9CbcNHDN9tsN5tkEWPsDiF0DW6O4Zwv+krdQt3iVE23v+1ziQihO4qpoZhYSPxCKW1cz2swwUf/dzT4BI9IRHIjmKhj4q4gUTsI7yNFuMYQD9+oJrBG3fqIV/AO7lGpJrsyG5lKDm2RKDvvjZp+UthS5HYiq6ZICzuJlC2j3IZBbKTITRYrEwXCBIzr0I8gl60xxtv9DcdqvJsNz001njfz2UWTJbkp0oHticykkTS9ODMsEYb5vqaEatfxtAcodTSMSzsQPZe1rzo0rJLBdpoU+izMzYBLrYJYD0NppC/a4pXjuGuHuWuYZbvplDewAQ9I8fS7DOVWBLw94eOP2vl9gSeAXsASPP/Dsutz9QNDCI3aHsrqdAAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Added Facebook as an loginmethod\"\n        title=\"Added Facebook as an loginmethod\"\n        src=\"/static/c44f54c8139c16bd211fa090ab6b93ea/e5715/lr_add_social.png\"\n        srcset=\"/static/c44f54c8139c16bd211fa090ab6b93ea/a6d36/lr_add_social.png 650w,\n/static/c44f54c8139c16bd211fa090ab6b93ea/e5715/lr_add_social.png 768w,\n/static/c44f54c8139c16bd211fa090ab6b93ea/161ec/lr_add_social.png 1840w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p>After adding, visit the LoginRadius Auth Page either by visiting <code>locahost:4200</code> and log out. Or using the command <code>lr demo</code>. You will find the new login method added.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 60.92307692307693%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAABYlAAAWJQFJUiTwAAACnklEQVQoz4WSy2tTQRSHr03bPO8jTdKbpEljmmfTtM1NWirtRlEUC0WpDyiIILhx4R/gSleC4KNt2loRKeJKRAVB7F6X6r8giIKK4kJc2ObO52Raq125+HEYZs435/zO0apDFaojNRxnjHpjnNFag3K5QrFQJFdxyIwd+Y8OU5icwTk8x/CBU2ipZIK8TE7GbSzTwuPxkM/uZaJWYej4RcwlgbW4oWQubqIvbGJsx/bZaqu5SXippaI2PDxMKt2vFO6JkMn00xgbp5BJ0js1h7EChoTqTUFkRZC4I7BvC+KrgvCyUHf/SquOjKIbFh2dXkIBP/lclj4JN30eIvtOY0qg2WwRWHAZXHM5+tjl0COX/Q9dyvJsNndLG6k5FAcG8HZ1EwwEiVo6vfEEfb1hUgfPYSyjHhpSUVlhr6wuvOTSPS+Tr7vqo7Yt7ft21OqNBvV6g5yE9qdTxHtM4nactB3GbBxTQEsC/DJx7EGL8+st5p4LpbMvBKU1oaCWhClgIdtPNpPGjvYQMwJUBtIkYhGCmobpzCgPw8suHTdanFmHt1/h5QfBq4+CN58F008Enluu8lMBB9JJ2V5EetZJyOshY0ep5TOUbD+pqdntllvoMtpX31O88prqfSH9E+TvucoCfbtdBXScEQYLeWwrhOHtlNNOkyuVSFp+IhMn1FAMCTQlUL/2Dd/ldwSbEJJT98lW29Pf5aHj1BmSbdtmEMvfRUy2myuX8e/R8Dmzf6e8BJWbn7j07AsXnn4n0tzYrsrdgSngULFANhGVMI/00EdED1Aq5EiZHrzVaeVhe8q6fByb/0ll9QeDd3/JJXbV3rWBf2AKOFqrkZU+xkJdJMNB8hKeStjkYn4Skyd31mYLCr5F8C9uLfvWOoldwN+dzfiSXpmaSgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Added Facebook as an loginmethod\"\n        title=\"Added Facebook as an loginmethod\"\n        src=\"/static/e014560a431f67a5a0ce430d7825c6d3/e5715/add_login_method.png\"\n        srcset=\"/static/e014560a431f67a5a0ce430d7825c6d3/a6d36/add_login_method.png 650w,\n/static/e014560a431f67a5a0ce430d7825c6d3/e5715/add_login_method.png 768w,\n/static/e014560a431f67a5a0ce430d7825c6d3/60708/add_login_method.png 2872w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<h3 id=\"customizing-theme-for-loginradius-auth-page\" style=\"position:relative;\"><a href=\"#customizing-theme-for-loginradius-auth-page\" aria-label=\"customizing theme for loginradius auth page permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Customizing theme for LoginRadius Auth Page</h3>\n<p>LoginRadius Dashboard Support three pre-defined themes for you. You can check out the <a href=\"https://dashboard.loginradius.com/auth-page\">Theme Customization</a> section in the LoginRadius Dashboard for all the customization options available. </p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 55.38461538461539%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAABYlAAAWJQFJUiTwAAACc0lEQVQoz42SS0iUURiG/yKwVKTsIlI2qakppRAm3kfTyjRFsytILlpYWIsIF0Kbglq0CYqgEjNo06JFm26bCFO8NmVkOqM5hjWOM15m/pn/MuPg03FGQzCoA8/5zuXj5fvOeaXNmRVEZRwm3ngCy+gYTqcDRfMhqz58vr+jL0VF03EpOg6nE6vViizLSJsySolMKyIup4qRsXGmp6exTdqZnXPhUTQ8XlXgRfZ48SzhVRQUVQ2iaiqaruHz+5lzuZGi9x0kIqWAHVnlTNjs/BkLfjEtMs//DrfsQdq4t5j1SXkYcioxi5Y/tLfT0dlJu1Xj7TiYbPP0f/rM+85uOnr6edfRhenLVyyKjY/u7/TKI3TNjTDgnsAliwqjRLthu3NJLKihu89EUmIC0THbib0xREwLlDyZJedQORHx6SRkFhIWt4eyk/VcsbRSP3iXR8MvaRx8QKP5IRMzTqQNyfmsMWQFBXv6TWSkJrFlWyxpt4epfQPVz2RKyipIPmDk3OUmohLTKa2p46IQaB5uAx3uW19xwXyPO30TSOHi/dbuEoKFx+nq7ccQu5XwyCjCGl4j3ZQxtvyi+tRZUvKOYKytx7A/n9PnL9FsecrVocd0TQ9xa/Q5TSNtDNgcKwRFhX2mAWrP1FFcVknR0WryGq5zrfUF8z4dt8eDy+0WP7z4qzqKT0MJiPOAGoz+hQCq1xMSXBefTVz2Maw/fhIIiAvhL5+wgq540VQFv7DESoJ+1EP4dbHXQusZYTUpXLzhYoU7heA386gwdsiHk/YpJqccIjqC+1XYl5kKIc7sIl+KTDUSnlqEIbdqteASi4n/YjnvN106qDqKGufBAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Theme Customization\"\n        title=\"Theme Customization\"\n        src=\"/static/d17d37653b8853673b79b8ba5638a4a5/e5715/theme_custom.png\"\n        srcset=\"/static/d17d37653b8853673b79b8ba5638a4a5/a6d36/theme_custom.png 650w,\n/static/d17d37653b8853673b79b8ba5638a4a5/e5715/theme_custom.png 768w,\n/static/d17d37653b8853673b79b8ba5638a4a5/0b569/theme_custom.png 2878w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p>You can also get/set your current theme using LoginRadius CLI by using the commands like <code>lr get theme</code> and <code>lr set theme</code>.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 83.6923076923077%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAARCAYAAADdRIy+AAAACXBIWXMAABYlAAAWJQFJUiTwAAADZUlEQVQ4y12UWXPaVhzFeSugFUmsEkILYhOb2Q1esMc2jhNsJ2kTZ5J43DbpQ9rvk497eq5MU8cPZ5CG0e+ec/733tTy+3fE374h/vsfNL/+heafX9B4+APR/QPqH+/R+PgZ8ecHdPgc/XYH//Yt/OvX8F7ewHuxRW3zErXzK1TX52i8vkOq+eUrjDCEGcdQwjpkP4ASBFB9H3KtBqMewen1YcddmPxfcqqQbariQCrbkEqVRBnTghUPkIoefofc7sAajVEcjVAeT2D2h9C6Axj81VttqPUGF4ugUppQUOeCIVSPC9d8qK6fLJCPhwR+uoczXyK+2KB/do7FdotwdYD66QXKsyW0qAGdwB+gHURxPahVD4pTo1xIxQqsVhep8O4D7OEQ7nwBmy5r0xkK3R4a+0vk6VwlRGNU7YkjAVOqjyARX6lUIRXKMBsdAt9/QGkyR3x2gd7JKfZfbdE+PoXWG9FdM3Gl/RTvGazsQKay+RL7biEV/PoO/nTKqNdoHx0jpNNosUSOMPUJTHkKswmr7GAlO1HWKsIImkj5b96yzBir6xuMzi8g8eMsP9aew/7rizARUd7BRHcy42bNPHJehJR3fcsyW+xshSYlelNEPEoWjp5FFNOUy4+uRG8SowplchZy1ZDAVzfQWKbJbVLkMFrJMLpwBiOEowk0V7j735mIqYiYO2dynrJKyAqg4xN4tUU0W2CyuUTv8Bgzxl5sXqDP5/HxCWq9AULCnXYMr9tH2BuiTjlRC0GHu6G/B68Zw2+2YQmH4ugMD48wPd+gd3CUgHqrQ4zXp+jM92GI6OXHrn5E5ACyJmUUEmcZ3UJayUEruki5Z5cYHBxiKrYNgQNq72iNmJOO9iao011nOkcpbCQweQeUzAIkI58AswRmFB1a3iGQJ2KyPsH+5VXiTMBcRnMZx6S7ND/W2J1WchKgcCYlzvKPIM1EVjWQljSoZgWp6voMHXbYWzEugS266fIo7vG9PZ4hokONg8gIR9bPsOwOlmHcdFaFapSRsldr6NwOhheiEESwagHlc2I1mNx7Je5Febctkr4IyewgGVlPnAn9kpahaAVeDrfveMvMkR+Mef0MYXUGMFuM2+jyKHWg+02YQYvxmzDcCAYnmbMD5MoedA5Bz1ehmzY0g5dDIcC/z6rgYOE1JiEAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Theme Customization CLI\"\n        title=\"Theme Customization CLI\"\n        src=\"/static/ddbce18605c36183916aa2ca85e5cdc4/e5715/theme_cli.png\"\n        srcset=\"/static/ddbce18605c36183916aa2ca85e5cdc4/a6d36/theme_cli.png 650w,\n/static/ddbce18605c36183916aa2ca85e5cdc4/e5715/theme_cli.png 768w,\n/static/ddbce18605c36183916aa2ca85e5cdc4/669eb/theme_cli.png 1244w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<h3 id=\"addingupdating-registeration-schema-for-loginradius-auth-page\" style=\"position:relative;\"><a href=\"#addingupdating-registeration-schema-for-loginradius-auth-page\" aria-label=\"addingupdating registeration schema for loginradius auth page permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Adding/Updating Registeration Schema for LoginRadius Auth Page</h3>\n<p>LoginRadius Auth Page supports 3 predefined fields for LoginRadius Auth Page i.e Email, Password, Confirm Password. With the help of LoginRadius CLI, you can manage the registration schema for your LoginRadius Auth Page. </p>\n<p>Check out the below commands to add the new registration field in your LoginRadius Application. After adding the new schema field you can always check your LoginRadius Auth Page by running <code>lr demo</code> command from the terminal.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 85.38461538461539%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAARCAYAAADdRIy+AAAACXBIWXMAABYlAAAWJQFJUiTwAAADiUlEQVQ4y02UbXOaaBiF+bRVXgV5FVBARAVFTUxM1FhjTJpM29kmfdnMNL+mf/z0QNLd/XBGGJ3rOefc96Nw+usXspcX9H++IH5+RvLjHyTfviP++g3RlyfEfz8i//GM0dfv6D18RPfuAeHxHuHhDsH+iGB3gH91DW+1Qf/TE4Tel0coSR9GXkAfjaBmQyjpAHKcUDGkXgSN36tRAinsQgxCiH4AseND9Hw03Q6k6tO0YZUnEPo8ffB+j9n9A4qbI+L9DaLtDsHpkjpD72wFt5zBm84QLk4RzOYISorvnWKKYFLCiNMaalfA5PEJy7sPmByPaE+msKdTOAQ40xIO3z0+23Tv5BNYwzGMNIPRH8BIUuhxH3pE92EPkuPBKuYEMnKy3mJ4fYP58RYlXaabLYLlCsHJEt3FCTy6CGcLmIMh5G4EhQA56EL2u5A6AZROCMl2YY5LCCMO4Ixx88MNku2WDkto7FGlE6WfQmZ3ShS/gii1EoEKgYofEhZA9tip5cDMJhCGjLz99Bk5e/SXS7SLCTRG0jgYjbG0+HUgai+uYZU7hc5kulIIkl2/lsihmGlOh1yN5e0dTj/cIzk752T7tVTqD0ypYCFhwX8w+Q0mOR3IdgeiYaGdjCCMuWdLdpddbpCuLjjFBXqcppmNXkF/nL3BlP87q2FerQpoRBmE7ONnFNsrulshnC+gVxNkfxVI+rd4lk6IVEXjNMUKYLloth00DbtWQzNgdFMI0e09svMLzDnlMadd7ZfPqXrjAiH3rDMq4GVjODzETgbw+ez1M7h89iiXa+P0Ehg8rOXHEILdNYr1poZVi6q/7ZfGmDr70+lUZ38a3Wp02qJjjW41AjRG1uhWtTxIuomWF/HqvT8gv7jEfH/AyfUBId3Z3LfKmcyVaNpvESmpkulAZFSRMUXdQrNloqm10VBaaDldRiZwuDzHYk+nHMyQXUa8Wl269Yc5OoMRHEZr0V2DxTepBiENQt6pBt4pOhpyC381FWhWACHmv8WEoOnmCovdHuX6itqil/Oe0mWXivMSAcEe72yH8qv+2JvP/rwwruXwQN0K6XC9Q879Ky7WKC+3GNPtdLVGXJRIJzO0/R6M6sduUHelmi7lQGFklVLotpJMp6ruQgh3N9DTIYysuvgjXnxe/oSKBmhTKoGKy91zeGdt7p7J3Wu7kA0HUsuGpFmQlDZESYduBPgNKCfc/pZ3JFwAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Registration Schema LoginRadius CLI\"\n        title=\"Registration Schema LoginRadius CLI\"\n        src=\"/static/ed279d6255a3f75727dc0bb5c05069e0/e5715/registration_schema.png\"\n        srcset=\"/static/ed279d6255a3f75727dc0bb5c05069e0/a6d36/registration_schema.png 650w,\n/static/ed279d6255a3f75727dc0bb5c05069e0/e5715/registration_schema.png 768w,\n/static/ed279d6255a3f75727dc0bb5c05069e0/161ec/registration_schema.png 1840w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<h3 id=\"loginradius-site-management\" style=\"position:relative;\"><a href=\"#loginradius-site-management\" aria-label=\"loginradius site management permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>LoginRadius Site Management</h3>\n<p>LoginRadius Dashboard provides a feature where you can create and manage multiple applications for your multiple products. </p>\n<p>With the help of LoginRadius CLI you can manage your sites via terminal using commands like <code>lr get site</code>, <code>lr set site</code>, <code>lr add site</code>, <code>lr delete site</code>.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 136.46153846153845%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAbCAYAAAB836/YAAAACXBIWXMAABYlAAAWJQFJUiTwAAAE50lEQVRIx32VWXPaWBSEeYljC4SQhHYEArSx72AWY2PipcblZJZkqiZTlaf8/7/Q01csE0/NzMOpayjzqU/3uUe55Pt36FEErdtFIY5RjBMo/CyqGMXQ0hS18QSV4RAqP8v1xqGC+qFqAasOybLh75+QC799gzoYwl+vUVlcw57OYMyX0EcTqJ0Oqwu11UGp1UYpbaGUpCjFrIgPDmNWlJ2yX0Pldo9c8+ufaGy2aD88oH1/D2M4gjaZQx+MDoAM0oJCkEL1pSg+gJrsoBFCaTRZIQqeD3d9S4V/fEVwvUK4+wCXZ219A5Pqiu0utP6ICnsH0BkW/Q2rN1Fk+0WeebcCd7lFLibw/vNnzF8/InnYY/T6gjpbr80XsPqDzMf/hAWNcxVcj4I2bPnL7+hub1ElpLO7R+9+D280RiCAvX7W3glWbIZvYbV6Fog4C44HZ75CLvj1MzS2VSNQQBwGVOCPJf6oQH8yCEv5N1iVsGqQVd52GeiSCn/7gv7+EaOnZyxeXjDlGS3XSFZr9G53sLs9aGxZ+PQWRpAfZOmKylsO7PECufqnX9Dd3KB9t0PrZos+2+7QgunjE0Kq9pm2waTlo1fyj7AKYZVqVnnThj2cs+XXT4ivl0hvbpGsN5mq/t09Jg+P0DlvBeHRD7CsRaFKwLxqNi4yK2/YDHGKXO3lI8q9IaLVBs3ZHGZvAKXdJ4g/5E1Q/g/mEsZxkXlKZYshjqnwp1e4/SHC1Q1szl0xTKAmbajZbUjpXXhosXr0qyJUHWFOJUu3wFMqmzA7I3pI4HC3x/DxGVW23t1/gEOVskg0PIRxMv4Ek08w2zuXpBswWwMqfH7BgpCIIxMt6eV6Bb/bRziZwmK6efpTPMP8tzDLZbpudkqaASPpIed/eEIwnqIymiJd3qDF1stph8l2oAmFnLWz+YQVjrD8CWY6WV2pZRhRlwofntHf3mFEsEdVIefPH4xRqIowwgx4Mv8N7AgS6Yq6KukoN9tM+f4BE85dndetNh5zhBao8eZUuLKKnp+ZflDmnWGZKuMIY7p53cKVoqHcSJETOyyeXaPKljvrLXqbO1itLoyYK4sKZa92Nv4EO4DsbFQk3UReMzOgHiTIVQlMF0v0tjt4wzFa3I1uu4crh2GwbeHfj36dYfoJZiCvGrgsqtCrEUPZ7DAmpEHffK75xnQKh9vYbnLLZDAnS/HQ5qFFAROqBExiGFKpjEu5BK0SsuUVt/VsgSpnr0loOWhC5T3VRLpiYI+mC9AVFZ1alNQD7IowSdFxWVCguQ3knPmaaylGkx6GbLnJW1OOeFPaI3rZgsMS6mTTRYkPkEW7GczIlAnYCajaAXL2bAmX7wwBSyezTG06nsHjHIa84wlVRzzDzgAO1StM90JW8V5UoYT3eQUXkoJ3l3mUzCpyFndYxJGZcsv0+E4Rfs4Z0HRziwlTF7XhaM1oTUcMP+97i9XnQ20uCYPhmW4VOm3RzBpbHs0R8x/aHJ2YKmMqSnh2p/SVo2NUAlj0s2R5MPl3mQBRhl2Bzu8yIEunx2rZF8AFPbKhMNGi8IiJCr9Eift5Kfwpatn5zzYvpCIuLmVWAe/eSSipHl+jTz/Dm65hD+ZcX2yjO4HVHsNKh7CSARdEH2bYhdng/a5TcS2F4ccoexGVNqHbDehmwJYD2E6CvwCOLewZFJTetgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Site Management in LoginRadius CLI\"\n        title=\"Site Management in LoginRadius CLI\"\n        src=\"/static/fdec753179cfd0aaae5ff08af571768e/e5715/site_management.png\"\n        srcset=\"/static/fdec753179cfd0aaae5ff08af571768e/a6d36/site_management.png 650w,\n/static/fdec753179cfd0aaae5ff08af571768e/e5715/site_management.png 768w,\n/static/fdec753179cfd0aaae5ff08af571768e/07a9c/site_management.png 1440w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<h3 id=\"contributing-to-loginradius-cli\" style=\"position:relative;\"><a href=\"#contributing-to-loginradius-cli\" aria-label=\"contributing to loginradius cli permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Contributing to LoginRadius CLI</h3>\n<p>The <a href=\"https://github.com/LoginRadius/lr-cli/\">LoginRadius CLI</a> is opensourced in the <a href=\"https://github.com/LoginRadius\">LoginRadius Organization</a>  and you can contribute to it if you find any bugs or improvement by following the contributing guidelines. You can also checkout our <a href=\"https://www.loginradius.com/open-source/\">open source page</a> if you wish to contribute more in LoginRadius.</p>\n<h3 id=\"your-take\" style=\"position:relative;\"><a href=\"#your-take\" aria-label=\"your take permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Your Take</h3>\n<p>With the help of LoginRadius CLI, you can setup the authentication for your Angular application in just 5 minutes. LoginRadius will take care of all the authentication-related stuff for your application so that you can focus on your application development.</p>\n<p>I hope you like this tutorial. Kindly provide feedback suggestions in the comment section below.</p>\n<p>Cheers!!!</p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n  .dark-default-dark {\n    background-color: #1E1E1E;\n    color: #D4D4D4;\n  }\n  .dark-default-dark .mtk1 { color: #D4D4D4; }\n  .dark-default-dark .mtk4 { color: #569CD6; }\n  .dark-default-dark .mtk12 { color: #9CDCFE; }\n  .dark-default-dark .mtk8 { color: #CE9178; }\n  .dark-default-dark .mtk15 { color: #C586C0; }\n  .dark-default-dark .mtk11 { color: #DCDCAA; }\n  .dark-default-dark .mtk10 { color: #4EC9B0; }\n  .dark-default-dark .mtk7 { color: #B5CEA8; }\n  .dark-default-dark .mtk17 { color: #808080; }\n  .dark-default-dark .mtk3 { color: #6A9955; }\n</style>","frontmatter":{"date":"April 14, 2021","updated_date":null,"description":"In this tutorial, you will learn about how to implement the authentication for Angular 2+ application in just 5 mins. We will be using LoginRadius for authentication.","title":"Implement Authentication in Angular 2+ application using LoginRadius CLI in 5 mins","tags":["Authentication","Angular","CLI","LoginRadius CLI"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/7c2ac2ca4ca6e495e226891293c79e92/14b42/angulat_demo_auth.jpg","srcSet":"/static/7c2ac2ca4ca6e495e226891293c79e92/f836f/angulat_demo_auth.jpg 200w,\n/static/7c2ac2ca4ca6e495e226891293c79e92/2244e/angulat_demo_auth.jpg 400w,\n/static/7c2ac2ca4ca6e495e226891293c79e92/14b42/angulat_demo_auth.jpg 800w,\n/static/7c2ac2ca4ca6e495e226891293c79e92/47498/angulat_demo_auth.jpg 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Mohammed Modi","github":"mohammed786","avatar":null}}}},{"node":{"excerpt":"Everyone knows how the coronavirus pandemic took hardly any time to spread worldwide. And how, in its wake, countries across the planet…","fields":{"slug":"/growth/top-10-tips-to-enhance-your-creativity-while-working-from-home/"},"html":"<p>Everyone knows how the coronavirus pandemic took hardly any time to spread worldwide. And how, in its wake, countries across the planet initiated a series of lockdowns to save their citizens from this deadly virus.</p>\n<p>Since professionals couldn’t venture outside and had to stay home, <a href=\"https://www.loginradius.com/blog/fuel/2021/02/tips-managing-remote-team/\">remote work or work from home</a> became the new normal.</p>\n<p>And just when the world was gradually recovering from the impact of COVID’s first wave, and offices were planning to open after a long hiatus, the second wave of infections crashed on the shore of human wellness.</p>\n<p>So, what does the picture look like now?</p>\n<p>According to statistics, <a href=\"https://globalworkplaceanalytics.com/work-at-home-after-covid-19-our-forecast\">25-30% of the workforce will be working from home by the end of 2021.</a></p>\n<p> <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 74.15384615384615%; position: relative; bottom: 0; left: 0; background-image: url('data:image/jpeg;base64,/9j/2wBDABALDA4MChAODQ4SERATGCgaGBYWGDEjJR0oOjM9PDkzODdASFxOQERXRTc4UG1RV19iZ2hnPk1xeXBkeFxlZ2P/2wBDARESEhgVGC8aGi9jQjhCY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2P/wgARCAAPABQDASIAAhEBAxEB/8QAFwAAAwEAAAAAAAAAAAAAAAAAAAIDBf/EABQBAQAAAAAAAAAAAAAAAAAAAAH/2gAMAwEAAhADEAAAAdhIxRCIn//EABsQAAICAwEAAAAAAAAAAAAAAAECAAMREiEi/9oACAEBAAEFAiwy1ig8aepYrEjZJ//EABQRAQAAAAAAAAAAAAAAAAAAABD/2gAIAQMBAT8BP//EABQRAQAAAAAAAAAAAAAAAAAAABD/2gAIAQIBAT8BP//EABkQAAMAAwAAAAAAAAAAAAAAAAABERAhMf/aAAgBAQAGPwJYp1GmSn//xAAbEAEBAQACAwAAAAAAAAAAAAABEQAhQVFxgf/aAAgBAQABPyGp54fGVreSYAB3opfgYoDJ2aCRPW//2gAMAwEAAgADAAAAEDMP/8QAFREBAQAAAAAAAAAAAAAAAAAAEBH/2gAIAQMBAT8Qp//EABURAQEAAAAAAAAAAAAAAAAAABAR/9oACAECAQE/EIf/xAAcEAADAQACAwAAAAAAAAAAAAABESEAMVFxkcH/2gAIAQEAAT8QPcQjZdHQBCCebgNwPW4lBuv04gfzDYwOMdb/2Q=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"tips-for-work-from-home-creativity-loginradius\"\n        title=\"tips-for-work-from-home-creativity-loginradius\"\n        src=\"/static/85d5d619a446f3d4469731c06abf2267/212bf/tips-for-work-from-home-creativity-loginradius.jpg\"\n        srcset=\"/static/85d5d619a446f3d4469731c06abf2267/6aca1/tips-for-work-from-home-creativity-loginradius.jpg 650w,\n/static/85d5d619a446f3d4469731c06abf2267/212bf/tips-for-work-from-home-creativity-loginradius.jpg 768w,\n/static/85d5d619a446f3d4469731c06abf2267/45148/tips-for-work-from-home-creativity-loginradius.jpg 5125w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span> </p>\n<p>Living at home has its pros and cons. You can enjoy quality time with your family, save on travel expenses, and focus more on your kids.</p>\n<p>On the other hand, you might get bored after a while, miss those chats with your colleagues near the cooler, or yearn to go outside and breathe in fresh air to get your grey cells working better.</p>\n<p>However, since heading to the office is not really an option now, coming up with ways to get more creative and productive in a work from home setting can be helpful.</p>\n<p>Here are ten tips you can try, whether you are new to the industry or a leader.</p>\n<h3 id=\"1-use-technology-to-its-fullest\" style=\"position:relative;\"><a href=\"#1-use-technology-to-its-fullest\" aria-label=\"1 use technology to its fullest permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>1. Use technology to its fullest</h3>\n<p>Technology has become the backbone of every kind of business. Nobody could have conceived the idea of working from home without using the latest digital tools like Zoom, Microsoft Teams, and Skype for brainstorming effective strategies through video conferencing.</p>\n<p>On the other hand, it also allows team members to share critical documents in real-time through cloud-based software like Google docs and OneDrive.</p>\n<p>Technology enables leaders to learn about employee experience and get a comprehensive understanding of their challenges. In this way, leaders can identify employees' pain points and figure out what works best for enhancing their creativity.</p>\n<p>Identity is all in the modern world, and the <a href=\"https://www.loginradius.com/blog/identity/2020/05/cyber-threats-business-risk-covid-19/\">cyber threat to businesses</a> is at an all-time high. With the world at a standstill as a result of the pandemic, the concept of stable data governance and flexible identity management in a volatile environment should be considered.</p>\n<h3 id=\"2-work-with-tight-deadlines\" style=\"position:relative;\"><a href=\"#2-work-with-tight-deadlines\" aria-label=\"2 work with tight deadlines permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>2. Work with tight deadlines</h3>\n<p>Deadlines play a significant role in developing a sense of accountability, whether you are working from home or office. The best practice is to create a timeline before assigning the work to an employee and then constantly monitoring their performance.</p>\n<p>Strict timelines generate a sense of urgency in the employee and motivate them to find creative solutions to finish the task in a specified duration. Creativity allows them to judge their capabilities well, increase productivity and submit deliverables on time.</p>\n<p> <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 75.07692307692308%; position: relative; bottom: 0; left: 0; background-image: url('data:image/jpeg;base64,/9j/2wBDABALDA4MChAODQ4SERATGCgaGBYWGDEjJR0oOjM9PDkzODdASFxOQERXRTc4UG1RV19iZ2hnPk1xeXBkeFxlZ2P/2wBDARESEhgVGC8aGi9jQjhCY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2P/wgARCAAPABQDASIAAhEBAxEB/8QAGAAAAwEBAAAAAAAAAAAAAAAAAAEDAgT/xAAVAQEBAAAAAAAAAAAAAAAAAAAAAv/aAAwDAQACEAMQAAABpVclTsYf/8QAGRABAAMBAQAAAAAAAAAAAAAAAgERISJB/9oACAEBAAEFAqyZpI9eNxbW/wD/xAAUEQEAAAAAAAAAAAAAAAAAAAAQ/9oACAEDAQE/AT//xAAUEQEAAAAAAAAAAAAAAAAAAAAQ/9oACAECAQE/AT//xAAaEAABBQEAAAAAAAAAAAAAAAAhAAEQEVFB/9oACAEBAAY/AuouKgYn2P/EABsQAAIDAAMAAAAAAAAAAAAAAAABESFBMXGB/9oACAEBAAE/IZumHo+NPVpcK4lIb0C35P/aAAwDAQACAAMAAAAQgA//xAAUEQEAAAAAAAAAAAAAAAAAAAAQ/9oACAEDAQE/ED//xAAUEQEAAAAAAAAAAAAAAAAAAAAQ/9oACAECAQE/ED//xAAbEAEBAAIDAQAAAAAAAAAAAAABEQAhMUFRof/aAAgBAQABPxAYjlbvswQYgTpp3lFtreTKrsLny5EqlETV9+YN00F25//Z'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"work-from-home-creativity-1-loginradius\"\n        title=\"work-from-home-creativity-1-loginradius\"\n        src=\"/static/14cbd635d0d376dd75ef758496bc1e6d/212bf/work-from-home-creativity-1-loginradius.jpg\"\n        srcset=\"/static/14cbd635d0d376dd75ef758496bc1e6d/6aca1/work-from-home-creativity-1-loginradius.jpg 650w,\n/static/14cbd635d0d376dd75ef758496bc1e6d/212bf/work-from-home-creativity-1-loginradius.jpg 768w,\n/static/14cbd635d0d376dd75ef758496bc1e6d/e5bc7/work-from-home-creativity-1-loginradius.jpg 5184w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span>  </p>\n<h3 id=\"3-consider-multiple-perspectives-while-having-meetings\" style=\"position:relative;\"><a href=\"#3-consider-multiple-perspectives-while-having-meetings\" aria-label=\"3 consider multiple perspectives while having meetings permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>3. Consider multiple perspectives while having meetings</h3>\n<p>Do you conduct separate meetings for each department? Do you only discuss deadlines and who is responsible for a particular task?</p>\n<p>If your answer is yes to both those questions, it's time to change your definition of the word \"meeting\".</p>\n<p>To promote creativity, you need to understand the perspective of every individual. Start by including members from teams who aren't necessarily considered in the creative lot, such as quality managers, finance managers, and operation analysts.</p>\n<p>Sometimes, people are too shy to express their thoughts in front of others. You can have one-to-one sessions with them through Skype and learn about their views in such cases.</p>\n<h3 id=\"4-all-work-and-no-play-make-jack-a-dull-boy\" style=\"position:relative;\"><a href=\"#4-all-work-and-no-play-make-jack-a-dull-boy\" aria-label=\"4 all work and no play make jack a dull boy permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>4. All work and no play make Jack a dull boy!</h3>\n<p>Communication plays a substantial role in sparking creativity amongst team members. You can do it by breaking your meeting into several parts.</p>\n<p>For example, before you start discussing business issues, lighten your team's mood by asking them about the weather, sharing a piece of critical news, or cracking a joke.</p>\n<p>Share the recipe of your favorite cuisine or talk about the song your kid sang last night. You can gradually shift the focus towards more essential issues once you see people actively participating in the conversation.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 66.76923076923077%; position: relative; bottom: 0; left: 0; background-image: url('data:image/jpeg;base64,/9j/2wBDABALDA4MChAODQ4SERATGCgaGBYWGDEjJR0oOjM9PDkzODdASFxOQERXRTc4UG1RV19iZ2hnPk1xeXBkeFxlZ2P/2wBDARESEhgVGC8aGi9jQjhCY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2P/wgARCAANABQDASIAAhEBAxEB/8QAFwAAAwEAAAAAAAAAAAAAAAAAAAQFBv/EABYBAQEBAAAAAAAAAAAAAAAAAAEAAv/aAAwDAQACEAMQAAABuLz0XOgFyf/EABsQAAMAAgMAAAAAAAAAAAAAAAABAgMRBBIT/9oACAEBAAEFAno7JmzkZag97VI//8QAFREBAQAAAAAAAAAAAAAAAAAAEBH/2gAIAQMBAT8Bp//EABURAQEAAAAAAAAAAAAAAAAAABAR/9oACAECAQE/AYf/xAAaEAACAgMAAAAAAAAAAAAAAAAAEAECEiEx/9oACAEBAAY/AjUqmJ1f/8QAGRABAQEBAQEAAAAAAAAAAAAAAQARITGB/9oACAEBAAE/IUi3ISxSws3tqe/kuX//2gAMAwEAAgADAAAAEB/P/8QAFREBAQAAAAAAAAAAAAAAAAAAARD/2gAIAQMBAT8QY//EABURAQEAAAAAAAAAAAAAAAAAAAEQ/9oACAECAQE/ECP/xAAdEAEAAgICAwAAAAAAAAAAAAABABEhQTGRYXGx/9oACAEBAAE/ELC1xzAVbq7rz6gJlFMNQzIarNiV9hSQNCcdRm65aXqf/9k='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"work-from-home-creativity-loginradius\"\n        title=\"work-from-home-creativity-loginradius\"\n        src=\"/static/765f3004c797408fca535635e891f391/212bf/work-from-home-creativity-loginradius.jpg\"\n        srcset=\"/static/765f3004c797408fca535635e891f391/6aca1/work-from-home-creativity-loginradius.jpg 650w,\n/static/765f3004c797408fca535635e891f391/212bf/work-from-home-creativity-loginradius.jpg 768w,\n/static/765f3004c797408fca535635e891f391/93719/work-from-home-creativity-loginradius.jpg 4000w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span> </p>\n<h3 id=\"5-read-read-and-read\" style=\"position:relative;\"><a href=\"#5-read-read-and-read\" aria-label=\"5 read read and read permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>5. Read, read, and read!</h3>\n<p>One of the best ways to enhance your creativity is to read as much as you can. If you feel that something is stopping you from unleashing your creative energy, start by reading \"The War of Art\" by Steven Pressfield. Or, if you want to learn a step-by-step way to become more creative, read the all-time classic \"Lateral Thinking\" by Edward De Bono. Remember, \"Readers are Leaders,\" and you might never get a better time investing in reading classic books on creativity.</p>\n<h3 id=\"6-learn-something-new\" style=\"position:relative;\"><a href=\"#6-learn-something-new\" aria-label=\"6 learn something new permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>6. Learn something new</h3>\n<p>Are you an expert copywriter? Or maybe you are a financial analyst? It's always an excellent idea to try your hands on something new.</p>\n<p>Learning a new approach will set your creative juices flowing and unlock a new perspective. In the present scenario, it would be best if you learned the basics of data security.</p>\n<p>Do you know that about <a href=\"https://www.varonis.com/blog/cybersecurity-statistics/\">95% of cyberattacks are caused by human error?</a> This number can significantly reduce if you pursue a course on data security best practices.</p>\n<h3 id=\"7-create-a-blog\" style=\"position:relative;\"><a href=\"#7-create-a-blog\" aria-label=\"7 create a blog permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>7. Create a blog</h3>\n<p>Know what you are best at? Then figure out how you can contribute to others. If you have a lot of free time after work, you can use it to educate others and form a niche audience.</p>\n<p>Write guest blogs for reputed websites and share your skills and expertise with others. If people like your content, you can create a personal website and charge a fixed fee to users wanting to consume what you write.</p>\n<h3 id=\"8-sign-up-for-webinars\" style=\"position:relative;\"><a href=\"#8-sign-up-for-webinars\" aria-label=\"8 sign up for webinars permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>8. Sign up for webinars</h3>\n<p><a href=\"https://www.loginradius.com/resource/the-death-of-passwords-webinar/\">Webinars</a> are one of the best ways to learn a skill that you always wanted but didn't have time for. Start with free webinars and gradually move towards paid ones where the host shares their personal experience and secrets of becoming an expert.</p>\n<p>The best part about webinars is that you can clear your doubts in real-time and interact with other participants in a live setting.</p>\n<h3 id=\"9-start-your-webinar-or-podcast\" style=\"position:relative;\"><a href=\"#9-start-your-webinar-or-podcast\" aria-label=\"9 start your webinar or podcast permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>9. Start your webinar or podcast</h3>\n<p>Are you an expert in your field? Do you like solving doubts in real-time? Do people feel comfortable while interacting with you?</p>\n<p>Then this is the right time to start your webinar or podcast, whichever format you are more comfortable with. If you have enough knowledge on the selected topic and have excellent presentation skills, you will gain a massive audience in relatively less time.</p>\n<p>Use your creative skills to design an eye-catching webinar that provides the best quality content engagingly.</p>\n<h3 id=\"10-become-a-data-specialist-and-a-storyteller\" style=\"position:relative;\"><a href=\"#10-become-a-data-specialist-and-a-storyteller\" aria-label=\"10 become a data specialist and a storyteller permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>10. Become a data specialist and a storyteller</h3>\n<p>We live in an age driven by information where data plays a significant role in companies across industries. Data collection and analysis have become essential for each business as they allow creating unique customer personas.</p>\n<p>But data alone doesn't lead anywhere. You need to have storytelling skills that will help you see the bigger picture, unearth valuable insights, and forecast future trends.</p>\n<h2 id=\"conclusion\" style=\"position:relative;\"><a href=\"#conclusion\" aria-label=\"conclusion permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Conclusion</h2>\n<p>As the second wave of the coronavirus pandemic has spread across the world, work from home is here to stay, at least for a while. So, this is the best time to identify your strengths, polish your skills, and learn something new. Follow the ten tips given in this article to enhance your creativity while working from home and make the best use of your skills, time, and money during the pandemic.\n<a href=\"https://www.loginradius.com/book-a-demo/\"><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 30.307692307692307%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsSAAALEgHS3X78AAABT0lEQVQY001R207CUBBsjIFSSiAGlZCIAaltAbm0KPRKCyJgJWBESVQUH/T3fPJB4wf4V+O2ReRh9mRvs7N7GFYwEDv2YSJypCP0TbCbkDpgRQtsUQdX7mFXu0a6dg6u0g9zfz30MnHJWjfuKQMk5A6ilAhjVtjgQ3aIUAsIs9Yt5O4dos0pIuU+uHW9CSZd7yNZdhGXbEjuDDvVXjiRfLY6AFvqBoQx0Q42EJ0bKJcPqI0e0Rjeo+ktwMv/KhlfjejMcKiNsV1ogyeiXPsKGXUYKju5IHUuYoJOyk1kzjzkjQlyLQ8HhJw+AbexNuObRMmhKTaiRQPJiovs6Qj76gDc6n68SIUFC2+mgp9pHh9zBV8vHXwubXxPBLyPJaREAxFhRRjcbDXBR6rSDW4ZxAgcfdpW0USz3sKr2cDCauHZ0fFEWBoq5poKnmr8DX4BqFW4QKKQTzoAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"book-a-demo-Consultation\"\n        title=\"book-a-demo-Consultation\"\n        src=\"/static/4e5414b04a66bd0747366ee1a5ecce4b/e5715/book-a-demo-free-consultation.png\"\n        srcset=\"/static/4e5414b04a66bd0747366ee1a5ecce4b/a6d36/book-a-demo-free-consultation.png 650w,\n/static/4e5414b04a66bd0747366ee1a5ecce4b/e5715/book-a-demo-free-consultation.png 768w,\n/static/4e5414b04a66bd0747366ee1a5ecce4b/63ff0/book-a-demo-free-consultation.png 2887w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></a></p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n</style>","frontmatter":{"date":"April 14, 2021","updated_date":null,"description":"Working from home has its pros and cons. You can enjoy quality time with your family, save on travel expenses, and focus more on your kids. On the other hand, you might get bored after a while, miss those chats with your colleagues near the cooler, or yearn to go outside and breathe in fresh air. Here are some tips you can try to enhance your creativity while working from home.","title":"Top 10 Tips to Enhance Your Creativity While Working From Home","tags":null,"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/7275a39238f9dce0407012d2e7ec8905/14b42/work-from-home-loginradius.jpg","srcSet":"/static/7275a39238f9dce0407012d2e7ec8905/f836f/work-from-home-loginradius.jpg 200w,\n/static/7275a39238f9dce0407012d2e7ec8905/2244e/work-from-home-loginradius.jpg 400w,\n/static/7275a39238f9dce0407012d2e7ec8905/14b42/work-from-home-loginradius.jpg 800w,\n/static/7275a39238f9dce0407012d2e7ec8905/47498/work-from-home-loginradius.jpg 1200w,\n/static/7275a39238f9dce0407012d2e7ec8905/0e329/work-from-home-loginradius.jpg 1600w,\n/static/7275a39238f9dce0407012d2e7ec8905/208d9/work-from-home-loginradius.jpg 6720w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Deependra Singh","github":null,"avatar":null}}}},{"node":{"excerpt":"Through the statutes of GDPR and CCPA Ever since GDPR went into effect on 25th May 2018 organizations had a clear legislative guideline on…","fields":{"slug":"/identity/guide-consent-management/"},"html":"<h3 id=\"through-the-statutes-of-gdpr-and-ccpa\" style=\"position:relative;\"><a href=\"#through-the-statutes-of-gdpr-and-ccpa\" aria-label=\"through the statutes of gdpr and ccpa permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Through the statutes of GDPR and CCPA</h3>\n<p>Ever since GDPR went into effect on 25th May 2018 organizations had a clear legislative guideline on how they managed user data and permissions surrounding it. A key piece around GDPR is Consent Management. It refers to the process that allows a website to meet GDPR regulation by obtaining user consent for collecting their data through cookies during their visit.</p>\n<p>You have probably noticed it all the time when you open a website, a very conspicuous bar on the top or bottom letting you know that the website is collecting “essential cookies” and providing you with the option to “manage your preferences.” Using this, websites are able to comply with the relevant data privacy laws by giving the user greater control on what data collected from the visit to the website can be controlled. </p>\n<p>Without a Consent Management system, websites cannot mail their contacts without breaching GDPR rules. It must be noted that simply having a consent management system on your website does not allow you to collect and use consumer data there are responsibilities and requirements beyond collecting consent that must be taken into account. </p>\n<h2 id=\"ccpa-and-consent-management\" style=\"position:relative;\"><a href=\"#ccpa-and-consent-management\" aria-label=\"ccpa and consent management permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>CCPA and Consent Management</h2>\n<p>Consent Management is not restricted to websites needing to comply with GDPR; as of 2020, <a href=\"https://unctad.org/topic/ecommerce-and-digital-economy/ecommerce-law-reform/summary-adoption-e-commerce-legislation-worldwide\">66% of countries</a> around the world have enacted data privacy laws. The CCPA has also clearly outlined how organizations must include consent management within their websites. Here are some of the highlights:</p>\n<ol>\n<li><strong>Notice or Declaration</strong>: Companies must provide notice or declare what personal data will be collected on their customers and how said data will be used. </li>\n<li><strong>Choice to Opt-Out:</strong> If an organization sells personal information, they must provide users the choice to opt-out of collecting their personal data on any webpage that collects data with a button titled “Do Not Sell My Personal Information” or “ Do Not Sell My Info”.</li>\n<li><strong>Privacy Policy Update:</strong> Organizations must update their privacy policy to include consumer rights according to the CCPA, including a detailed walkthrough of what data is being collected and sold on the users in the past 12 months.</li>\n<li><strong>Deleting Identifiable Personal Information:</strong> According to the <a href=\"https://www.loginradius.com/resource/loginradius-and-ccpa-compliance\">CCPA</a>, companies and organizations must provide a two-step process for completing an online request for deletion of their data. </li>\n</ol>\n<p>It is interesting to note that deletion can be achieved by either completely deleting PII data from existing systems of the organization or by removing personal identifiers from the data so that it can no longer be linked to any individual.</p>\n<h2 id=\"can-you-process-anything-without-consent\" style=\"position:relative;\"><a href=\"#can-you-process-anything-without-consent\" aria-label=\"can you process anything without consent permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Can You Process Anything Without Consent</h2>\n<p>Both the GDPR and CCPA define specific conditions that allow user data to be processed without consent or unconditionally; these situations include:</p>\n<ol>\n<li><strong>Contractual requirement</strong>: When an organization deals in goods or services then there are scenarios such as providing an address for the fulfillment of an order, that do not require consent from the data subject. </li>\n<li><strong>Legal</strong>: Certain actions such as processing criminal records would not need consent due to legal obligations.</li>\n<li><strong>Vital interest</strong>: If the processing of data can lead to the protection of human life then consent may not be required. Healthcare and insurance sectors, for example, don’t need to ask for consent.</li>\n<li><strong>Public Entities</strong>: Govt. bodies performing their official functions do not need to comply with certain consent-collection requirements. This includes schools, hospitals, and the police.</li>\n<li><strong>Legitimate interest</strong>: Although this is very much up to legal interpretation, certain tasks like checking children’s age at an online liquor store that has genuine requirements to process personal data without consent may continue to do so.</li>\n<li><strong>Data collected wholly outside of California</strong>: Any PII data collected outside the jurisdiction of the state of California makes it exempt from the CCPA. This however does not mean they will be exempt from any national or federal laws that could be relevant to the data that is collected.  </li>\n<li><strong>Employee information</strong>: Certain personal information falls within the boundaries of employee information and is exempt from the CCPA. Some of this data includes that which is collected from applicants to a job, hired staff members, Independent contractors, and employees (including officers and directors).</li>\n<li><strong>Business-to-Business Relationships</strong>: Contact information collected as part of a business-to-business (B2B) relationship may also be exempt from CCPA compliance to qualify for this exemption, the product or service taking place between the businesses must have already been CCPA exempt.</li>\n<li><strong>Warranty and Recall Information</strong>: Specific to new car dealers and buyers this exemption rules that vehicle ownership information may be kept and shared between dealers and manufacturers without the need to provide an opt-out option.</li>\n</ol>\n<p><a href=\"https://www.loginradius.com/resource/the-ccpa-and-customer-identity\"><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 30.307692307692307%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsSAAALEgHS3X78AAABWklEQVQY002QTUsCURSGhxY5X5FpCmPgR1rNOCpmOo7WaOagohVEQaQE0TJI2rSzNq36JdEmiDaFi4hWbtq1adFfeTtzdarFy/m49zznvZcTljfgSCRJKxZktQJJtcai2j13xCfKEPUtzJt78GfqEFI2eLUKYWkd/OQOx2A0GMjU4NMIGi9iJmHCn7QQzNrw6pvgaYBBKUppG+HaEXT7EFJxH550g/XZQoqcm8TMNkqdHrL1A/gJ7AnnIC0amE1W6ZxqcucjVxFzG8paE0q+hVCuMa4pdxgM6G5XyE200ETMaCGgVyBE85AnwN8n093gagOhQhvh0g4WjA7LnW9yOQwoUWNOs5gjkST9kwN0Bjgli7PBLT6/vvHw/Iq7xxfcPw3xNvrA8H0Eb6qG6Xj5D+hVyUWsAJH+0JVMch1ORQwUd08YtNe/Qvd8gG5/gNPLGxxfXEPWKvAQ6wfQn8CjOYwLfAAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"ccpa-customer-identity\"\n        title=\"ccpa-customer-identity\"\n        src=\"/static/277eebfdb42ba7a9547788e0c4bc7ae6/e5715/ccpa-customer-identity.png\"\n        srcset=\"/static/277eebfdb42ba7a9547788e0c4bc7ae6/a6d36/ccpa-customer-identity.png 650w,\n/static/277eebfdb42ba7a9547788e0c4bc7ae6/e5715/ccpa-customer-identity.png 768w,\n/static/277eebfdb42ba7a9547788e0c4bc7ae6/63ff0/ccpa-customer-identity.png 2887w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></a></p>\n<h2 id=\"advantages-of-having-a-good-consent-management-system\" style=\"position:relative;\"><a href=\"#advantages-of-having-a-good-consent-management-system\" aria-label=\"advantages of having a good consent management system permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Advantages of Having a Good Consent Management System</h2>\n<h3 id=\"scaling-sustainably\" style=\"position:relative;\"><a href=\"#scaling-sustainably\" aria-label=\"scaling sustainably permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Scaling sustainably</h3>\n<p>Having a good consent management system will allow your organization to scale without compromising the security and privacy of your consumers. When building our new platforms as part of a new service or <a href=\"https://www.loginradius.com/blog/identity/2021/01/what-is-digital-transformation/\">digital transformation</a>, establishing trust with your consumers is paramount and this can be achieved by being transparent with them on what data is collected on them and how it is used. </p>\n<h3 id=\"avoiding-costly-litigation\" style=\"position:relative;\"><a href=\"#avoiding-costly-litigation\" aria-label=\"avoiding costly litigation permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Avoiding costly litigation</h3>\n<p>Failure to comply with GDPR requirements for consent management can lead to costly litigation if caught, damage to brand image and public trust is also an immediate consequence. Something that is far more difficult to address and not to mention a serious threat to an organization's business as a whole. </p>\n<h3 id=\"drive-better-insights\" style=\"position:relative;\"><a href=\"#drive-better-insights\" aria-label=\"drive better insights permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Drive better insights</h3>\n<p>A neat by-product of having consent management is the centralization of user consent and data. This data which is useful to multiple teams from engineering and product to marketing and support can now be organized and analyzed in a single location which drives better insights. </p>\n<h2 id=\"conclusion\" style=\"position:relative;\"><a href=\"#conclusion\" aria-label=\"conclusion permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Conclusion</h2>\n<p>Whether you are a small business that is starting out or a Multinational brand, <a href=\"https://www.loginradius.com/consent-management/\">consent management </a>is going to be an important piece of your organization's ability to grow sustainably while building trust within your consumer base. </p>\n<p>There are a couple of ways you can have these implemented depending on your use case. While some companies will require only basic consent management pieces that can be written by developers fairly easily, others that use consumer data for analytics and personalization of services might find it more suitable to use a Consent Management platform from a third-party vendor.</p>\n<p><a href=\"https://www.loginradius.com/book-a-demo/\"><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 30.307692307692307%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsSAAALEgHS3X78AAABdElEQVQY002RO0/CUBzFG6PtbZWHCAmRmBB5P8vDII9SSC0omog4oAEGjZMO6OKEuLjoJ2Fx0cSBwUQnXZxcHPwux38LJA7nNvfec8+5v1tOCCiwpbbhye2BxbYgBMtgIRVioDRRsARGXxZUzLlEHmehBaesQ4rrEMPViYf2DR9nDGKkChbVICVqsMt1WJI1sHCFwhUsUIFohJH49TxECvRUjhDW2mAbB5iP6hB8hUkhiRPN5KIZYJdrsEYrcCSpmQqMm6/m9ylUhSulY7N5ivROB3L9GOlGF3Ktbc4zuz341UPw/uIk0ESbBjoSGlYIx8BfzjSwVmyCEYEUUmCPa3Bnd+hwC75yC95S05SxbolU/iEbOCFCpDexEfIioTNCNd6Tp6IlMnNuGeeDe3z//OLx5RWj5zFGT2O8fXxh/P4Ja6w6vSEFCnTIlW2YiDzhzX7ATFKojDlvjpBPcDF4QPdyiG5/iE7/BmfXd+hd3VKpCoG8fzxWw2+c+yTpAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"book-a-free-demo-loginradius\"\n        title=\"book-a-free-demo-loginradius\"\n        src=\"/static/fcc4c4b5dc38cc4528f99d09480f4eb2/e5715/book-a-demo-loginradius.png\"\n        srcset=\"/static/fcc4c4b5dc38cc4528f99d09480f4eb2/a6d36/book-a-demo-loginradius.png 650w,\n/static/fcc4c4b5dc38cc4528f99d09480f4eb2/e5715/book-a-demo-loginradius.png 768w,\n/static/fcc4c4b5dc38cc4528f99d09480f4eb2/63ff0/book-a-demo-loginradius.png 2887w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></a></p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n</style>","frontmatter":{"date":"April 14, 2021","updated_date":null,"description":"The importance of consent management cannot be understated. Whether you are a small business that is starting out or a multinational brand, consent management is going to be a crucial piece of your organization's ability to grow sustainably while building trust within your consumer base. Learn how the GDPR and CCPA define conditions that allow user data to be processed without consent or unconditionally.","title":"A Detail Guide to Consent Management and Processing Data","tags":["consent management","compliance","cx"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/82644fcb09576b02e178789bb8cee453/14b42/guide-consent-management-cover.jpg","srcSet":"/static/82644fcb09576b02e178789bb8cee453/f836f/guide-consent-management-cover.jpg 200w,\n/static/82644fcb09576b02e178789bb8cee453/2244e/guide-consent-management-cover.jpg 400w,\n/static/82644fcb09576b02e178789bb8cee453/14b42/guide-consent-management-cover.jpg 800w,\n/static/82644fcb09576b02e178789bb8cee453/16310/guide-consent-management-cover.jpg 1024w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Abhilash Menon","github":null,"avatar":null}}}},{"node":{"excerpt":"Every business has a common goal—to improve sales, and thereby improve profitability. While running business processes, many activities such…","fields":{"slug":"/identity/what-is-workflow-automation/"},"html":"<p>Every business has a common goal—to improve sales, and thereby improve profitability. While running business processes, many activities such as sending custom emails or following up with your potential lead require you to repeat a task multiple times. Sometimes, achieving these goals at the right time can get difficult, especially when it comes to tasks that are handled manually by employees. That is where workflow automation comes to the rescue.</p>\n<h2 id=\"what-is-workflow-automation\" style=\"position:relative;\"><a href=\"#what-is-workflow-automation\" aria-label=\"what is workflow automation permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>What is Workflow Automation</h2>\n<p>Did you know that many CEOs spend almost 20% of their time on work that could be automated? Workflow automation refers to the process of automating a set of manual processes or tasks based on a set of pre-defined rules or conditions. It helps you reduce the use of resources and time, more importantly, the chances of human-made errors. As a result, it improves a business’s overall efficiency, audibility, and accountability. </p>\n<h2 id=\"how-does-workflow-automation-work\" style=\"position:relative;\"><a href=\"#how-does-workflow-automation-work\" aria-label=\"how does workflow automation work permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>How Does Workflow Automation Work</h2>\n<p>According to studies, 60% of employees can <a href=\"https://www.mckinsey.com/business-functions/mckinsey-digital/our-insights/four-fundamentals-of-workplace-automation\">save 30% of their time with business automation.</a> When it comes to managing your workflows, it is always better to opt for an ‘all in one’ workflow automation tool that can automate both external and internal workflows in a more customized and personalized manner. Email marketing campaigns and lead nurturing comes under external workflow, whereas assigning the business sales team various tasks based on rotating leads is an example of internal workflow. </p>\n<p>Besides decreasing the overall cost to the business, workflow automation can help the employees avoid wasting their energy on simple daily tasks such as sending emails and following up the leads, thereby freeing them to execute more productive and important tasks. </p>\n<p>For example, send an email to a potential lead with a link to a specific landing page in which you have added a special offer or newsletter.  Once the lead receives the email and arrives on the landing page to avail the offer by filling up the form, their action will trigger your workflow automation. </p>\n<p>Thus, your workflow automation software will send the offer details, newsletter etc., regularly to the lead from that point without any effort from your side.</p>\n<h2 id=\"how-does-workflow-automation-benefit-your-business\" style=\"position:relative;\"><a href=\"#how-does-workflow-automation-benefit-your-business\" aria-label=\"how does workflow automation benefit your business permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>How Does Workflow Automation Benefit Your Business</h2>\n<p>Here’s how you can benefit from workflow automation software:</p>\n<ul>\n<li>\n<p><strong>Improve efficiency</strong></p>\n<p>Automating the internal workflow helps in simplifying the task workflows. Also, the human touchpoints are reduced, thus increasing the efficiency by carrying out the functions within a short time using human intelligence.</p>\n</li>\n<li>\n<p><strong>Increase productivity</strong></p>\n<p>Once the business workflows are automated, teams do not have to waste time doing repetitive tasks or waiting for approvals from the higher management teams. The processes and their progress can be tracked in real-time, helping in better time management leading to <a href=\"https://www.loginradius.com/scalability/\">high performance and improved productivity</a>.</p>\n</li>\n<li>\n<p><strong>High accuracy</strong></p>\n<p>It is only natural for humans to make errors during manual processes that involve processing tons of data, especially in repetitive tasks. There will be no or fewer errors with workflow automation, increasing the accuracy of consumer data being handled. </p>\n</li>\n<li>\n<p><strong>Audibility</strong></p>\n<p>With workflow automation, the responses are also automated, improving the response time in case of follow-ups or status updates. This improves communication and collaboration between different teams in different departments in the organization.</p>\n</li>\n<li>\n<p><strong>Improved accountability</strong></p>\n<p>Workflow automation defines various tasks and assigns the steps to be followed by each team member. This enhances the accountability among employees regarding their role in a specific process.</p>\n</li>\n<li>\n<p><strong>Job satisfaction</strong></p>\n<p>Automating soul-crushing, boring, and manually intensive processes helps the manual workforce concentrate more on creative tasks that can improve their skill set. It also creates an improved work culture with better collaboration and accountability.</p>\n</li>\n</ul>\n<h2 id=\"how-to-build-an-automated-workflow\" style=\"position:relative;\"><a href=\"#how-to-build-an-automated-workflow\" aria-label=\"how to build an automated workflow permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>How to Build An Automated Workflow</h2>\n<p>Let’s take a look at the six steps that you must consider while automating the task and process workflow of your business: </p>\n<ol>\n<li>\n<p><strong>Identify repetitive tasks</strong></p>\n<p>The first step towards automating the workflow is to prioritize its various processes. This will act as a blueprint for the implementation procedure. Categorize the activities into strategies that can be fully automated, such as repetitive tasks that require minimum manual assistance and the ones that demand human intervention. Also, give importance to the business goals here.</p>\n</li>\n<li>\n<p><strong>Create a workflow diagram</strong></p>\n<p>Now document a workflow diagram based on the above set priorities. This way, you can simply visualize each workflow step and get valuable feedback from the teams. Make sure to use standard symbols and terminology in your workflow diagram so that everyone can easily understand it.</p>\n</li>\n<li>\n<p><strong>Implement and deploy the workflow</strong></p>\n<p>Automate workflows with simple drag-and-drop tools to add and sort various tasks in the workflow editor. This can be done with the help of simple automation software.</p>\n</li>\n<li>\n<p><strong>Test the workflow automation</strong></p>\n<p>Testing is an important step to understand whether the automation is a success or not. User Acceptance Testing (UAT) cycles can be implemented to identify the bugs or problems so that you can work on them.</p>\n</li>\n<li>\n<p><strong>Train the workforce</strong></p>\n<p>It is also important to train the existing workforce to run workflow software. A sudden transition from manual processes to workflow automation can be tough for them and thus, increase the chances of resistance from their side. So, provide them with adequate training on the new automated system and incorporate their feedback during the decision-making process.</p>\n</li>\n<li>\n<p><strong>Measure key performance indicators</strong></p>\n<p>The in-built workflow analysis features can help in improving your workflow. Through continuous performance and workforce feedback analysis, you will get an idea of what went wrong and what went great. This way, you can increase productivity.</p>\n</li>\n</ol>\n<h2 id=\"implementing-workflow-automation-using-loginradius\" style=\"position:relative;\"><a href=\"#implementing-workflow-automation-using-loginradius\" aria-label=\"implementing workflow automation using loginradius permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Implementing Workflow Automation Using LoginRadius</h2>\n<p>LoginRadius offers the following <a href=\"https://www.loginradius.com/docs/api/v2/getting-started/implementation-workflows/\">workflow automation implementation</a> methodologies. You can go for any of the three or mix match features of each, depending on your unique requirement. </p>\n<p><strong>Identity Experience Framework (IDX)</strong></p>\n<p>The IDX methodology allows you to set up a centralized authentication page with predefined customizable layouts. Also, the page is hosted on a dedicated instance in LoginRadius, conveying authenticated details to a specified redirect location. </p>\n<p>With reduced UI/UX design time requirement, customizability, and self-contained and straightforward front-end implementation, IDX is a good option when it comes to workflow automation implementation.</p>\n<p><strong>JavaScript interfaces</strong></p>\n<p>This methodology uses a set of LoginRadius maintained JavaScript scripts that interact with the LoginRadius servers to retrieve the account configurations and generate embedded interfaces directly on your web property. </p>\n<p>JavaScript interfaces offer quick and easy implementation and limited development with predefined HTML layouts and JavaScript hooks, providing a high degree of customization.</p>\n<p><strong>API Integration</strong></p>\n<p>Unlike the other two,<a href=\"https://www.loginradius.com/identity-api/\"> API integration</a> methodology allows you to customize your interfaces. These interfaces will be connected to the LoginRadius APIs to handle the common client-side flows like Login and forget the password. </p>\n<p>Even though you can fully control the logical flows, it requires large resources during the initial implementation. </p>\n<h2 id=\"conclusion\" style=\"position:relative;\"><a href=\"#conclusion\" aria-label=\"conclusion permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Conclusion</h2>\n<p>Small and medium enterprises around the globe are expected to adopt business workflow automation on a large scale, creating a market of opportunity of US$ 1,600 million between 2017 and 2026. With its excellent built-in automation tools and solutions, multipurpose workflow software such as LoginRadius can help you meet your business goals by increasing efficiency, productivity, and other success factors. </p>\n<p><a href=\"https://www.loginradius.com/book-a-demo/\"><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 30.307692307692307%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsSAAALEgHS3X78AAABdElEQVQY002RO0/CUBzFG6PtbZWHCAmRmBB5P8vDII9SSC0omog4oAEGjZMO6OKEuLjoJ2Fx0cSBwUQnXZxcHPwux38LJA7nNvfec8+5v1tOCCiwpbbhye2BxbYgBMtgIRVioDRRsARGXxZUzLlEHmehBaesQ4rrEMPViYf2DR9nDGKkChbVICVqsMt1WJI1sHCFwhUsUIFohJH49TxECvRUjhDW2mAbB5iP6hB8hUkhiRPN5KIZYJdrsEYrcCSpmQqMm6/m9ylUhSulY7N5ivROB3L9GOlGF3Ktbc4zuz341UPw/uIk0ESbBjoSGlYIx8BfzjSwVmyCEYEUUmCPa3Bnd+hwC75yC95S05SxbolU/iEbOCFCpDexEfIioTNCNd6Tp6IlMnNuGeeDe3z//OLx5RWj5zFGT2O8fXxh/P4Ja6w6vSEFCnTIlW2YiDzhzX7ATFKojDlvjpBPcDF4QPdyiG5/iE7/BmfXd+hd3VKpCoG8fzxWw2+c+yTpAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"book-a-demo-loginradius\"\n        title=\"book-a-demo-loginradius\"\n        src=\"/static/fcc4c4b5dc38cc4528f99d09480f4eb2/e5715/book-a-demo-loginradius.png\"\n        srcset=\"/static/fcc4c4b5dc38cc4528f99d09480f4eb2/a6d36/book-a-demo-loginradius.png 650w,\n/static/fcc4c4b5dc38cc4528f99d09480f4eb2/e5715/book-a-demo-loginradius.png 768w,\n/static/fcc4c4b5dc38cc4528f99d09480f4eb2/63ff0/book-a-demo-loginradius.png 2887w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></a></p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n</style>","frontmatter":{"date":"April 14, 2021","updated_date":null,"description":"Workflow automation refers to the process of automating a set of manual processes or tasks based on a set of pre-defined rules or conditions. It helps you reduce the use of resources and time, more importantly, the chances of human-made errors. As a result, it improves a business’s overall efficiency, audibility, and accountability.","title":"Workflow Automation- What is it and Why Do You Need It?","tags":["workflow automation","scalability","cx"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":2.0833333333333335,"src":"/static/5f07a8f814565babb274e67618f84183/14b42/what-is-workflow-automation-cover.jpg","srcSet":"/static/5f07a8f814565babb274e67618f84183/f836f/what-is-workflow-automation-cover.jpg 200w,\n/static/5f07a8f814565babb274e67618f84183/2244e/what-is-workflow-automation-cover.jpg 400w,\n/static/5f07a8f814565babb274e67618f84183/14b42/what-is-workflow-automation-cover.jpg 800w,\n/static/5f07a8f814565babb274e67618f84183/16310/what-is-workflow-automation-cover.jpg 1024w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Navanita Devi","github":null,"avatar":null}}}},{"node":{"excerpt":"How Git Local Repository Works Let's understand how git set up a local repository\nOnce we initialize or clone any git project that will set…","fields":{"slug":"/engineering/how-git-local-repository-works/"},"html":"<h1 id=\"how-git-local-repository-works\" style=\"position:relative;\"><a href=\"#how-git-local-repository-works\" aria-label=\"how git local repository works permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>How Git Local Repository Works</h1>\n<p>Let's understand how git set up a local repository\nOnce we initialize or clone any git project that will set up a local project environment.</p>\n<p>that whole environment will look like the below picture </p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 46.61538461538461%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAABJ0AAASdAHeZh94AAABnklEQVQoz3VR2U7CUBDt/z/y6hLjm0+GJ6wLCSpiBRUpbSmllS6E0gKBQEopy/HOmEbjMsn03s6dOTPnjARhs9kMYThCHMUYj8fYZBn2+z0mkwniOBYecU6e+/zcQKv1Bk3ToKoqDMOAaZrIRJ1ESW3x8O50EEUhjI6JvuthMBigUX8SZ4Buz4ZSbyBJM1zflFE8P4OhqwL4BS+vTXRMC7Is8zAMqGk6LKsDP/DxprYZoN93Ua1WMRwO4fk+nup1npAAHNsULFaIBUC6zrBI1qg9Kl+ARE3TdVQqt/B9D+s05fEJrPpQw2uzyXdm01Zh2w4WiwW+2+3dvZAsgrTdbvGX/RdXFAWFQgHlsqBeLKJUKkG+vMLB4RGm0ymk3W73q4him82GQWk5dOYNwjCELtgEQYDjk1OULmTW3exanCvRJ0kSjEYjpjWfz7mQ4lREG+z1etydjJZlWZaQxueNe57HGruuK4bIPgFToRkJSr5cLhmMpqR7Pg3951NSU2riODZ8AZjH6WRA8p/6UYwWs1qtmAHFCDT3vO67JHT/ADhMn7ej6wRWAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"git-local-environment\"\n        title=\"git-local-environment\"\n        src=\"/static/808664775730f7970482cfbf83f9c1cf/e5715/localrepository.png\"\n        srcset=\"/static/808664775730f7970482cfbf83f9c1cf/a6d36/localrepository.png 650w,\n/static/808664775730f7970482cfbf83f9c1cf/e5715/localrepository.png 768w,\n/static/808664775730f7970482cfbf83f9c1cf/21482/localrepository.png 1350w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><strong>Project Folder</strong>: The main folder consists of a workspace and local repository</p>\n<p><strong>Work Directory</strong>: Inside Project Folder where we actually work,  we keep all files and perform many operations like addition, update, deletion of files</p>\n<p><strong>Local Repository</strong>: Here we don't actually change anything, this is handled automatically by git. this consists <strong>staging area</strong>, <strong>commit history</strong>, <strong>stash area</strong> etc.</p>\n<p>Let's get into it step by step and see how we perform command or action and behind the scene, git do its own activity. </p>\n<ul>\n<li>\n<p>Step 1. Git clone and project:\n<span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 15.846153846153847%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAr0lEQVQI13WNzQqCQBSFpxH8Q30e8Zl7gSDcRAQludFooh+FzBlBzFwUqJzwrtp04PAt7uU7zDAM2LYN0zRhWRaR8xkYY9A0jRgEAbquQ5IkqKoKQgiUpUSeZyjuJR6Fgjie0DwbsEngeR7VdV04jkNSXddp4FcYRRHqukaapsTbNcNmt8Q2XmC1DtG2r+mf4V8550Tf9zGOI5RSmCKlxDD0+Lx7HC4h9mKOcxbT7Qu2WI87LgIs9gAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"3\"\n        title=\"3\"\n        src=\"/static/1459d0fecf44f2077b4495fe7e2c9d30/e5715/3.png\"\n        srcset=\"/static/1459d0fecf44f2077b4495fe7e2c9d30/a6d36/3.png 650w,\n/static/1459d0fecf44f2077b4495fe7e2c9d30/e5715/3.png 768w,\n/static/1459d0fecf44f2077b4495fe7e2c9d30/d76ab/3.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 15.692307692307693%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAA1ElEQVQI1x2OO0vDYABFQ6ZAQkoeEjLksQSyJ/nfDi4+QLTaUHUQadRKoi1tWiyt/aKbCkfz3eUMF869iq7ruK6LbdtYliVpGAaaptF3iqKQ5zlCCKrqkY/dJ009Y7sRLBdr2uWaVfvO9PmFvdijeJ5HmqYkSUIcx/i+Lwccx/nngRQXRUEnOsY3I6r6nMvykKdmyN3DKeXtCeP7I4bXZ3TdF0r/KIoiwjAkCAIpGgwGmKYpn6qqSpZl/Hz/0q5mLHZXUlC3F8w3JdO3EZPmmNf5hD5/O9qQ15OmR9IAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"4\"\n        title=\"4\"\n        src=\"/static/37b235ac7bc6675864fd990467100e91/e5715/4.png\"\n        srcset=\"/static/37b235ac7bc6675864fd990467100e91/a6d36/4.png 650w,\n/static/37b235ac7bc6675864fd990467100e91/e5715/4.png 768w,\n/static/37b235ac7bc6675864fd990467100e91/d76ab/4.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n</li>\n<li>\n<p>Step 2. Explore what we got in repository\n<span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 15.692307692307693%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAoUlEQVQI11XOwQqEIBDGcfEU2aGsoEPUpWB7gqDe/2067LqwLjXjt6OHYMEfOIJ/VWVZwtY1qqq65XmOLMtgjIFSCuu6wnsPZkYI4Z+cEdE9q2ma8FgWzPOMcRzRdR1qeSBqmiaF933HcRxw7g3ieBE4L8Lz5fDx3+QiTlTf9xiGIcXivm1bWGtRFEWitca2bRJzuCTCEpQlggRIfsdJnKMffWycLAkZZicAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"5\"\n        title=\"5\"\n        src=\"/static/d106fd3e9c47d03c8e312c37f384b074/e5715/5.png\"\n        srcset=\"/static/d106fd3e9c47d03c8e312c37f384b074/a6d36/5.png 650w,\n/static/d106fd3e9c47d03c8e312c37f384b074/e5715/5.png 768w,\n/static/d106fd3e9c47d03c8e312c37f384b074/d76ab/5.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 15.692307692307693%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAwklEQVQI10WOS06EQBRFWQODaiE0XeEX23WInwU7cwuSGJsBabBDiYYWIgMnBFIeKQb6kpN7cwY3zwrDkDiOiaJoISYIAuROst367JYUYkOapqi65r1u+DyfKcuSruuoF9c0DafTK0op5nnG8n1/HUyShMv9FVJKjDOYLoTg/vaO5+KFh6dH1McbhzxnGAayLKOqKoqiWLvWGstxHP65wHXdPzzPw7Ztbq5T+u8v8vaI/tG0bYs58+U4jkzTRN/3q/sFhQ6YnhhHlOcAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"6\"\n        title=\"6\"\n        src=\"/static/55598410756c12990d2e729cbeb96f1a/e5715/6.png\"\n        srcset=\"/static/55598410756c12990d2e729cbeb96f1a/a6d36/6.png 650w,\n/static/55598410756c12990d2e729cbeb96f1a/e5715/6.png 768w,\n/static/55598410756c12990d2e729cbeb96f1a/d76ab/6.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n</li>\n<li>\n<p>Step 3. Do some modification in a files\n<span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 15.692307692307693%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAtElEQVQI11WOXQqCUBCFXYVP/iHWvfvQNl076EEoijC0umZhaUhvosmXtwehgY85HJhzxhBCIKVEzAVaz8ft+z6e5+G6LqZpEoYh6qIo8oLn40GaplRVhVKjVxSczyfyPKfvewzHcQiCADkihCSYzbBta8SeAhdhxOawZbleoe5Xdvs9TdMQxzFZlpEkyU8Pw4ChDy3L+kOXaKbAaEH9fpHcjnwYKMsSPfrLtm3puo66rn/eF8J9mRdGK9PhAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"7\"\n        title=\"7\"\n        src=\"/static/2f5ff2c421ac7c4ff9314589c4e38e90/e5715/7.png\"\n        srcset=\"/static/2f5ff2c421ac7c4ff9314589c4e38e90/a6d36/7.png 650w,\n/static/2f5ff2c421ac7c4ff9314589c4e38e90/e5715/7.png 768w,\n/static/2f5ff2c421ac7c4ff9314589c4e38e90/d76ab/7.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAx0lEQVQI1zWOwWqDQBCGFz2IiNUVbFEamqdID8mLlz5BL16aHLZow5ptMVXqoRfRytc1NAMf888MDJ+I4xhpuQlDwn+CIMDzPHzfRwjB5nHDqa4x2vB1PlOWJW3borXGGMPx+E5t79M0IR7WaxbuVyvyPCfLMtI0RcqYKIpwXZfddser2vP08oz+PLE/HOj7nqIoqKoKpdQlz/OMWOzukoRbKZGRtbU9sfMVx3Hswy3fPz3q441fZpqmYanFchgGxnGk67rL7g99A5PnN20uggAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"8\"\n        title=\"8\"\n        src=\"/static/a607dc975797d42a0ab7233510330102/e5715/8.png\"\n        srcset=\"/static/a607dc975797d42a0ab7233510330102/a6d36/8.png 650w,\n/static/a607dc975797d42a0ab7233510330102/e5715/8.png 768w,\n/static/a607dc975797d42a0ab7233510330102/d76ab/8.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n</li>\n<li>\n<p>Step 4. Add this file in to staging (ready for commit)\n<span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16.153846153846153%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAnUlEQVQI13WOsQ6CMBCGSxghlPch6iqv6uZbODlAaEJbY0KgOzAB6qdtHPWSL5e75P/uhJSSPM8D0vOZPVmWkSQJQgiKosAag2kNbhhomoa+70O31lLXNUoplmVBpGnKP7w0jmMOuz1tZzhdzujOorUOYS90zjF8j/gKQv/JL7wwiiLKY8nj9eR6q6juinEcQ3iaJtZ1Zds25nkOuzdyq5IiSDbhowAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"9\"\n        title=\"9\"\n        src=\"/static/9e0c5445d8afb14f821d3faae048e1be/e5715/9.png\"\n        srcset=\"/static/9e0c5445d8afb14f821d3faae048e1be/a6d36/9.png 650w,\n/static/9e0c5445d8afb14f821d3faae048e1be/e5715/9.png 768w,\n/static/9e0c5445d8afb14f821d3faae048e1be/d76ab/9.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16.153846153846153%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAArklEQVQI12XMTQuCQBSF4WkscsyV/RNx7/+H6MscMqVc6LQWCVKht2loEXThchb33Eeso4goWhOGIUEQoJTC8zyEEEgpXSZJQlleKIoC0xrO+kzTNOR5TlVVZFmG1pphGBBLf4kKFf7KR3qSxXzhkF8wjmMLtWz3O25tzVbv7PNowRPGGFp7++CfEe55Zld+U4g/ME1TVy7ris31wOZ+5PF60nUd4zgyTRN937vOG0lZj3sVzwZzAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"10\"\n        title=\"10\"\n        src=\"/static/cbefe1b9c76ef7554c405ccaec0ac44c/e5715/10.png\"\n        srcset=\"/static/cbefe1b9c76ef7554c405ccaec0ac44c/a6d36/10.png 650w,\n/static/cbefe1b9c76ef7554c405ccaec0ac44c/e5715/10.png 768w,\n/static/cbefe1b9c76ef7554c405ccaec0ac44c/d76ab/10.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n</li>\n<li>\n<p>Step 5. Commit the file\n<span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16.153846153846153%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAo0lEQVQI13WMwQqCQABExUOBCOqXeDW/PQgiCDtm6ppEkBYpdTAFsTVerdDRgccwc3iaZVk4jjNi2zZq/1HfbD5j4fukaYoQgvxyIRNHntUDkQiyLOMQhsRxTN/3aIZhMIVpmui6jud55HlOEifUr5plsGK937IONpT3kqIoiKIIFe0XplAy1a7r0nUdbdPyRrI57xD3E9fqxmcYkFLSNM0o/AITQpBCIUmmJgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"11\"\n        title=\"11\"\n        src=\"/static/715e8bc5eaacf7162c1b1150d4efbae0/e5715/11.png\"\n        srcset=\"/static/715e8bc5eaacf7162c1b1150d4efbae0/a6d36/11.png 650w,\n/static/715e8bc5eaacf7162c1b1150d4efbae0/e5715/11.png 768w,\n/static/715e8bc5eaacf7162c1b1150d4efbae0/d76ab/11.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16.153846153846153%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAtklEQVQI112Mu4qDUABEfYCNitj4+Atb/fJA2hBCZCtXcw1WGrnk1WiICBvOxkuqDByYYZjRgiAgimOiKGLxC57nKXzfx7IssiyjrmuEELRty+EguF6uHMWRpmkoioKqqpjnGS0MQ+L3Yfw5XbLjONi2jeu6GIZBmqZ0XadGj/HB/idn95uz2q6RUtL3PWVZskh7i290XVeYpqlykiRM08QwDGp0kj3yfmbT5pyfN15/L8ZxVN0/A0SRqFQoLAcAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"12\"\n        title=\"12\"\n        src=\"/static/129b4e7311b370cefbf9df51f1442c7d/e5715/12.png\"\n        srcset=\"/static/129b4e7311b370cefbf9df51f1442c7d/a6d36/12.png 650w,\n/static/129b4e7311b370cefbf9df51f1442c7d/e5715/12.png 768w,\n/static/129b4e7311b370cefbf9df51f1442c7d/d76ab/12.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n</li>\n<li>\n<p>Step 6. Push the changes\n<span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16.153846153846153%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAo0lEQVQI13WOzQqCQACEV7wp/jyKhwQfuy4+QRGditDd9VSpUBEk6UG2Dl+uh24NfAwMzDAiDEPiOJ6JouiH53n4vo/jOCzSlKrSaK2p65qylLRti5aay+k8uUJKiTEGYUv/CIIA13XJsoymaVBK0fevabziY95sDzuW65zVJqcoC6yEffAPOyaEIEkSxnFkGIa59Oy62ff3guNVc+se9EM/Z1/jhZACptMEmgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"13\"\n        title=\"13\"\n        src=\"/static/fad4d60001ffd8adcf4485daad7cfd9e/e5715/13.png\"\n        srcset=\"/static/fad4d60001ffd8adcf4485daad7cfd9e/a6d36/13.png 650w,\n/static/fad4d60001ffd8adcf4485daad7cfd9e/e5715/13.png 768w,\n/static/fad4d60001ffd8adcf4485daad7cfd9e/d76ab/13.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 16.153846153846153%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAADCAYAAACTWi8uAAAACXBIWXMAABJ0AAASdAHeZh94AAAAxklEQVQI1yWOTWuDQBRFB0QRFQQ/sFm7UZcV/3V32fQHZJtSkqrjojQYIaGlEXSj3ZxMpg8uBy7cxxFJkvC02fBgFEWEYUgQBLiui+s4CCF4Lku6rkNKSd/31HXNMAw0iqevE10jaZuWdV0RRVGQ5zlZlpGmKXEc6/i+r2MYBlVVMZzPNG3LNE36+Z8aH44HtrtXXnZb3j7eeZxwlIXnef9GKpZlYZqmpm3b2rBUhsuyMM+zHo3jqHkbb1x/v5E/n+wvR93dAWwlksDbUfdlAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"14\"\n        title=\"14\"\n        src=\"/static/ed2244f3d6a9668946ee6cfc78d5ef6f/e5715/14.png\"\n        srcset=\"/static/ed2244f3d6a9668946ee6cfc78d5ef6f/a6d36/14.png 650w,\n/static/ed2244f3d6a9668946ee6cfc78d5ef6f/e5715/14.png 768w,\n/static/ed2244f3d6a9668946ee6cfc78d5ef6f/d76ab/14.png 1731w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n</li>\n</ul>\n<p>Hope this makes clear how git handling things at the local repository.</p>\n<blockquote>\n<p>Note: <a href=\"https://compile7.org/decompile/how-to-automate-workflows-with-git-hooks/\">Click here to learn how you can automate your Git workflows with Hooks</a></p>\n</blockquote>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n</style>","frontmatter":{"date":"April 12, 2021","updated_date":null,"description":"In this article, I will talk about how Git Local Repository Works","title":"How Git Local Repository Works","tags":["GIT"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/326443284e0af982c65082fa6f3a393d/ee604/git.png","srcSet":"/static/326443284e0af982c65082fa6f3a393d/69585/git.png 200w,\n/static/326443284e0af982c65082fa6f3a393d/497c6/git.png 400w,\n/static/326443284e0af982c65082fa6f3a393d/ee604/git.png 800w,\n/static/326443284e0af982c65082fa6f3a393d/f3583/git.png 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Abhimanyu Singh Rathore","github":"abhir9","avatar":null}}}},{"node":{"excerpt":"Brand imagery is undoubtedly the most important step to convince your audience that your business is trustworthy and capable. Yes, your…","fields":{"slug":"/growth/does-your-website-imagery-reflect-your-brand-identity/"},"html":"<p>Brand imagery is undoubtedly the most important step to convince your audience that your business is trustworthy and capable.</p>\n<p>Yes, your website’s first impression is everything that paves the path for powerful brand identity in this digital era.</p>\n<p>Be honest, would you prefer services from a company with a gloomy layout website overloaded with text? Probably not, isn’t it?</p>\n<p>A business website should showcase a unique <strong><a href=\"https://www.loginradius.com/blog/identity/2020/10/loginradius-federated-identity-management/\">identity</a></strong> by efficiently utilizing the right collection of visual elements that leaves a positive impact on the visitor.</p>\n<p>The overall design, colors, and writing must quickly offer the right message to the audience for which they have obviously landed.</p>\n<p>Read on to learn the basics of a website’s imagery that impacts your <strong><a href=\"https://www.loginradius.com/blog/fuel/2021/03/how-to-make-businesses-marketing-plans-after-coronavirus/\">marketing strategies</a></strong> and how to craft an appealing experience for your site visitors.</p>\n<h2 id=\"what-is-brand-imagery\" style=\"position:relative;\"><a href=\"#what-is-brand-imagery\" aria-label=\"what is brand imagery permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>What is Brand Imagery</h2>\n<p>Brand imagery, in the simplest form, could be defined as the opportunity that visually connects your brand to your potential consumers.</p>\n<p>The visuals on your website, in any form, represent your brand identity in a way that conveys a strong message resulting in building assurance and reliability over time.</p>\n<p>Now, don’t get confused with brand imagery and brand image since many of you still consider them to be the same thing.</p>\n<p>As discussed earlier, <strong><a href=\"https://www.loginradius.com/blog/engineering/personal-branding-for-developers/\">brand imagery</a></strong> represents your identity through visuals including images, text, and colors while your brand image depicts your overall market repute and the way it’s perceived in the world.</p>\n<p>In a nutshell, your brand imagery is the first impression that a user gets by seeing your website.</p>\n<h2 id=\"5-ways-to-build-the-finest-brand-imagery-for-your-website\" style=\"position:relative;\"><a href=\"#5-ways-to-build-the-finest-brand-imagery-for-your-website\" aria-label=\"5 ways to build the finest brand imagery for your website permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>5 Ways to Build the Finest Brand Imagery for Your Website</h2>\n<p>It’s crucial to understand the persona of your targeted audience before you inch towards building a website for your product/services.</p>\n<p>Once you know who your targeted audience is, what they are expecting, the next step is to make sure you make them realize that yes, they’ve landed at the right spot.</p>\n<p>Here’s what needs to be done from your end.</p>\n<ol>\n<li>\n<h3 id=\"create-a-balance-of-content-infographics-and-videos\" style=\"position:relative;\"><a href=\"#create-a-balance-of-content-infographics-and-videos\" aria-label=\"create a balance of content infographics and videos permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Create a Balance of Content, Infographics, and Videos</h3>\n</li>\n</ol>\n<p>Since you may be aware of the fact that poweful <strong><a href=\"https://www.loginradius.com/blog/fuel/2021/03/how-to-drive-in-the-highest-quality-leads-in-2021-with-content-and-seo/\">content strategies</a></strong> is always remarkable, correct utilization of visuals and content is yet another powerful way of enhancing your brand imagery.</p>\n<p>No one likes to read long paragraphs on a landing page no matter how insightful they are. If the user isn’t getting the crux in the first 5-10 seconds, you may end up losing a potential client.</p>\n<p>So, what’s the correct way to gain the trust of a visitor in just a couple of seconds?</p>\n<p>Well, you need to understand the user persona of your targeted audience and then utilize infographics and text in a way that harmoniously conveys the message right away.</p>\n<p>Moreover, a video on your landing page is yet another great way to provide a quick insight about your product/service and how it solves the purpose.</p>\n<p>In a nutshell, businesses need to understand the importance of balanced use of text, video, and images on the landing page that engages the visitor.</p>\n<ol start=\"2\">\n<li>\n<h3 id=\"use-clickable-and-visually-encouraging-ctas\" style=\"position:relative;\"><a href=\"#use-clickable-and-visually-encouraging-ctas\" aria-label=\"use clickable and visually encouraging ctas permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Use Clickable and Visually Encouraging CTAs</h3>\n</li>\n</ol>\n<p>Call to action (CTA) plays a vital role in your converting your site visitor and <strong><a href=\"https://www.loginradius.com/blog/fuel/2021/03/how-to-drive-in-the-highest-quality-leads-in-2021-with-content-and-seo/\">quality leads</a></strong> into a potential client and further into a client.</p>\n<p>If you don’t know where and how to put the right call to action and <strong><a href=\"/blog/growth/sign-up-tips-conversion-rate/\">effective sign-up for conversions</a></strong>, you’ll not be able to generate  quality leads.</p>\n<p>Leverage graphical buttons as CTAs as they’re quite appealing and they encourage the user to move to the next step.</p>\n<p>Also read: <a href=\"https://www.loginradius.com/blog/growth/how-to-drive-in-the-highest-quality-leads-in-2021-with-content-and-seo/\">How to Drive in the Highest Quality Leads in 2021 with Content and SEO</a></p>\n<p>Choose bold colors and eye-catching fonts that further inspires the users to click.</p>\n<p>Moreover, if you wish that your visitors should fill a form on your website or subscribe to your newsletter, don’t forget to incorporate <a href=\"https://www.loginradius.com/blog/identity/2020/12/data-security-best-practices/\">data security best practices</a>.</p>\n<ol start=\"3\">\n<li>\n<h3 id=\"include-graphics-icons-for-enhanced-usability\" style=\"position:relative;\"><a href=\"#include-graphics-icons-for-enhanced-usability\" aria-label=\"include graphics icons for enhanced usability permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Include Graphics Icons for Enhanced Usability</h3>\n</li>\n</ol>\n<p>Graphic icons help visually indicate users to perform a certain task. This means if you’re a software vendor, putting different icons depicting the functionality of the software can help visitors better understand how the product would be beneficial for them.</p>\n<p>Apart from this, adding descriptive text along with interlinking to a specific feature page could be the icing on the cake.</p>\n<p>These icons when placed at the right spot can enhance user experience, which further builds brand value.</p>\n<p>So, if you’re planning to build a new website for your product or thinking to revamp your existing website, don’t forget to utilize the true potential of graphical icons.</p>\n<ol start=\"4\">\n<li>\n<h3 id=\"mobile-ready-design\" style=\"position:relative;\"><a href=\"#mobile-ready-design\" aria-label=\"mobile ready design permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Mobile-Ready Design</h3>\n</li>\n</ol>\n<p>Over <a href=\"https://www.statista.com/statistics/617136/digital-population-worldwide/\">90% of the total internet population use a mobile device</a> to access the internet, it becomes necessarily crucial for you to deliver a mobile-friendly experience.</p>\n<p>One should emphasize designing the website and place all the visual elements in a way that enhances the user experience for the visitors using a mobile device.</p>\n<p>Furthermore, a website offering seamless user experience on mobile devices also ranks in the top results of Google since users are finding the content relevant to them.</p>\n<ol start=\"5\">\n<li>\n<h3 id=\"optimize-your-images-for-seo\" style=\"position:relative;\"><a href=\"#optimize-your-images-for-seo\" aria-label=\"optimize your images for seo permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Optimize Your Images for SEO</h3>\n</li>\n</ol>\n<p>Images play a crucial role in increasing relevant traffic to your website. You need to optimize your images for SEO that can bring new visitors.</p>\n<p>Since optimized images with adequate Alt tags prominently get displayed into Google images search. This helps you to redirect your targeted audience to your website.</p>\n<p>Once a visitor finds relevant content around that specific image, your website automatically gains credibility.</p>\n<h2 id=\"conclusion\" style=\"position:relative;\"><a href=\"#conclusion\" aria-label=\"conclusion permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Conclusion</h2>\n<p>Building <a href=\"https://visme.co/blog/brand-identity/ \">brand identity</a> or imagery is an art coupled with science, which eventually requires you to put in your earnest efforts in understanding your audience and then catering to them.</p>\n<p>The perfect intermingling of text and graphics with the right choice of colors is the key to engage the audience and build trust.</p>\n<p>The aforementioned aspects help businesses in enhancing brand imagery that further improves brand identity in the long run.</p>\n<p><a href=\"https://www.loginradius.com/book-a-demo/\"><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 768px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 30.307692307692307%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsSAAALEgHS3X78AAABdElEQVQY002RO0/CUBzFG6PtbZWHCAmRmBB5P8vDII9SSC0omog4oAEGjZMO6OKEuLjoJ2Fx0cSBwUQnXZxcHPwux38LJA7nNvfec8+5v1tOCCiwpbbhye2BxbYgBMtgIRVioDRRsARGXxZUzLlEHmehBaesQ4rrEMPViYf2DR9nDGKkChbVICVqsMt1WJI1sHCFwhUsUIFohJH49TxECvRUjhDW2mAbB5iP6hB8hUkhiRPN5KIZYJdrsEYrcCSpmQqMm6/m9ylUhSulY7N5ivROB3L9GOlGF3Ktbc4zuz341UPw/uIk0ESbBjoSGlYIx8BfzjSwVmyCEYEUUmCPa3Bnd+hwC75yC95S05SxbolU/iEbOCFCpDexEfIioTNCNd6Tp6IlMnNuGeeDe3z//OLx5RWj5zFGT2O8fXxh/P4Ja6w6vSEFCnTIlW2YiDzhzX7ATFKojDlvjpBPcDF4QPdyiG5/iE7/BmfXd+hd3VKpCoG8fzxWw2+c+yTpAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"Book-a-demo\"\n        title=\"Book-a-demo\"\n        src=\"/static/fcc4c4b5dc38cc4528f99d09480f4eb2/e5715/book-a-demo-loginradius.png\"\n        srcset=\"/static/fcc4c4b5dc38cc4528f99d09480f4eb2/a6d36/book-a-demo-loginradius.png 650w,\n/static/fcc4c4b5dc38cc4528f99d09480f4eb2/e5715/book-a-demo-loginradius.png 768w,\n/static/fcc4c4b5dc38cc4528f99d09480f4eb2/63ff0/book-a-demo-loginradius.png 2887w\"\n        sizes=\"(max-width: 768px) 100vw, 768px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></a></p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n</style>","frontmatter":{"date":"April 09, 2021","updated_date":null,"description":"The visuals on your website, in any form, represent your brand identity in a way that conveys a strong message resulting in building assurance and reliability over time.  Read on to learn the basics of a website’s imagery that impacts your marketing and how to craft an appealing experience for your site visitors.","title":"Does Your Site’s Imagery Reflect Your Brand Identity","tags":null,"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/8130a1d6aa3367530ca06dc3c40877f2/14b42/website-branding-loginradius.jpg","srcSet":"/static/8130a1d6aa3367530ca06dc3c40877f2/f836f/website-branding-loginradius.jpg 200w,\n/static/8130a1d6aa3367530ca06dc3c40877f2/2244e/website-branding-loginradius.jpg 400w,\n/static/8130a1d6aa3367530ca06dc3c40877f2/14b42/website-branding-loginradius.jpg 800w,\n/static/8130a1d6aa3367530ca06dc3c40877f2/47498/website-branding-loginradius.jpg 1200w,\n/static/8130a1d6aa3367530ca06dc3c40877f2/0e329/website-branding-loginradius.jpg 1600w,\n/static/8130a1d6aa3367530ca06dc3c40877f2/7d7dd/website-branding-loginradius.jpg 4193w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Vishal Sharma","github":null,"avatar":null}}}}]},"markdownRemark":{"excerpt":"Identity is evolving, and developers are at the forefront of this transformation. Every day brings a new learning—adapting to new standards…","fields":{"slug":"/identity/developer-first-identity-provider-loginradius/"},"html":"<p>Identity is evolving, and developers are at the forefront of this transformation. Every day brings a new learning—adapting to new standards and refining approaches to building secure, seamless experiences.</p>\n<p>We’re here to support developers on that journey. We know how important simplicity, efficiency, and well-structured documentation are when working with identity and access management solutions. That’s why we’ve redesigned the <a href=\"https://www.loginradius.com/\">LoginRadius website</a>—to be faster, more intuitive, and developer-first in every way.</p>\n<p>The goal? Having them spend less time searching and more time building.</p>\n<h2 id=\"whats-new-and-improved-on-the-loginradius-website\" style=\"position:relative;\"><a href=\"#whats-new-and-improved-on-the-loginradius-website\" aria-label=\"whats new and improved on the loginradius website permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>What’s New and Improved on the LoginRadius Website?</h2>\n<p>LoginRadius’ vision is to give developers a product that simplifies identity management so they can focus on building, deploying, and scaling their applications. To enhance this experience, we’ve spent the last few months redesigning our interface— making navigation more intuitive and reassuring that essential resources are easily accessible.</p>\n<p>Here’s a closer look at what’s new and why it’s important:</p>\n<h3 id=\"a-developer-friendly-dark-theme\" style=\"position:relative;\"><a href=\"#a-developer-friendly-dark-theme\" aria-label=\"a developer friendly dark theme permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>A Developer-Friendly Dark Theme</h3>\n<p><img src=\"/f46881583c7518a93bb24e94c32320de/a-developer-friendly-dark-theme.webp\" alt=\"This image shows how LoginRadius offers several authentication methods like traditional login, social login, passwordless login, passkeys and more in a dark mode.\">    </p>\n<p>Developers spend long hours working in dark-themed IDEs and terminals, so we’ve designed the LoginRadius experience to be developer-friendly and align with that preference.</p>\n<p>The new dark mode reduces eye strain, enhances readability, and provides a seamless transition between a coding environment and our platform. Our new design features a clean, modern aesthetic with a consistent color scheme and Barlow typography, ensuring better readability. High-quality graphics and icons are thoughtfully placed to enhance the content without adding visual clutter.</p>\n<p>So, whether you’re navigating our API docs or configuring authentication into your system, our improved interface will make those extended development hours more comfortable and efficient.</p>\n<h3 id=\"clear-categorization-for-loginradius-capabilities\" style=\"position:relative;\"><a href=\"#clear-categorization-for-loginradius-capabilities\" aria-label=\"clear categorization for loginradius capabilities permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Clear Categorization for LoginRadius Capabilities</h3>\n<p><img src=\"/e5358b82be414940f3fb146013845933/capabilities.webp\" alt=\"This image shows a breakdown of all the LoginRadius CIAM capabilities, including authentication, security, UX, scalability and multi-brand management.\"></p>\n<p>We’ve restructured our website to provide a straightforward breakdown of our customer identity and access management platform capabilities, helping you quickly find what you need:</p>\n<ul>\n<li>Authentication: Easily understand <a href=\"https://www.loginradius.com/blog/identity/authentication-option-for-your-product/\">how to choose the right login method</a>, from traditional passwords and OTPs to social login, federated SSO, and passkeys with few lines of code.</li>\n<li>Security: Implement no-code security features like bot detection, IP throttling, breached password alerts, DDoS protection, and adaptive MFA to safeguard user accounts.</li>\n<li>User Experience: Leverage AI builder, hosted pages, and drag-and-drop workflows to create smooth, branded sign-up and login experiences.</li>\n<li>High Performance &#x26; Scalability: Confidently scale with sub-100ms API response times, 100% uptime, 240K+ RPS, and 28+ global data center regions.</li>\n<li>Multi-Brand Management: Efficiently manage multiple identity apps, choosing isolated or shared data stores based on your brand’s unique needs.</li>\n</ul>\n<p>This structured layout ensures you can quickly understand each capability and how it integrates into your identity ecosystem.</p>\n<h3 id=\"developer-first-navigation\" style=\"position:relative;\"><a href=\"#developer-first-navigation\" aria-label=\"developer first navigation permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Developer-First Navigation</h3>\n<p><img src=\"/a8c155c2b6faf3d5f4b4de4e2b14d763/developers-menu.webp\" alt=\"This image shows the LoginRadius menu bar, highlighting the developer dropdown.\">   </p>\n<p>We’ve been analyzing developer workflows to identify how you access key resources. That’s why we redesigned our navigation with one goal in mind: to reduce clicks and make essential resources readily available.</p>\n<p>The new LoginRadius structure puts APIs, SDKs, and integration guides right at the menu bar under the Developers dropdown so you can get started faster. Our Products, Solutions, and Customer Services are also clearly categorized, helping development teams quickly find the right tools and make informed decisions.</p>\n<h3 id=\"quick-understanding-of-integration-benefits\" style=\"position:relative;\"><a href=\"#quick-understanding-of-integration-benefits\" aria-label=\"quick understanding of integration benefits permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Quick Understanding of Integration Benefits</h3>\n<p><img src=\"/b2f9a964a2da0ea83e2f8596b833bba7/we-support-your-tech-stack.webp\" alt=\"This image shows a list of popular programming languages and frameworks offered by LoginRadius.\"></p>\n<p>Developers now have a clear view of the tech stack available with LoginRadius, designed to support diverse business needs.</p>\n<p>Our platform offers pre-built SDKs for Node.js, Python, Java, and more, making CIAM integration seamless across popular programming languages and frameworks.</p>\n<h2 id=\"over-to-you-now\" style=\"position:relative;\"><a href=\"#over-to-you-now\" aria-label=\"over to you now permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Over to You Now!</h2>\n<p>Check out our <a href=\"https://www.loginradius.com/\">revamped LoginRadius website</a> and see how the improved experience makes it easier to build, scale, and secure your applications.</p>\n<p>Do not forget to explore the improved navigation and API documentation, and get started with our free trial today. We’re excited to see what you’ll build with LoginRadius!</p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n</style>","frontmatter":{"date":"February 21, 2025","updated_date":null,"description":"LoginRadius’ vision is to give developers a product that simplifies identity management so they can focus on building, deploying, and scaling their applications. To enhance this experience, we’ve redesigned our website interface, making navigation more intuitive and reassuring that essential resources are easily accessible.","title":"Revamped & Ready: Introducing the New Developer-First LoginRadius Website","tags":["Developer tools","API","Identity Management","User Authentication"],"pinned":true,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.7857142857142858,"src":"/static/80b4e4fbe176a10a327d273504607f32/58556/hero-section.webp","srcSet":"/static/80b4e4fbe176a10a327d273504607f32/61e93/hero-section.webp 200w,\n/static/80b4e4fbe176a10a327d273504607f32/1f5c5/hero-section.webp 400w,\n/static/80b4e4fbe176a10a327d273504607f32/58556/hero-section.webp 800w,\n/static/80b4e4fbe176a10a327d273504607f32/99238/hero-section.webp 1200w,\n/static/80b4e4fbe176a10a327d273504607f32/7c22d/hero-section.webp 1600w,\n/static/80b4e4fbe176a10a327d273504607f32/1258b/hero-section.webp 2732w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Rakesh Soni","github":"oyesoni","avatar":"rakesh-soni.jpg"}}}},"pageContext":{"limit":6,"skip":516,"currentPage":87,"type":"///","numPages":161,"pinned":"ee8a4479-3471-53b1-bf62-d0d8dc3faaeb"}},"staticQueryHashes":["1171199041","1384082988","2100481360","23180105","528864852"]}