{"componentChunkName":"component---src-templates-blog-list-template-js","path":"/80","result":{"data":{"allMarkdownRemark":{"edges":[{"node":{"excerpt":"What is Web SSO and Why Does Your Business Need it? Consumers perceive your enterprise as a single entity and expect you to treat them like…","fields":{"slug":"/identity/what-is-web-sso/"},"html":"<h1 id=\"what-is-web-sso-and-why-does-your-business-need-it\" style=\"position:relative;\"><a href=\"#what-is-web-sso-and-why-does-your-business-need-it\" aria-label=\"what is web sso and why does your business need it 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 Web SSO and Why Does Your Business Need it?</h1>\n<p>Consumers perceive your enterprise as a single entity and expect you to treat them like a single entity. If you have multiple websites and mobile apps under the same company umbrella, there’s no reason you can’t meet this expectation.</p>\n<p>One solution is to eliminate the need to use multiple passwords. Instead, you can use a centralized authentication method to get the job done seamlessly using a web-based single sign-on (popularly known as Web SSO).</p>\n<p>Web SSO is a part of Single Sign-On that brings everything together. Each consumer has one account and one set of credentials that they can use anywhere to interact with your brand.</p>\n<p>Before we explain the web counterpart of SSO, let’s start with the basics.</p>\n<h2 id=\"what-is-single--sign-on\" style=\"position:relative;\"><a href=\"#what-is-single--sign-on\" aria-label=\"what is single  sign on 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 Single- Sign-On</h2>\n<p>Single sign-on is the process of authentication that allows consumers to access multiple applications and websites with a single login credential and an active login session.</p>\n<p>It prevents the need for the consumer to log in separately to the different applications/websites.</p>\n<p>The following are two examples of the Single Sign-On environments:</p>\n<ul>\n<li>Consumers access multiple applications of the same provider: Consumers don't need to create and remember separate credentials for each application; they log in once and access various applications of that provider. Example: Google, Youtube, Gmail, etc.</li>\n<li>Employees access numerous applications daily: Employees don't need to create and remember separate credentials for each application; they can log in once and access various applications used in the organization. Example: HR Portal, Resource Portal, Organizational Account, etc.</li>\n</ul>\n<p>Furthermore, SSO can also facilitate the following for a developer:</p>\n<ul>\n<li>Allow consumers to authenticate across multiple applications without re-prompting them to log in.</li>\n<li>Allow consumers to log in to all their SaaS applications by only typing the credentials once.</li>\n<li>Align SaaS applications with organizational IAM policies.</li>\n</ul>\n<blockquote>\n<p><strong>Note:</strong> With SSO implementation, the SLO (Single Logout) is also required, i.e., if a consumer has logged out from one application, they should be logged out from other linked applications too.</p>\n</blockquote>\n<h2 id=\"how-does-single-sign-on-work\" style=\"position:relative;\"><a href=\"#how-does-single-sign-on-work\" aria-label=\"how does single sign on 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 Single Sign-On Work</h2>\n<p>As already mentioned, consumers want to log into a single place and access all of their favorite sites and services using their preferred login credentials.</p>\n<p>It simplifies the authentication and login process for enterprise consumers. Here's how SSO works:</p>\n<ol>\n<li>When consumers land on a page included in the SSO grouping, the first step is to check and request access to the site or application.</li>\n<li>The site checks to see if your identity has been authenticated with the SSO provider. If the SSO session was not present, it either goes into the logout function or redirects the page to the logout URL. Here, consumers redirect to the authentication interface where they can log in with credentials. (i.e., username and password).</li>\n<li>Consumers enter their login credentials.</li>\n<li>The SSO solution requests authentication from the identity provider your company uses.</li>\n<li>The identity provider confirms the consumer's identity to the SSO solution.</li>\n<li>After confirmation, it is redirected to the original website and redirects consumers to the site.</li>\n<li>As consumers navigate the website, the site tracks page to page using tokens, reauthenticating the identity. If consumers go to another website or application, that site will check the identity with the SSO solution. Since consumers are already logged in, their identities are automatically verified with the new site, and they don't need to log in again.</li>\n</ol>\n<h3 id=\"sso-components-explained\" style=\"position:relative;\"><a href=\"#sso-components-explained\" aria-label=\"sso components explained 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>SSO Components: Explained</h3>\n<ul>\n<li>Service Provider: They are applications a consumer visits for service—for example, eCommerce applications. In the SSO ecosystem, the SP is considered a Slave.</li>\n<li>Identity Provider: The service provider receives the consumer authentication status from the Identity Provider. In the SSO ecosystem, the IDP is considered a Master.</li>\n</ul>\n<p>Your organization can implement SSO in the following ways:</p>\n<ul>\n<li>Web SSO: When a single sign-on is required between two or more web applications.</li>\n<li>Mobile SSO: When a single sign-on is required between two or more mobile apps.</li>\n<li>Federated SSO: When a single sign-on is required between third-party applications.</li>\n</ul>\n<p>In the next section of this blog, we are going to discuss only the Web SSO.</p>\n<h2 id=\"what-is-web-sso\" style=\"position:relative;\"><a href=\"#what-is-web-sso\" aria-label=\"what is web sso 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 Web SSO</h2>\n<p><a href=\"https://www.loginradius.com/web-and-mobile-sso/\">Web SSO</a> is a method of browser-based session management that utilizes browser storage mechanisms like sessionStorage, localStorage, Cookies to maintain the consumer's session across your applications.</p>\n<p>A centralized domain is used to serve the authentication on request, and this centralized domain shares the session with authorized applications.</p>\n<p>So that consumer's logged in to a single application automatically log into another application, independent of the platform or domain the consumer is using.</p>\n<h2 id=\"why-does-your-business-needs-web-sso\" style=\"position:relative;\"><a href=\"#why-does-your-business-needs-web-sso\" aria-label=\"why does your business needs web sso 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 Does Your Business Needs Web SSO</h2>\n<p>Single sign-on directly benefits your organization by gathering a wealth of consumer data and credentials securely in one spot for your services, teams, and applications to use.</p>\n<p>Failing to use SSO will make your consumers notice you in a bad light as they try to navigate your apps and services.</p>\n<p>By contrast, product managers who bring an SSO solution to their organization will stand out because of the many benefits that single sign-on provides for your business:</p>\n<h3 id=\"1-increases-the-productivity-of-it-employees\" style=\"position:relative;\"><a href=\"#1-increases-the-productivity-of-it-employees\" aria-label=\"1 increases the productivity of it employees 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. Increases the productivity of IT employees</h3>\n<p>Relatively speaking, a single point of access minimizes the time consumers spend dealing with password-related issues/concerns and resources. With a single sign-on, you can:</p>\n<ul>\n<li>Reduce support calls: Consumers with just one password to access all their apps won't require assistance as often.</li>\n<li>Improve consumer experience: Since there's no need to hop between multiple login URLs or reset passwords, consumers reduce the time between 10 to 15 seconds on every sign-in.</li>\n<li>Mitigate security risks: Without risking the security, employees can use SSO functionality for login with their single set of credentials on any device, in any web browser.</li>\n</ul>\n<p>As we can see, the ability to increase the productivity of consumers is one of the most significant benefits of single sign-on.</p>\n<h3 id=\"2-security-capabilities-improve\" style=\"position:relative;\"><a href=\"#2-security-capabilities-improve\" aria-label=\"2 security capabilities improve 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. Security capabilities improve</h3>\n<p>A few misconceptions regarding the SSO solution implementation, like it weakens the security in case if a master password is stolen, all associated accounts will be compromised.</p>\n<p>This appears to be true in theory, but with common-sense practices, we can reduce password theft with the help of SSO.</p>\n<p>Since consumers only need to remember one password for multiple applications, they're more likely to create a stronger (harder to guess) passphrase and reduce risk by minimizing lousy password habits.</p>\n<p>The following section will discuss how a single sign-on strategy can also be combined with <a href=\"https://www.loginradius.com/blog/2019/06/what-is-multi-factor-authentication/\">multi-factor authentication (MFA)</a> for extra security.</p>\n<h3 id=\"3-combines-risk-based-authentication-rba-with-sso\" style=\"position:relative;\"><a href=\"#3-combines-risk-based-authentication-rba-with-sso\" aria-label=\"3 combines risk based authentication rba with sso 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. Combines Risk-Based Authentication (RBA) with SSO</h3>\n<p>As mentioned earlier, SSO gives your consumer one \"key\" to sign in to multiple web properties, mobile apps, and third-party systems using one single identity.</p>\n<p>For even more security, you can combine SSO with risk-based authentication (RBA), where organizations and their security team can monitor consumer patterns.</p>\n<p>This way, if you see any unusual consumer behavior, such as the wrong IP, or multiple login failures, an organization can ask for extra verification of identity; if the consumer fails at this point, the organization can block or suspend their access to the account.</p>\n<p>By using this effective combination, organizations can prevent cyberattacks on their websites or apps. They can feel safe from cybercriminals from stealing data or draining IT resources.</p>\n<h3 id=\"4-eliminates-password-fatigue\" style=\"position:relative;\"><a href=\"#4-eliminates-password-fatigue\" aria-label=\"4 eliminates password fatigue 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. Eliminates password fatigue</h3>\n<p>Cybercrime can be prevented. Security professionals demand a unique password for every single application. It means that the average consumer must remember a lot of passwords for office and personal usage.</p>\n<p>Unfortunately, this often leads to \"password fatigue.\" How does password fatigue hurt enterprises? In short, more passwords, more problems.</p>\n<p>If consumers are experiencing a challenging time signing in, they'll leave the organization's app or site before the conversion.</p>\n<p>A <a href=\"https://baymard.com/blog/password-requirements-and-password-reset\">recent usability study</a> by Baymard Institute proves this point. In this study, Baymard tested existing account consumers at two e-commerce sites (Amazon and ASOS) and found that 18.75% of consumers abandon their carts due to forgotten passwords or password reset issues.</p>\n<p>This is the considerable benefit of web SSO that it's only one password for consumers to remember for all of the enterprise's applications and websites.</p>\n<h3 id=\"5-streamlines-the-consumer-experience\" style=\"position:relative;\"><a href=\"#5-streamlines-the-consumer-experience\" aria-label=\"5 streamlines the consumer experience 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. Streamlines the consumer experience</h3>\n<p>As repeated logins are no longer required with SSO, consumers can enjoy a modern digital experience. The benefits for enterprises include consumer satisfaction, an increase in loyalty, and higher conversion rates.</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>In this article, we talked about the functionality, concept, and how Web Single-Sign-On can <a href=\"https://www.loginradius.com/blog/identity/2021/03/calcualting-roi-build-vs-buy/\">enhance business ROI</a>. We learned how it increases agility, security, convenience and streamlines the experience for your business and consumers alike.</p>\n<p>However, before implementing any functionality on your website, analyze and consider the pros and cons from every possible angle.</p>\n<p>Cheers!</p>\n<p><a href=\"https://www.loginradius.com/contact-us?utm_source=blog&#x26;utm_medium=web&#x26;utm_campaign=what-is-web-sso\"><img src=\"/8fce571f703a5970dbb1359a2fe0e51a/book-a-demo-loginradius.webp\" alt=\"book-a-demo-loginradius\"></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":"June 10, 2021","updated_date":null,"description":" Web SSO is a part of Single Sign-On that brings everything together. Each consumer has one account and one set of credentials that they can use anywhere to interact with your brand. Failing to use SSO will make your consumers notice you in a bad light as they try to navigate your apps and services.","title":"What is Web SSO","tags":["web sso","mfa","data security"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.6129032258064515,"src":"/static/bee618114da3fc8156bfae628d5ba6f1/7f8e9/web-sso.webp","srcSet":"/static/bee618114da3fc8156bfae628d5ba6f1/61e93/web-sso.webp 200w,\n/static/bee618114da3fc8156bfae628d5ba6f1/1f5c5/web-sso.webp 400w,\n/static/bee618114da3fc8156bfae628d5ba6f1/7f8e9/web-sso.webp 768w","sizes":"(max-width: 768px) 100vw, 768px"}}},"author":{"id":"Vaibhav Jain","github":null,"avatar":null}}}},{"node":{"excerpt":"React's Context API Guide with Example In this blog, You will learn What React's Context API is and how to use React's Context API. It is…","fields":{"slug":"/engineering/react-context-api-guide-with-example/"},"html":"<h1 id=\"reacts-context-api-guide-with-example\" style=\"position:relative;\"><a href=\"#reacts-context-api-guide-with-example\" aria-label=\"reacts context api guide with example 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>React's Context API Guide with Example</h1>\n<p>In this blog, You will learn What React's Context API is and how to use React's Context API. It is very much used as a state management tool, oftentimes replacing Redux.<br>\nAccording to the React doc: </p>\n<blockquote>\n<p>Context provides a way to pass data through the component tree\nwithout having to pass props down manually at every level.</p>\n</blockquote>\n<p>To be more clear, this provides a way for you to make values available to all components of your application, no matter how complicated your application is.</p>\n<h2 id=\"when-to-use-context\" style=\"position:relative;\"><a href=\"#when-to-use-context\" aria-label=\"when to use context 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>When to use context</h2>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"0\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk11\">App</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\">return</span><span class=\"mtk1\">(</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk17\">&lt;</span><span class=\"mtk10\">ParentClass</span><span class=\"mtk1\"> </span><span class=\"mtk12\">color</span><span class=\"mtk1\">= </span><span class=\"mtk8\">&quot;blue&quot;</span><span class=\"mtk17\">/&gt;</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=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk11\">ParentClass</span><span class=\"mtk1\"> = (</span><span class=\"mtk12\">props</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=\"mtk17\">&lt;</span><span class=\"mtk10\">ChildClass</span><span class=\"mtk1\"> </span><span class=\"mtk12\">color</span><span class=\"mtk1\">= </span><span class=\"mtk4\">{</span><span class=\"mtk12\">props</span><span class=\"mtk1\">.</span><span class=\"mtk12\">color</span><span class=\"mtk4\">}</span><span class=\"mtk1\"> </span><span class=\"mtk17\">/&gt;</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=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk11\">ChildClass</span><span class=\"mtk1\"> = (</span><span class=\"mtk12\">props</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=\"mtk17\">&lt;</span><span class=\"mtk10\">GrandChildClass</span><span class=\"mtk1\"> </span><span class=\"mtk12\">color</span><span class=\"mtk1\">= </span><span class=\"mtk4\">{</span><span class=\"mtk12\">props</span><span class=\"mtk1\">.</span><span class=\"mtk12\">color</span><span class=\"mtk4\">}</span><span class=\"mtk1\"> </span><span class=\"mtk17\">/&gt;</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=\"mtk4\">const</span><span class=\"mtk1\"> </span><span class=\"mtk11\">GrandChildClass</span><span class=\"mtk1\"> = (</span><span class=\"mtk12\">props</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=\"mtk17\">&lt;</span><span class=\"mtk4\">p</span><span class=\"mtk17\">&gt;</span><span class=\"mtk1\">Color: </span><span class=\"mtk4\">{</span><span class=\"mtk12\">props</span><span class=\"mtk1\">.</span><span class=\"mtk12\">color</span><span class=\"mtk4\">}</span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">p</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">)</span></span></code></pre>\n<p>In the above code, we designed the application in which used color props in the ParentClass and passed that props to all component (top to down) without checking that it is required by the child class or not and another issue also here that in case if GrandChildClass component was more deeply nested than it was very difficult to manage. This is the problem that <code>Context</code> solves. Context is designed the share values that can be considered \"global\" such as preferred language, current user, or theme. </p>\n<p>Using context, we can avoid passing props. Let's create the above example code using context:</p>\n<p>We will create a separate component for context that we can use throughout the components.\nOnce you have initialized your project, create a file called ColorContext.js in your <code>/src</code> folder.</p>\n<h3 id=\"create-context\" style=\"position:relative;\"><a href=\"#create-context\" aria-label=\"create context 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 Context</h3>\n<p>Using React.createContext, we can create context and pass anything as an argument to <code>React.createContext</code>. In our case, we are passing \"white\" color to provide a light theme.</p>\n<p>This will also give me  <code>ColorContext.Provider</code>  and  <code>ColorContext.Consumer</code>. What these two components do is straightforward:</p>\n<ul>\n<li><strong>Provider</strong>  - The component that provides the value</li>\n<li><strong>Consumer</strong>  - A component that is consuming the value</li>\n<li>\n<p>import React from \"react\";</p>\n<p>const ColorContext = React.createContext(\"white\");\nexport default ColorContext;</p>\n</li>\n</ul>\n<p>To use this context all over the components, we have to use the provider. According to React document, every context object comes with a Provider React component that allows consuming components to subscribe to context changes.</p>\n<h3 id=\"providing-context\" style=\"position:relative;\"><a href=\"#providing-context\" aria-label=\"providing context 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>Providing Context</h3>\n<p>After successfully creating context, we can import context and use it to create our provider.\nAs we want to access context in the entire application, we need to wrap our app in <code>ColorContext.Provider</code>.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"1\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\"> </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./ColorContext&#39;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk4\">function</span><span class=\"mtk1\"> </span><span class=\"mtk11\">App</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\">color</span><span class=\"mtk1\">= </span><span class=\"mtk8\">&quot;white&quot;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk15\">return</span><span class=\"mtk1\"> (</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk17\">&lt;</span><span class=\"mtk10\">ColorContext.Provider</span><span class=\"mtk1\"> </span><span class=\"mtk12\">value</span><span class=\"mtk1\"> = </span><span class=\"mtk4\">{</span><span class=\"mtk12\">color</span><span class=\"mtk4\">}</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">            </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">div</span><span class=\"mtk1\"> </span><span class=\"mtk12\">className</span><span class=\"mtk1\">=</span><span class=\"mtk8\">&quot;App&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\">header</span><span class=\"mtk1\"> </span><span class=\"mtk12\">className</span><span class=\"mtk1\">=</span><span class=\"mtk8\">&quot;App-header&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\">img</span><span class=\"mtk1\"> </span><span class=\"mtk12\">src</span><span class=\"mtk1\">=</span><span class=\"mtk4\">{</span><span class=\"mtk12\">logo</span><span class=\"mtk4\">}</span><span class=\"mtk1\"> </span><span class=\"mtk12\">className</span><span class=\"mtk1\">=</span><span class=\"mtk8\">&quot;App-logo&quot;</span><span class=\"mtk1\"> </span><span class=\"mtk12\">alt</span><span class=\"mtk1\">=</span><span class=\"mtk8\">&quot;logo&quot;</span><span class=\"mtk1\"> </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=\"mtk1\"> </span><span class=\"mtk12\">className</span><span class=\"mtk1\">=</span><span class=\"mtk8\">&quot;App-title&quot;</span><span class=\"mtk17\">&gt;</span><span class=\"mtk1\">Welcome to my web page</span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">h1</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">              </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">header</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">                </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk10\">ColorContext.Provider</span><span class=\"mtk17\">&gt;</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<h3 id=\"consuming-the-context\" style=\"position:relative;\"><a href=\"#consuming-the-context\" aria-label=\"consuming the context 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>Consuming the context</h3>\n<p>The approach to providing context is the same for class and functional components but consuming is a little different for both.</p>\n<h4 id=\"class-component\" style=\"position:relative;\"><a href=\"#class-component\" aria-label=\"class component 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>class component</h4>\n<p>Mainly used way to accessing context in class component using static <code>contextType</code>. After that, you can access the context value using <code>this.context</code>.  You can refer to it in any lifecycle method and even in the render method.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"2\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\"> </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./ColorContext&#39;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Page</span><span class=\"mtk1\"> </span><span class=\"mtk4\">extends</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Component</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk4\">static</span><span class=\"mtk1\"> </span><span class=\"mtk12\">contextType</span><span class=\"mtk1\"> = </span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">componentDidMount</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\">colorValue</span><span class=\"mtk1\">= </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">context</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk10\">console</span><span class=\"mtk1\">.</span><span class=\"mtk11\">log</span><span class=\"mtk1\">(</span><span class=\"mtk12\">colorValue</span><span class=\"mtk1\">) </span><span class=\"mtk3\">//  &quot;white&quot; </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\">render</span><span class=\"mtk1\">() {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk15\">return</span><span class=\"mtk1\"> </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</span><span class=\"mtk1\">Color Value is </span><span class=\"mtk4\">{</span><span class=\"mtk12\">colorValue</span><span class=\"mtk4\">}</span><span class=\"mtk1\"> </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</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>The traditional way to accessing context values is by wrapping the child component in <code>Consumer</code>. From there, You can access values as props.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"3\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\">} </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./ColorContext&#39;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Page</span><span class=\"mtk1\"> </span><span class=\"mtk4\">extends</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Component</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">render</span><span class=\"mtk1\">() {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk15\">return</span><span class=\"mtk1\"> (</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&lt;</span><span class=\"mtk10\">ColorContext.Consumer</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk4\">{</span><span class=\"mtk1\">(</span><span class=\"mtk12\">props</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\">return</span><span class=\"mtk1\"> </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</span><span class=\"mtk4\">{</span><span class=\"mtk12\">props</span><span class=\"mtk4\">}</span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        }</span><span class=\"mtk4\">}</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk10\">ColorContext.Consumer</span><span class=\"mtk17\">&gt;</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<h4 id=\"functional-component-and-hooks\" style=\"position:relative;\"><a href=\"#functional-component-and-hooks\" aria-label=\"functional component and hooks 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>Functional component and Hooks</h4>\n<p> You can use <code>useContext</code>in functional components and its equivalent of <code>static contextType</code>. \t</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"4\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">React</span><span class=\"mtk1\">, { </span><span class=\"mtk12\">useContext</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;react&#39;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">ColorContextfrom</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./ColorContext&#39;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk12\">export</span><span class=\"mtk1\"> </span><span class=\"mtk12\">const</span><span class=\"mtk1\"> </span><span class=\"mtk12\">HomePage</span><span class=\"mtk1\"> = () =&gt; {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">const</span><span class=\"mtk1\"> </span><span class=\"mtk12\">colorValue</span><span class=\"mtk1\">= </span><span class=\"mtk12\">useContext</span><span class=\"mtk1\">(</span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\">)</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">return</span><span class=\"mtk1\"> &lt;</span><span class=\"mtk12\">div</span><span class=\"mtk1\">&gt;{</span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\">}&lt;/</span><span class=\"mtk12\">div</span><span class=\"mtk1\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">}</span></span></code></pre>\n<h3 id=\"updating-context\" style=\"position:relative;\"><a href=\"#updating-context\" aria-label=\"updating context 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>Updating Context</h3>\n<p>We can update the context by updating the normal state. We just need to create a wrapper class that contains the state of context and the method to update it.\nExample code with file <code>ColorContext.js</code></p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"5\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">React</span><span class=\"mtk1\">, { </span><span class=\"mtk12\">Component</span><span class=\"mtk1\"> } </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;react&#39;</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\">ColorContext</span><span class=\"mtk1\"> = </span><span class=\"mtk12\">React</span><span class=\"mtk1\">.</span><span class=\"mtk11\">createContext</span><span class=\"mtk1\">()</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">ColorContextProvider</span><span class=\"mtk1\"> </span><span class=\"mtk4\">extends</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Component</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk3\">// Context state</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk12\">state</span><span class=\"mtk1\"> = {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk12\">color:</span><span class=\"mtk8\">&quot;&quot;</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=\"mtk3\">// Method to update state</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">setColor</span><span class=\"mtk1\"> = (</span><span class=\"mtk12\">color</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=\"mtk11\">setState</span><span class=\"mtk1\">((</span><span class=\"mtk12\">prevState</span><span class=\"mtk1\">) </span><span class=\"mtk4\">=&gt;</span><span class=\"mtk1\"> ({ </span><span class=\"mtk12\">color</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\">render</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\">children</span><span class=\"mtk1\"> } = </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">props</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk4\">const</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">color</span><span class=\"mtk1\"> } = </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">state</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk15\">return</span><span class=\"mtk1\"> (</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&lt;</span><span class=\"mtk10\">ColorContext.Provider</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk12\">value</span><span class=\"mtk1\">=</span><span class=\"mtk4\">{</span><span class=\"mtk1\">{</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          </span><span class=\"mtk12\">color</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          this.</span><span class=\"mtk12\">setColor</span><span class=\"mtk1\">,</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        }</span><span class=\"mtk4\">}</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk4\">{</span><span class=\"mtk12\">children</span><span class=\"mtk4\">}</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk10\">ColorContext.Provider</span><span class=\"mtk17\">&gt;</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=\"mtk15\">export</span><span class=\"mtk1\"> </span><span class=\"mtk15\">default</span><span class=\"mtk1\"> </span><span class=\"mtk12\">ColorContext</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk15\">export</span><span class=\"mtk1\"> { </span><span class=\"mtk12\">ColorContextProvider</span><span class=\"mtk1\"> }</span></span></code></pre>\n<p>Now you can update and view the user from the Context method.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"js\" data-index=\"6\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk15\">import</span><span class=\"mtk1\"> </span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\"> </span><span class=\"mtk15\">from</span><span class=\"mtk1\"> </span><span class=\"mtk8\">&#39;./ColorContext&#39;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk4\">class</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Page</span><span class=\"mtk1\"> </span><span class=\"mtk4\">extends</span><span class=\"mtk1\"> </span><span class=\"mtk10\">Component</span><span class=\"mtk1\"> {</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk4\">static</span><span class=\"mtk1\"> </span><span class=\"mtk12\">contextType</span><span class=\"mtk1\"> = </span><span class=\"mtk12\">ColorContext</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">  </span><span class=\"mtk11\">render</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\">color</span><span class=\"mtk1\">, </span><span class=\"mtk12\">setColor</span><span class=\"mtk1\"> } = </span><span class=\"mtk4\">this</span><span class=\"mtk1\">.</span><span class=\"mtk12\">context</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">    </span><span class=\"mtk15\">return</span><span class=\"mtk1\"> (</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">button</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          </span><span class=\"mtk12\">onClick</span><span class=\"mtk1\">=</span><span class=\"mtk4\">{</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\">const</span><span class=\"mtk1\"> </span><span class=\"mtk12\">newColorValue</span><span class=\"mtk1\">= </span><span class=\"mtk8\">&quot;black&quot;</span><span class=\"mtk1\">;</span></span>\n<span class=\"grvsc-line\"></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">            </span><span class=\"mtk11\">setColor</span><span class=\"mtk1\"> (</span><span class=\"mtk12\">newColorValue</span><span class=\"mtk1\">)</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          }</span><span class=\"mtk4\">}</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">          Update Color</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">button</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">        </span><span class=\"mtk17\">&lt;</span><span class=\"mtk4\">p</span><span class=\"mtk17\">&gt;</span><span class=\"mtk4\">{</span><span class=\"mtk8\">`Current Color Value: </span><span class=\"mtk4\">${</span><span class=\"mtk12\">color</span><span class=\"mtk4\">}</span><span class=\"mtk8\">`</span><span class=\"mtk4\">}</span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">p</span><span class=\"mtk17\">&gt;</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">      </span><span class=\"mtk17\">&lt;/</span><span class=\"mtk4\">div</span><span class=\"mtk17\">&gt;</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>In my opinion, It is much easier to use than Redux and requires very little code, so why wouldn't you use it?</p>\n<p>The problem with the context is simple: ** Everything that consumes the context re-renders each time the state of that reference changes. **</p>\n<p>This means that if you're consuming your context everywhere in your app, or worse, using one context for the state of your entire app, you'll end up re-rendering a ton everywhere.</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 .mtk4 { color: #569CD6; }\n  .dark-default-dark .mtk1 { color: #D4D4D4; }\n  .dark-default-dark .mtk11 { color: #DCDCAA; }\n  .dark-default-dark .mtk15 { color: #C586C0; }\n  .dark-default-dark .mtk17 { color: #808080; }\n  .dark-default-dark .mtk10 { color: #4EC9B0; }\n  .dark-default-dark .mtk12 { color: #9CDCFE; }\n  .dark-default-dark .mtk8 { color: #CE9178; }\n  .dark-default-dark .mtk3 { color: #6A9955; }\n</style>","frontmatter":{"date":"June 09, 2021","updated_date":null,"description":"Deep Dive into React's Context API with example","title":"React's Context API Guide with Example","tags":["React","Redux","Hooks"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/6a87bd8ebde082f5a6d9c7c0bb658776/58556/title-image.webp","srcSet":"/static/6a87bd8ebde082f5a6d9c7c0bb658776/61e93/title-image.webp 200w,\n/static/6a87bd8ebde082f5a6d9c7c0bb658776/1f5c5/title-image.webp 400w,\n/static/6a87bd8ebde082f5a6d9c7c0bb658776/58556/title-image.webp 800w,\n/static/6a87bd8ebde082f5a6d9c7c0bb658776/99238/title-image.webp 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Versha Gupta","github":"vershagupta","avatar":null}}}},{"node":{"excerpt":"Today a large number of professionals are working remotely from different locations due to the pandemic. Are you worried that your marketing…","fields":{"slug":"/growth/best-brainstorming-tools-and-techniques/"},"html":"<p>Today a large number of professionals are working remotely from different locations due to the pandemic. Are you worried that your marketing team won't be able to generate profitable ideas from isolation? Don't worry! According to a <a href=\"https://www.cosocloud.com/press-releases/connectsolutions-survey-shows-working-remotely-benefits-employers-and-employees\">report by CoSo Cloud</a>, 77% of work from home workers have become more productive during isolation.</p>\n<p>Wondering how?</p>\n<p>Research shows that <em>80% of remote workers</em> say that their productivity has improved with real-time collaborative solutions. Virtual  brainstorming tools can help you grow your ideas, rethink your marketing strategies, and collaborate theme for successful outcomes.</p>\n<p>A brainstorming tool is strategically designed to help organize and gather ideas. It helps in collaborative brainstorming online, making it easier to harness collective mentality to <a href=\"https://www.loginradius.com/blog/fuel/20-content-ideas-for-most-engaging-b2b-linkedin-posts/\">create content strategies</a>.</p>\n<p>So, let's start your online brainstorming practice  tips with the tools first.</p>\n<h2 id=\"5-best-brainstorming-tools\" style=\"position:relative;\"><a href=\"#5-best-brainstorming-tools\" aria-label=\"5 best brainstorming tools 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 Best Brainstorming Tools</h2>\n<h3 id=\"1-ideaboardz\" style=\"position:relative;\"><a href=\"#1-ideaboardz\" aria-label=\"1 ideaboardz 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. IdeaBoardz</h3>\n<p>IdeaBoardz is an easy-to-use collaborative brainstorming tool that can help your team members to combine their ideas in one location online. With the help of this tool, your teammates can post notes on a collaborative board and even export the board as a PDF or excel file.</p>\n<h3 id=\"2-google-documents\" style=\"position:relative;\"><a href=\"#2-google-documents\" aria-label=\"2 google documents 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. Google Documents</h3>\n<p>Google Documents is a popular tool to use for brainstorming as it has all the resources that your team may need during brainstorming. It supports multiple files, including TXT, PDF, DOCX, and HTML. Plus, it lets team members track changes in the docs too.</p>\n<h3 id=\"3-coggle\" style=\"position:relative;\"><a href=\"#3-coggle\" aria-label=\"3 coggle 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. Coggle</h3>\n<p>Coggle is another result-oriented brainstorming tool that allows real-time collaboration. It helps share flow charts, complex algorithms, diagrams, mind maps effortlessly with other team members. Plus, Coggle allows unlimited image uploads, the addition of floating texts, etc.</p>\n<h3 id=\"4-wisemapping\" style=\"position:relative;\"><a href=\"#4-wisemapping\" aria-label=\"4 wisemapping 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. WiseMapping</h3>\n<p>WiseMapping is an effective tool for brainstorming and mind mapping. This tool is apt for small groups and individuals. Plus, one can install it on their devices or use it online. Moreover, WiseMapping is a free tool for even business users and allows a teammate to share his/her mind map online with other members. The most attractive features of this tool include customizable font, customizable colors, easy export of maps, etc.</p>\n<h3 id=\"5-mindmup\" style=\"position:relative;\"><a href=\"#5-mindmup\" aria-label=\"5 mindmup 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. MindMup</h3>\n<p>MindMup is a tremendous tool for collaboration planning and brainstorming with its advanced features. It allows you to convert maps easily to PowerPoint and PDF and lets you share and publish your maps online. Further, MindMup enables you to save your mind maps to Google Drive and allows you to access them later through any device. It has an in-built keyboard shortcuts feature too that lets you and your team members jot down ideas faster.</p>\n<p>So, once you've ensured that you have the people you need and the tools and resources they need, here is what you have to do next.</p>\n<p>Also Read: <a href=\"https://www.loginradius.com/blog/fuel/How-to-Make-Businesses-Marketing-Plans-After-Coronavirus/\">Thinking Beyond the Pandemic: How to Make Marketing Plans After Coronavirus</a></p>\n<h2 id=\"virtual-brainstorming-tipstricks\" style=\"position:relative;\"><a href=\"#virtual-brainstorming-tipstricks\" aria-label=\"virtual brainstorming tipstricks 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>Virtual Brainstorming Tips/Tricks</h2>\n<p>Here are some of the effective tips for running brainstorming sessions for your <a href=\"https://www.loginradius.com/blog/growth/top-5-marketing-strategies-to-power-up-your-business/\">marketing strategies</a>.</p>\n<h3 id=\"1-gather-team-from-various-disciplines\" style=\"position:relative;\"><a href=\"#1-gather-team-from-various-disciplines\" aria-label=\"1 gather team from various disciplines 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. Gather team from various disciplines</h3>\n<p>Virtual brainstorming is a great way to get a wide range of teams on the same platform. Therefore, you must invite people from various disciplines in the organization, as well, and get their ideas and perspectives. It will help you acquire a broader set of suggestions and increase the creativity of your team.</p>\n<h3 id=\"2-start-with-icebreakers\" style=\"position:relative;\"><a href=\"#2-start-with-icebreakers\" aria-label=\"2 start with icebreakers 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. Start with icebreakers</h3>\n<p>Want to host a Virtual Brainstorm session that will bring out the creativity of your teammates? Start with icebreakers to encourage people to verbalize their ideas often. The key to increasing participation and energy is by organizing a brainstorming session that won't stifle spontaneity. So, start with motivating words and get your teammates on their feet from the beginning.</p>\n<h3 id=\"3-set-expectations\" style=\"position:relative;\"><a href=\"#3-set-expectations\" aria-label=\"3 set expectations 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. Set expectations</h3>\n<p>Setting out ground rules lets people be clear on the purpose of the meeting. Plus, prepping ahead readies a team more open to participating. To make your collaborative brainstorming online successful, brief your team about what they need to prepare and what to expect from the session. Doing this will increase confidence and engagement when you host an online brainstorming  session.</p>\n<h3 id=\"4-keep-a-moderator\" style=\"position:relative;\"><a href=\"#4-keep-a-moderator\" aria-label=\"4 keep a moderator 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. Keep a moderator</h3>\n<p>Moderators can help focus on the goals, clarify ideas, motivate introverts, and keep a session engaging. A perfect idea may not come at the beginning of a session, but keeping an eye out for people with unique ideas can help you get a thoughtful suggestion in the first session. You can choose a moderator who can share a brief idea about the session ahead of the scheduled meeting time. Doing this will help your team stick to the goal during the brainstorm session.</p>\n<h3 id=\"5-let-everyone-speak\" style=\"position:relative;\"><a href=\"#5-let-everyone-speak\" aria-label=\"5 let everyone speak 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. Let everyone speak</h3>\n<p>If only a few people talk in your meeting, you won't get as many business ideas as you need. Some of the introverts of your team may not come forward at all. Therefore, it is crucial to approach the session more supportively and positively. Press the Mute button whenever needed. Giving everyone a chance to speak by encouraging others to set themselves to mute will let others speak up, and everyone will listen and hear each other.</p>\n<h3 id=\"6-experiment-with-different-techniques-and-tools\" style=\"position:relative;\"><a href=\"#6-experiment-with-different-techniques-and-tools\" aria-label=\"6 experiment with different techniques and tools 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. Experiment with different techniques and tools</h3>\n<p>Each brainstorming session doesn't have to be the same. If you are thinking about how to boost creativity? You can use different mind mapping  tools and an online brainstorming board to create a plan of opportunities, information, and issues.</p>\n<h3 id=\"7-appreciate-the-team\" style=\"position:relative;\"><a href=\"#7-appreciate-the-team\" aria-label=\"7 appreciate the team 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. Appreciate the team</h3>\n<p>Want to motivate your team to participate in brainstorm sessions in the future? Remember, it is vital to acknowledge their efforts, appreciate, and thank them.</p>\n<h2 id=\"wrapping-up\" style=\"position:relative;\"><a href=\"#wrapping-up\" aria-label=\"wrapping up 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>Wrapping Up</h2>\n<p>You can also try the rapid virtual Ideation technique, where you give your participants a limited timescale to come up with ideas. You will be surprised that sometimes even time pressure can bring the best out of people. Finally, use the above tips and tools to spark your team's creativity now and <a href=\"https://www.loginradius.com/blog/fuel/2021/02/tips-managing-remote-team/\">manage remote teams efficiently.</a></p>\n<p>Keep the ideas flowing!</p>\n<p><a href=\"https://www.loginradius.com/contact-us?utm_source=blog&#x26;utm_medium=web&#x26;utm_campaign=best-brainstorming-tools-and-techniques\"><img src=\"/8fce571f703a5970dbb1359a2fe0e51a/book-a-demo-loginradius.webp\" alt=\"book-a-demo-Consultation\"></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":"June 09, 2021","updated_date":null,"description":"A good brainstorming tool should be specific, have a good concept behind it, and most importantly, it should help you gather better ideas. Bonus points if these qualities are in the same package. Read this blog to learn about the best brainstorming tools and techniques that you can use at work.","title":"Boost Creativity With The Best Brainstorming Tools And Techniques","tags":null,"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.3333333333333333,"src":"/static/f51d41f6f7a3b1453652482e56e2be92/7be74/best-brainstorming-tools-and-techniques.webp","srcSet":"/static/f51d41f6f7a3b1453652482e56e2be92/61e93/best-brainstorming-tools-and-techniques.webp 200w,\n/static/f51d41f6f7a3b1453652482e56e2be92/1f5c5/best-brainstorming-tools-and-techniques.webp 400w,\n/static/f51d41f6f7a3b1453652482e56e2be92/7be74/best-brainstorming-tools-and-techniques.webp 666w","sizes":"(max-width: 666px) 100vw, 666px"}}},"author":{"id":"Rashmi Mathur","github":null,"avatar":null}}}},{"node":{"excerpt":"With more and more enterprises inclining towards a secure and user-friendly mode of authorization, OAuth 2.0 is the need of the hour.  OAuth…","fields":{"slug":"/identity/oauth2-0-guide/"},"html":"<p>With more and more enterprises inclining towards a secure and user-friendly mode of authorization, OAuth 2.0 is the need of the hour. </p>\n<p>OAuth 2.0 (Open Authorization) is an industry-standard authorization protocol that allows a website or an application to access resources on behalf of a particular user. </p>\n<p>Some people may <a href=\"https://www.loginradius.com/blog/identity/2020/06/authentication-vs-authorization-infographic/#:~:text=In%20other%20words%2C%20authentication%20is,and%20privileges%20of%20a%20user.\">relate authorization with authentication</a> and believe it to be the same thing. But both of them are different and play a crucial role in providing a secure ecosystem. </p>\n<p>While authentication verifies the identity of an individual, authorization offers consented access along with restricted actions of what users can perform on resources and other crucial data. </p>\n<p>In a nutshell, OAuth 2.0 is an authorization protocol that is designed to control access within a web application or a mobile application. </p>\n<p>Let’s quickly learn more about this authorization protocol and why enterprises need to put their best foot forward in adopting industry-standard authorization. </p>\n<h2 id=\"why-is-now-the-best-time-to-implement-oauth-20--for-your-organization\" style=\"position:relative;\"><a href=\"#why-is-now-the-best-time-to-implement-oauth-20--for-your-organization\" aria-label=\"why is now the best time to implement oauth 20  for your organization 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 is NOW the Best time to Implement OAuth 2.0  for Your Organization?</h2>\n<p>Since many businesses have adopted remote working environments and most media and other industries are facing a huge increase in the number of subscriptions, OAuth 2.0 is undoubtedly the immediate necessity. </p>\n<p>Providing restricted access to certain resources is becoming quite challenging for enterprises handling a huge client base and has certainly created new challenges for the implementation teams. </p>\n<p>Moreover, ensuring the <a href=\"https://www.loginradius.com/blog/identity/2020/12/data-security-best-practices/\">highest level of security</a> for both the consumers and the organization is yet another big challenge as the number of security breaches increased amid the global pandemic. </p>\n<h2 id=\"why-does-your-business-need-oauth-20\" style=\"position:relative;\"><a href=\"#why-does-your-business-need-oauth-20\" aria-label=\"why does your business need oauth 20 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 Does Your Business Need OAuth 2.0?</h2>\n<p>Let’s understand with an example. </p>\n<p>Suppose you need to edit photos through an application. This application now requires access to your photos placed in Google Photos on your phone. </p>\n<p>So technically, you need to provide your Gmail credentials to access photos, isn’t it? But wait, that’s quite risky as it not only offers access to your photos but also to sensitive information in your other connected applications like email and drive. </p>\n<p>Here’s where OAuth 2.0 comes into play. Using OAuth 2.0 is the perfect solution in this scenario as no one would ever provide their login credentials to another application. </p>\n<p>The photo-editing application will first take authorization to access photos from Google, which would ensure that only access to photos is granted to the application and that too for a limited period of time once the user approves the same. </p>\n<p>The same thing goes for every business offering resources or data access to users. The best part about OAuth 2.0 is that everything is managed securely and there aren’t any chances of a data breach or unauthorized access. </p>\n<p>So, if you’re an enterprise that has a huge client base and needs to offer certain services and access to resources, OAuth2.0 is a must-have solution in place. </p>\n<p><strong>Also Read</strong>: <a href=\"https://www.loginradius.com/blog/engineering/oauth2/\">Getting Started with OAuth 2.0.</a> </p>\n<h2 id=\"what-are-the-principles-of-oauth-20\" style=\"position:relative;\"><a href=\"#what-are-the-principles-of-oauth-20\" aria-label=\"what are the principles of oauth 20 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 are the Principles of OAuth 2.0?</h2>\n<p>Since OAuth 2.0 is an authorization protocol, it is exclusively designed as a means to grant access to resources or data within an application or website. </p>\n<p>The basic working principle of OAuth 2.0 is based on the use of access tokens. This access token is nothing but a small piece of data representing the authorization access on behalf of the end-user. </p>\n<p>If a user has an access token, he/she can access the resources or data within that particular application for a particular period of time. Once the token expires, the access is revoked. </p>\n<p>The most common format for the token is JWT (JSON Web Token), and it contains the user data along with the expiration date for security reasons. </p>\n<h2 id=\"features-of-oauth-20\" style=\"position:relative;\"><a href=\"#features-of-oauth-20\" aria-label=\"features of oauth 20 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>Features of OAuth 2.0</h2>\n<p>As an authorization protocol, OAuth 2.0 offers endless features and capabilities to enterprises as well as users. Some of them include: </p>\n<ul>\n<li>Simple and secure access to resources without the need to share the credentials</li>\n<li>Offers user agent flows to ensure client applications are running using a scripting language, including JavaScript.</li>\n<li>Accesses data tokens without the need of credentials and stores data in an online file system of a particular user</li>\n</ul>\n<h2 id=\"advantages-of-oauth-20\" style=\"position:relative;\"><a href=\"#advantages-of-oauth-20\" aria-label=\"advantages of oauth 20 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 OAuth 2.0</h2>\n<p>Numerous businesses are leveraging OAuth 2.0 through a dedicated CIAM (consumer identity and access management) solution like LoginRadius. Here are some advantages of relying on an authorization protocol like OAuth 2.0: </p>\n<ul>\n<li>Flexible and secure as it relies on Secure Sockets Layer (SSL), which ensures data is secure between web server and browsers </li>\n<li>OAuth 2.0 allows limited access to user’s data seeking access to resources. Offers limited access until the token expires</li>\n<li>Shares user data without any chance of personal data breach of users seeking an access</li>\n<li>Easy implementation and better authentication authorization through OAuth 2.0 </li>\n<li>It can be used to handle multiple requests and can cater to a number of users at a single time. </li>\n</ul>\n<h2 id=\"final-thoughts\" style=\"position:relative;\"><a href=\"#final-thoughts\" aria-label=\"final thoughts 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>Final Thoughts</h2>\n<p>Ensuring the highest level of security and confidentiality is what every business needs in today’s era. OAuth 2.0 enables businesses to securely provide access to certain resources and sensitive data without a user’s login credentials. </p>\n<p>Businesses seeking the finest modes of authentication coupled with authorization can consider <a href=\"https://www.loginradius.com/\">LoginRadius CIAM</a> that enables a flawless experience coupled with robust security.</p>\n<p>The LoginRadius CIAM is designed to empower businesses by offering the finest user experience and maximum security through industry-standard protocols including OAuth 2.0.</p>\n<p><a href=\"https://www.loginradius.com/contact-us?utm_source=blog&#x26;utm_medium=web&#x26;utm_campaign=oauth2-0-guide\"><img src=\"/8fce571f703a5970dbb1359a2fe0e51a/book-a-demo-loginradius.webp\" alt=\"book-free-demo-loginradius\"></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":"June 08, 2021","updated_date":null,"description":" OAuth 2.0 is an authorization protocol designed to control access within a web application or a mobile application. Here’s an interesting read showcasing the role of OAuth 2.0 for offering secure access to resources and why enterprises should get it in place.","title":"Working With Industry Authorization: A Beginner's Guide to OAuth 2.0","tags":["data security","authorization","cx"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.7543859649122806,"src":"/static/0ff589bc47fa3a11f610ed110dc445db/09b0e/OAuth2.0-guide-cover.webp","srcSet":"/static/0ff589bc47fa3a11f610ed110dc445db/61e93/OAuth2.0-guide-cover.webp 200w,\n/static/0ff589bc47fa3a11f610ed110dc445db/09b0e/OAuth2.0-guide-cover.webp 338w","sizes":"(max-width: 338px) 100vw, 338px"}}},"author":{"id":"Vishal Sharma","github":null,"avatar":null}}}},{"node":{"excerpt":"Password History, Expiration, and Complexity: Explained! Since the start of the digital revolution, the world has become smaller and humans…","fields":{"slug":"/identity/password-history-expiration-complexity/"},"html":"<h2 id=\"password-history-expiration-and-complexity-explained\" style=\"position:relative;\"><a href=\"#password-history-expiration-and-complexity-explained\" aria-label=\"password history expiration and complexity explained 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>Password History, Expiration, and Complexity: Explained!</h2>\n<p>Since the start of the digital revolution, the world has become smaller and humans have developed a culture of always being connected.</p>\n<p>Today we are surrounded by digital transactions, digital communication, digital social life, and whatnot. A massive chunk of all kinds of data is available on the internet, be it your personal or professional data. </p>\n<p>The internet knows about you more than you. Imagine what an individual can do if this data falls into the wrong hands. I am not here to instigate fear in you about the digital world, but you cannot neglect the possibility of this happening.</p>\n<p>We all are conscious about our privacy and data security, and a perfect real-life example can explain this. Most of us know when and where we have to switch to our internal privacy mode according to the situation. </p>\n<p><img src=\"https://apidocs.lrcontent.com/images/photo-1584433144859-1fc3ab64a957--colorized_733860bf4aaac3d743.55160141.webp\" alt=\"Password Secured Phone Image\" title=\"Password Secured Phone Image\"></p>\n<p>Passwords are the only measures that help us immensely to protect our data. So don't you think our protector should be more robust? Yes, it should be strong enough to withstand multiple attacks trying to steal your data.</p>\n<h3 id=\"what-are-passwords\" style=\"position:relative;\"><a href=\"#what-are-passwords\" aria-label=\"what are passwords 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 are Passwords?</h3>\n<p>I don't think that anyone needs an introduction to \"What is Password.” We are surrounded by passwords from the time we wake up till the time we sleep. \"A password is a combination of characters and symbols which uniquely identifies each individual.\" </p>\n<p>A password can be used in multiple scenarios, but the motive to use them is similar, i.e., to authenticate the individual's identity. Passwords are used mainly with a unique ID or \"Username,\"—together, the combination is referred to as Login credentials. </p>\n<p>Most of the passwords contain letters, numbers, special characters, and symbols, and they can vary in length. Before setting a password, you should ensure that the combination should be easy to remember but hard to crack, which means it should not be that easy that everyone can guess it, and it should not be much hard that you forget it after some time.</p>\n<p><img src=\"https://apidocs.lrcontent.com/images/password-2781614_960_720--colorized_2788360bf4b253cafb2.39488510.webp\" alt=\"Password Image\" title=\"Password Image\"></p>\n<h3 id=\"what-are-weak-passwords\" style=\"position:relative;\"><a href=\"#what-are-weak-passwords\" aria-label=\"what are weak passwords 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 are Weak Passwords?</h3>\n<p>Once an account is created on any website, it prompts us to set a new password for the site. The passwords we set that time can be categorized into two types, Weak and Strong passwords.</p>\n<p> Let’s see some very common practices for <a href=\"https://www.loginradius.com/blog/identity/2019/12/worst-passwords-list-2019/\">weak passwords</a>.</p>\n<ul>\n<li><strong>Simple Passwords:</strong> Passwords set without giving much thought about it are called simple passwords. For example: \"password\", \"qwerty\", \"123456\" etc. The password cracking software works in such a way that it looks for these types of obvious combinations.</li>\n<li><strong>Passwords with personal information:</strong> If you tend to use your personal information as a password, you are in big trouble as hackers can quickly get such data from your publicly available social profiles. Data such as your birthday, anniversary, or graduation year are personal information, and one should avoid using them.</li>\n<li><strong>Repeated Passwords:</strong> With multiple accounts, some users find it challenging to remember numerous passwords, so they tend to use the same passwords for each account. But if the hacker cracks the password for one account, all of his other accounts will be compromised.</li>\n</ul>\n<h3 id=\"how-can-we-create-strong-passwords\" style=\"position:relative;\"><a href=\"#how-can-we-create-strong-passwords\" aria-label=\"how can we create strong passwords 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 Can We Create Strong Passwords?</h3>\n<p>By now, the need for a <a href=\"https://www.loginradius.com/blog/identity/2021/01/how-to-choose-a-secure-password/\">strong password</a> must be clear for you, and you must be eager to know in what ways a password can be made stronger. Calm down! We are about to cover some important points by which password security can be enhanced many folds.</p>\n<p>There are various ways to enhance the security of your password; however, I am highlighting three such points which every business and individual needs to ponder while enhancing the security of their passwords. These are :</p>\n<ol>\n<li>Password History</li>\n<li>Password Complexity</li>\n<li>Password Expiration</li>\n</ol>\n<h3 id=\"password-history\" style=\"position:relative;\"><a href=\"#password-history\" aria-label=\"password history 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>Password History</h3>\n<p>Enabling this feature in your product/website can add an extra layer of security to it. This feature holds the history of passwords that are created for a particular account. </p>\n<p>Password reuse is now an important headache for organizations as users tend to use similar passwords as they have used in the past. Using the same password for a longer period of time gives more chances to the hacker to determine the password. </p>\n<p>The password history feature can have a limit up to which you can not use any such password which you have configured. For example, if you set the limit to 5, then you will be unable to use the last five previous passwords.</p>\n<p><img src=\"https://apidocs.lrcontent.com/images/phishing-3390518_960_720--colorized_2613960bf4d54d50e62.32324792.webp\" alt=\"Phising Attack representation\" title=\"Phising Attack representation\"></p>\n<p>In this way, consumers will be forced not to reuse their old passwords again and again. Setting a new password creates challenges for an attacker, and the account remains safe.</p>\n<p><strong>Read More:</strong> <a href=\"https://www.loginradius.com/resource/password-policy-datasheet\">A Comprehensive Framework for Passwords to UP Your Security Game!</a></p>\n<h3 id=\"password-complexity\" style=\"position:relative;\"><a href=\"#password-complexity\" aria-label=\"password complexity 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>Password Complexity</h3>\n<p>From the above points, we have learned the importance of not using old passwords; let's understand how our new passwords should be. Creating a strong password requires a combination that can not be easily guessed by attackers after extracting some information from your social handles. </p>\n<p>If you have kept your password as plain text, let's say a name of your first dog or a favorite picnic spot, etc., which can be easily guessed by attackers once they get some data from the social network. In that case, your privacy and data are at risk of being compromised. To avoid this, you must create a complex and hard password. </p>\n<p>Now you will ask what are the ways by which you can create a strong and complex password and also remember it. I have sorted out few important points which can be followed while creating new passwords:</p>\n<ol>\n<li><strong>Passwords should be long enough:</strong> Short passwords are easy to crack as they have fewer numbers to be cracked but at the same time, cracking a long password is a herculean task. An ideal password should not be less than 12 characters.</li>\n<li><strong>Not using obvious dictionary words:</strong> Make sure you do not use any simple word that contains some meaning (ex orange@123, red#12). If you create a password that is exactly the same as a dictionary word, then it can not be foolproof. There can be instances where such passwords can be easily cracked.</li>\n<li><strong>Use random alphabets:</strong> The best and the safest passwords contain alphabets in a completely random manner. They can be in uppercase or lowercase. Their placement does not make any sense or meaning. For example, (J56yh#$fhB). These types of passwords are a tough nut to crack.</li>\n<li><strong>Do not use any personal information in passwords:</strong> Passwords that contain some personal information such as your date of birth, your graduation year, etc., poses a greater risk of being compromised. Therefore avoid using any personal information in your passwords.</li>\n<li><strong>Avoid memorable keyboard paths:</strong>  It is advised not to use any sequential keyboard path or any combination that you are very familiar with. For example (qwerty, reset@123,).</li>\n</ol>\n<h3 id=\"password-expiration\" style=\"position:relative;\"><a href=\"#password-expiration\" aria-label=\"password expiration 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>Password Expiration</h3>\n<p>Most of the organizations which hold users' sensitive data use this policy of password expiration. This policy forces the user to update/change their passwords after a certain period of time. </p>\n<p>As a result, it chips down the time for attackers to guess the consumer's password. Earlier, consumers used to set up passwords for their accounts, and hackers had so much time to attempt cracking multiple times. </p>\n<p>But now, till the time they come up with a possible password, the consumer would have already changed the password. In this way, enabling the Password expiration policy adds an additional layer of security for your passwords.</p>\n<h3 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</h3>\n<p>Protecting consumer's data is a top priority for many organizations as it is the basis of the trust that their consumers have placed in them. There are various other techniques which you can embed along with these three to push your password security to the next level. </p>\n<p>Some of them are using <strong>Two Factor Authentication</strong>, <a href=\"https://www.loginradius.com/resource/mobile-biometric-authentication-datasheet\"><strong>Biometric authentication</strong></a>, <strong>Brute Force Lockout</strong>, and many others. Together these can increase password security many folds. </p>\n<p>If you really want to survive in this digital world where everything is digital, you are required to have some basic understanding of how to protect yourself and your data from being compromised. Passwords are nothing but a key to your digital locker, and hence they will be as strong as you make them. Follow the above-mentioned few points and consider most of your data secure.</p>\n<p>Cheers!</p>\n<p><a href=\"https://www.loginradius.com/contact-us?utm_source=blog&#x26;utm_medium=web&#x26;utm_campaign=password-history-expiration-complexity\"><img src=\"/8fce571f703a5970dbb1359a2fe0e51a/book-a-demo-loginradius.webp\" alt=\"book-a-demo-loginradius\"></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":"June 08, 2021","updated_date":null,"description":"Passwords are the only measures that help us immensely to protect our data. So don't you think our protector should be more robust? This blog explores the various techniques which you can embed to push your password security to the next level.","title":"Password History, Expiration, and Complexity: Explained!","tags":["authentication"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/3b2a55040701faca00b2b086098fa76b/58556/Passwordhistory_cover_pic.webp","srcSet":"/static/3b2a55040701faca00b2b086098fa76b/61e93/Passwordhistory_cover_pic.webp 200w,\n/static/3b2a55040701faca00b2b086098fa76b/1f5c5/Passwordhistory_cover_pic.webp 400w,\n/static/3b2a55040701faca00b2b086098fa76b/58556/Passwordhistory_cover_pic.webp 800w,\n/static/3b2a55040701faca00b2b086098fa76b/99238/Passwordhistory_cover_pic.webp 1200w,\n/static/3b2a55040701faca00b2b086098fa76b/7c22d/Passwordhistory_cover_pic.webp 1600w,\n/static/3b2a55040701faca00b2b086098fa76b/f8fd9/Passwordhistory_cover_pic.webp 5472w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Ashish Kumar Yadav","github":null,"avatar":null}}}},{"node":{"excerpt":"A single sign-on system enables users to access multiple applications without creating additional accounts or repeatedly entering passwords…","fields":{"slug":"/identity/saml-or-oidc-for-business/"},"html":"<p>A single sign-on system enables users to access multiple applications without creating additional accounts or repeatedly entering passwords. </p>\n<p>Single sign-on systems follow the OpenID Connect (OIDC) or Security Assertion Markup Language (SAML) protocols. For any company concerned about securing its users' data, getting a grip on SSO can be a daunting task. </p>\n<p>But determining whether SAML or OIDC is right for your enterprise requires weighing a few characteristics against your business goals.</p>\n<h2 id=\"what-is-oidc-and-saml-authentication\" style=\"position:relative;\"><a href=\"#what-is-oidc-and-saml-authentication\" aria-label=\"what is oidc and saml authentication 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 OIDC and SAML Authentication?</h2>\n<p>OpenID Connect or OIDC is an authentication protocol that verifies end-user identity when the user is trying to connect with a secure server like HTTPS. </p>\n<p>Security Assertion Markup Language (SAML) is an authentication protocol that is used between an identity provider and a service provider. It works by transferring user login credentials to the service provider if it passes SAML attributes. </p>\n<p>Both OIDC and SAML authentication are identity protocols and can be the basic building blocks of any identity provider. Businesses generally use either of the protocols to maintain their user accounts and data. </p>\n<p>Before we look at the differences between these protocols, let us understand the basic OIDC and SAML workflow which can be broken down as follows: </p>\n<ul>\n<li>The end-user visits the website and tries to log in using an existing account.</li>\n<li>They decide which app they want to use to log in (Google, Facebook, Yahoo, etc.).</li>\n<li>This selection is then passed onto the browser or app using the IdP.</li>\n<li>The app verifies the user's identity before granting access to the information the end-user is looking for.</li>\n</ul>\n<p><a href=\"https://www.loginradius.com/resource/loginradius-single-sign-on/\"><img src=\"/970abf5b3c4e78379ad5bf97a519b62c/DS-SSO.webp\" alt=\"DS-SSO\"></a></p>\n<h2 id=\"what-are-the-differences-between-oidc-and-saml\" style=\"position:relative;\"><a href=\"#what-are-the-differences-between-oidc-and-saml\" aria-label=\"what are the differences between oidc and saml 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 are the Differences Between OIDC and SAML?</h2>\n<p>While the flow is the same, there are significant differences between OIDC and SAML.</p>\n<h3 id=\"1-different-working-model\" style=\"position:relative;\"><a href=\"#1-different-working-model\" aria-label=\"1 different working model 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. Different working model</h3>\n<p>OIDC was introduced in 2015. OIDC was developed as an OAuth 2.0 protocol to ensure two websites can trust each other, and therefore the user can gain verification and access. This format is known as the JavaScript Objection Notation (JSON) format. Each user's data is given a JSON token which may or may not be encrypted.  </p>\n<p>SAML authentication protocols were first introduced in 2005. SAML authentication transfers information like the user's first name, last name, etc., to verify that the end-user is genuine. This transmission method uses XML format and relies on secure HTTPS servers.</p>\n<p>This transmitted user data in SAML authentication is called \"SAML assertion\". Without the right assertion, the user is unable to gain access to the information or the account. </p>\n<h3 id=\"2-different-application-approach\" style=\"position:relative;\"><a href=\"#2-different-application-approach\" aria-label=\"2 different application approach 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. Different application approach</h3>\n<p>OIDC is used by various popular private enterprises using Nomura Research institute, PayPal, Ping Identity, Microsoft, Amazon, etc. SAML is generally used for business and government applications like citizens Ids. The major difference in both these protocols is due to the security difference in OIDC and <strong>SAML authentication</strong>.  </p>\n<p>OIDC is generally preferred in commercial applications where simple <a href=\"https://www.loginradius.com/blog/identity/2020/12/identity-proofing/\">identity verification</a> is required over a complex one. </p>\n<h3 id=\"3-security-of-oidc-and-saml\" style=\"position:relative;\"><a href=\"#3-security-of-oidc-and-saml\" aria-label=\"3 security of oidc and saml 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. Security of OIDC and SAML</h3>\n<p>Various organizations trust SAML authentication because it provides a wide range of features. It was developed almost 17 years ago, and therefore it has well-developed security features. </p>\n<p>OIDC, on the other hand, is newer and still evolving. While OIDC has secure protocols, these are yet to be adapted for the needs of specific sectors like banking. This lack of features is one of the reasons why SAML is lagging in terms of applications.</p>\n<h3 id=\"4-integration-and-support\" style=\"position:relative;\"><a href=\"#4-integration-and-support\" aria-label=\"4 integration and support 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. Integration and support</h3>\n<p>OIDC is easy to integrate and therefore is used by mobile applications and single-page apps. On the other hand, SAML authentication is heavyweight and cannot be integrated into these without compromising on other features. OIDC was developed specifically because SAML was too heavyweight for such applications.</p>\n<h3 id=\"5-different-authentication-methods\" style=\"position:relative;\"><a href=\"#5-different-authentication-methods\" aria-label=\"5 different authentication 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>5. Different authentication methods</h3>\n<p>Simply put, OIDC is another layer of the OAuth framework. This increases the security and permits the user first to give consent before the user can access a service. This is an in-built service and a standard protocol. </p>\n<p>However, in SAML, the authentication protocols need to be coded individually by the developer. To provide authentication, SAML relies on IdP and relies on the party to know each other. If they don't, no data transfer can take place.</p>\n<p>While both authentication protocols are powerful and have their benefits, businesses need to be careful while choosing one. Here's how you can choose which protocol to use.</p>\n<h2 id=\"when-to-choose-saml-and-when-to-oicd\" style=\"position:relative;\"><a href=\"#when-to-choose-saml-and-when-to-oicd\" aria-label=\"when to choose saml and when to oicd 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><strong>When to Choose SAML and When to OICD?</strong></h2>\n<p>Given below are the factors that you should keep in mind when <a href=\"https://www.loginradius.com/contact-us?utm_source=blog&#x26;utm_medium=web&#x26;utm_campaign=saml-or-oidc-for-business\">choosing an authentication protocol</a>:</p>\n<h3 id=\"1-application\" style=\"position:relative;\"><a href=\"#1-application\" aria-label=\"1 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>1. Application</h3>\n<p>As already discussed in the previous section, the applications of both OIDC and SAML are completely different. SAML authentication should be used if your business deals with sensitive data and requires the highest possible security. </p>\n<p>On the other hand, OIDC can be used if you require only minimum verification or temporary logins rather than long-lasting user accounts.</p>\n<h3 id=\"2-user-experience\" style=\"position:relative;\"><a href=\"#2-user-experience\" aria-label=\"2 user experience 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. User-experience</h3>\n<p>OIDC works well with mobile applications and should therefore be used if you want to create an application centred around user-friendliness. Since this protocol is lightweight, it can be implemented on almost all devices to provide a rich user experience.</p>\n<h2 id=\"how-will-loginradius-expertise-in-identity-platform-help-you\" style=\"position:relative;\"><a href=\"#how-will-loginradius-expertise-in-identity-platform-help-you\" aria-label=\"how will loginradius expertise in identity platform help you 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 will LoginRadius' Expertise in Identity Platform help you?</h2>\n<p>LoginRadius provides a seamless cloud-based Identity management solution. The platform simplifies the process of registering, verifying and authenticating new users. It is a completely customizable service that can be scaled up according to your growing business requirements. </p>\n<p>It’s easy to get started with both SAML 1.1 and SAML 2.0 with LoginRadius.  The CIAM provider functions both as an identity provider (IDP) or a service provider (SP). Its Admin Console gives you complete control over your SAML setups, thereby allowing you to adjust the assertions, keys, and endpoints to meet the requirements of any SAML provider.</p>\n<p>LoginRadius also supports federated <a href=\"https://www.loginradius.com/protocols/\">SSO protocols</a>, like Multipass, OpenID Connect and Delegation.</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 opt for a SAML or an OIDC verification method, the identity provider you choose can define your app's features and user-friendliness. Partnering with the right platform will help you provide the best security possible and ensure you don't fall victim to any cybercrimes.</p>\n<p><a href=\"https://www.loginradius.com/contact-us?utm_source=blog&#x26;utm_medium=web&#x26;utm_campaign=saml-or-oidc-for-business\"><img src=\"/8fce571f703a5970dbb1359a2fe0e51a/book-a-demo-loginradius.webp\" alt=\"LoginRadius Book a Demo\"></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":"June 08, 2021","updated_date":null,"description":"For any company concerned about securing its users' data, getting a grip on SSO can be a daunting task. But determining whether SAML or OIDC is right for your enterprise requires weighing a few characteristics against your business goals.","title":"SAML or OIDC: Which is Better For Your Business?","tags":["saml","sso","data security","authentication","cx"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.6666666666666667,"src":"/static/bed2d7c21e9c9d14724e57f42436470c/58556/saml-or-oidc-for-business-cover.webp","srcSet":"/static/bed2d7c21e9c9d14724e57f42436470c/61e93/saml-or-oidc-for-business-cover.webp 200w,\n/static/bed2d7c21e9c9d14724e57f42436470c/1f5c5/saml-or-oidc-for-business-cover.webp 400w,\n/static/bed2d7c21e9c9d14724e57f42436470c/58556/saml-or-oidc-for-business-cover.webp 800w,\n/static/bed2d7c21e9c9d14724e57f42436470c/cc834/saml-or-oidc-for-business-cover.webp 1024w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Rakesh Soni","github":"oyesoni","avatar":"rakesh-soni.webp"}}}}]},"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.webp"}}}},"pageContext":{"limit":6,"skip":474,"currentPage":80,"type":"///","numPages":164,"pinned":"ee8a4479-3471-53b1-bf62-d0d8dc3faaeb"}},"staticQueryHashes":["1171199041","1384082988","2100481360","23180105","528864852"]}