![\"Example](\"/a0ae6207fefc74ee8f42e98d08082ff6/image1.webp\")
React thrives on being one of the premier tools to build single-page applications, which used to be a fairly foreign concept when I started building my first React app. Back then, I was used to the concept of serving separate web pages whenever the user redirects from an URL path to another, and it was rather challenging at first to wrap my head around how React handles navigation.
\nWith that in mind, this blog post aims to lay down and explain the basic aspects of navigation using React Router, one of the most, if not the most, popular solutions for navigation within a React app.
\nThroughout the first section below, please reference this CodePen example.
\nAs hinted at in the preface of this writing, routing in React does not involve replacing the HTML, CSS or JavaScript resources currently being served or reloading the browser content. Instead, using libraries like react-router allows containers to be swapped in and out dynamically based on the current URL location, and this all happens client-side. With that in mind, React Router can more generally be understood as a wrapper that handles conditional rendering based on URL path.
To accomplish this, the basic building blocks that developers get to play with are <Route>, <Switch> and <Link>. Let us look at a basic example making use of these 3 components:
First off, let’s create some simple text components. These components are stand-ins for actual components to be swapped in and out in navigation. HelloBanner will be a div containing the simple message “Hello”, and WorldBanner containing “World!”:
\nconst HelloBanner: React.FunctionComponent = () => {\n return (\n <div id="banner_hello" className="banner">\n <span>Hello Banner is currently displayed. We are currently in path "/hello"</span>\n </div>\n ) \n}\n\nconst WorldBanner: React.FunctionComponent = () => {\n return (\n <div id="banner_world" className="banner">\n <span>Hello Banner is currently displayed. We are currently in path "/world"</span>\n </div>\n ) \n}Now let’s imagine the layout of a conventional web application with a top navigation bar. The navigation bar contains links to each section of the app and the body would show the content of the current webpage. The skeleton code for that container would look something like this in React:
\nclass AppContainer extends Component {\n constructor(props) {\n super(props);\n }\n\n render() {\n return (\n <div id="div_app_container" className="app-container">\n <div id="div_nav" className="nav-bar">\n <span>Navigation bar</span>\n <Link to="/hello">\n <span>Link to /hello</span>\n </Link>\n <Link to="/world">\n <span>Link to /world</span>\n </Link>\n <Link to="/clearlyinvalidpath">\n <span>Link to a clearly invalid path.</span>\n </Link>\n </div>\n <div id="main_container" className="main-container">\n <span>Main Container</span>\n <Switch>\n <Route exact path="/">\n <div>\n <span>\n Default container. We are in root path\n </span>\n </div>\n </Route>\n <Route path="/hello" component={HelloBanner} />\n <Route path="/world">\n <WorldBanner />\n </Route>\n <Redirect to="/" />\n </Switch>\n </div>\n </div>\n );\n }\n}\n\nReactDOM.render(\n <BrowserRouter>\n <AppContainer />\n </BrowserRouter>,\n document.getElementById("app")\n);If you are currently looking at the render of this structure from the CodePen, you would see this very simple UI:
\n
Clicking on the <Link>’s in the navigation bar will “navigate” you to the corresponding paths. In effect, what this does is twofold:
<Route> components to rerender according to the current path.This is demonstrated through the example app. Once you click the links to /hello or to /world, the corresponding component will be swapped in under the <Switch> container.
A couple of noteworthy things from the code example:
\n<Switch> component allows swapping between <Route>’s and render the correct component with a given URL path. However, <Route> components do not have to be wrapped inside a <Switch>. While standalone, a <Route> will simply render when the URL path matches its own path prop.<Redirect> component at the end acts as the default route. In case none of the other routes match with the current URL path, it simply redirects the user back to root.The workflow described above is intuitive from the end user’s point of view. However, there are times when the application’s internal logic demands a redirection to be performed following app events. In these occasions, React Router leverages the history object to allow for programmatic redirection:
For a traditional setup, the history object can be accessed through a component’s props through the user of the withRouter higher order component:
import * as React from "react";\nimport { RouteComponentProps, withRouter } from "react-router-dom";\n\nexport interface SampleComponentProps extends RouteComponentProps {\n // props go here\n}\nexport interface SampleComponentStateState {\n // states go here\n}\n\nclass SampleComponent extends React.Component<SampleComponentProps, SampleComponentStateState> {\n constructor(props: any) {\n super(props);\n }\n\n performRedirect = () => {\n const { history } = this.props;\n\n history.push("/desired-pathname")\n }\n\n render() {\n return <div/>\n }\n}\n\nexport default withRouter<SampleComponentProps>(SampleComponent);In the example above, you can see all the components required to extract the history object, as well as the history.push() call to perform the redirection.
For a more updated approach, React Router introduced the hook useHistory, which should blend in more naturally when programming with a React Hooks intensive workflow.
Certain redirects are unique in nature, and/or contain certain information about the previous user activity that you might want to pass on to the new component. In this case, the information can be passed through history states into the new component, which will then perform custom behavior based on these states:
\nWhen using <Link> component redirect, populate the to prop with an object that contains the new path as well as states, instead of just the string for pathname:
<Link\n to={{\n pathname: "/desired-pathname",\n state: {\n stateName: "state to be passed."\n }\n }}\n>\n Link text here.\n</Link>The same object can be used as argument to the history.push() call to achieve similar results:
history.push({\n pathname: "/desired-pathname",\n state: {\n stateName: "state to be passed."\n }\n})Once the state has been included with the redirection, on the receiving end, you can extract the state from the history.location.state object:
import * as React from "react";\nimport { RouteComponentProps, withRouter } from "react-router-dom";\n\nexport interface ReceivingComponentProps extends RouteComponentProps {\n // props go here\n}\nexport interface ReceivingComponentStateState {\n // states go here\n}\n\nclass ReceivingComponent extends React.Component<ReceivingComponentProps, ReceivingComponentStateState> {\n constructor(props: any) {\n super(props);\n }\n\n componentDidMount() {\n const { history } = this.props;\n if (history.location.state && history.location.state.stateName) {\n // stateName can be accessed here if it is passed in from a previous redirect action.\n console.log(history.location.state.stateName);\n }\n }\n\n render() {\n return <div/>\n }\n}\n\nexport default withRouter<ReceivingComponentProps>(ReceivingComponent);The state access is in componentDidMount in the example above.
At this point, hopefully, we have covered all the big bullet points to help you get started with navigation using React Router. I hope this write-up has been informative and helpful to your understanding of navigation in React, as well as helping you build your next React application.
\n","frontmatter":{"date":"November 20, 2020","updated_date":null,"description":"Everything essential you need to know about React Router.","title":"React Router Basics: Routing in a Single-page Application","tags":["JavaScript","Node","React","React Router"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/4bcd64f320b4486ea6ddb7147ff85a96/58556/index.webp","srcSet":"/static/4bcd64f320b4486ea6ddb7147ff85a96/61e93/index.webp 200w,\n/static/4bcd64f320b4486ea6ddb7147ff85a96/1f5c5/index.webp 400w,\n/static/4bcd64f320b4486ea6ddb7147ff85a96/58556/index.webp 800w,\n/static/4bcd64f320b4486ea6ddb7147ff85a96/99238/index.webp 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Nathan Nguyen","github":"nathannguyenn","avatar":null}}}},{"node":{"excerpt":"Introduction Hello Everyone, In this article, we will learn how to send emails in .NET/C# using SMTP. As sometimes, it is required to send…","fields":{"slug":"/engineering/how-to-send-emails-through-csharp-dotnet-using-smtp/"},"html":"Hello Everyone, In this article, we will learn how to send emails in .NET/C# using SMTP. As sometimes, it is required to send emails to the users of the application. Email communication is considered a good way to communicate with the users of the application. There are different ways to send emails in .NET, but here we will talk about SMTP.
\nSMTP stands for Simple Mail Transfer Protocol. It is a communication protocol for electronic mail transmission. Mail servers and other message transfer agents use SMTP to send and receive mail messages. The Key Features of SMTP are it is considered a reliable server for sending emails, and it delivers the email more easily and quickly as it is developed from a simple platform.
\nIn the implementation part, we will first create a .NET Core class library, and then we will use that library in the .NET Core console app.
\nStep 1 - Create a .NET Core Console App project in IDE.
\nStep 2 - Add a .NET Core class library in the created solution.
\nStep 3 - Create a new class file in the class library and name it as MailArguments.cs. Add the arguments fields in this file, which will be used in sending the email.
\n public string MailTo { get; set; }\n public string Bcc { get; set; }\n public string Name { get; set; }\n public string Subject { get; set; }\n public string Message { get; set; }\n public string SmtpHost { get; set; }\n public string Password { get; set; }\n public int Port { get; set; }\n public string MailFrom { get; set; }Step 4 - Create a new class file in the class library; name it ExtensionMethods.cs. Here we will add the extension methods, which will be helpful to put the validation while sending the emails.
\n public static bool IsNotNullOrEmpty<T>(this IEnumerable<T> value)\n {\n return value != null && value.Any(); // This will return true if the value is not null and not empty\n }\n public static bool IsNotNullOrEmptyOrWhiteSpace(this string value)\n {\n return !(string.IsNullOrEmpty(value) || string.IsNullOrWhiteSpace(value)); // This will return true if the string value is not null, not empty and not contains any white space\n }\n public static bool IsNotNull(this object value)\n {\n return value != null; // This will return true if the object value is not null\n }Resolve missing references.
\nStep 5 - Create a new static class file in the class library name it as Mail.cs. In this class add a static method with try and catch block.
\n public static Tuple<bool, string> SendEMail(MailArguments mailArgs, List<Attachment> attachments, bool isSsl, Dictionary<string, string> headers){\n try{\n\n }\n catch (Exception ex){\n var msg = ex.Message;\n return Tuple.Create(false, msg);\n }\n }Resolve missing references.
\nIn this method, we are returning the Tuple<bool, string> which returns the status of the email sent and a message from the method in case of failure and success.
\nStep 7 - Add below lines of code which will help create the NetworkCredentials for SMTP in the created method SendEmail.
\n var networkCredential = new NetworkCredential\n {\n Password = mailArgs.Password,\n UserName = mailArgs.MailFrom\n };Here we are using NetworkCredential class to set the UserName and Password.
\nStep 8 - Add below lines of code, which will be used to initiate a message, subject, and IsBodyHtml.
\n var mailMsg = new MailMessage\n {\n Body = mailArgs.Message,\n Subject = mailArgs.Subject,\n IsBodyHtml = true // This indicates that message body contains the HTML part as well.\n };\n mailMsg.To.Add(mailArgs.MailTo);Step 9 - Add the below lines of code to check and add the Headers, BCC, and Attachments. Here we have used the earlier created extension methods to add the validation.
\n if (headers.IsNotNullOrEmpty() )\n {\n foreach (var header in headers)\n {\n mailMsg.Headers.Add(header.Key, header.Value);\n }\n }\n if (mailArgs.Bcc.IsNotNullOrEmptyOrWhiteSpace())\n {\n string[] bccIds = mailArgs.Bcc.Split(',');\n if (bccIds.IsNotNullOrEmpty())\n {\n foreach (var bcc in bccIds)\n {\n mailMsg.Bcc.Add(bcc);\n }\n }\n }\n if (attachments.IsNotNull())\n {\n foreach (var attachment in attachments)\n {\n if (attachment.IsNotNull())\n {\n mailMsg.Attachments.Add(attachment);\n }\n }\n }Step 10 - Add below the line of code to create a new email address using the From and Name fields of MailArguments class.
\n mailMsg.From = new MailAddress(mailArgs.MailFrom, mailArgs.Name);Step 11 - Add below lines of code to create a new SMTP client and use the send method of that client. When the email is successfully sent then we are creating a new tuple for sending the success message with a true flag that will indicate mail is sent.
\n var smtpClient = new SmtpClient(mailArgs.SmtpHost)\n {\n Port = Convert.ToInt32(mailArgs.Port),\n EnableSsl = isSsl,\n DeliveryMethod = SmtpDeliveryMethod.Network,\n UseDefaultCredentials = false,\n Credentials = networkCredential\n };\n smtpClient.Send(mailMsg);\n return Tuple.Create(true, "Email Sent Successfully.");Here we are initializing the below variables for the SMTP client.
\nDeliveryMethod - Delivery Method are 3 types. Here we have used the Network type.
\nStep 12 - In the Program.cs, which will be in the console app project, we will initialize and add the Mail arguments which are required to send an email.
\nStep 13 - Before that add the reference of the class library which we have created above in your console app by doing the below steps
\nRight-click on the console app project->Click on Add->Click on Reference->Select the created class library project.Step 14 - In the main method, add the below lines to initialize the arguments. Here I am using Gmail's SMTP server port and host address.
\n var mailArgs = new MailArguments\n {\n MailFrom = "<--From mail address from where mail should be sent-->", \n Password = "<--From mail address password-->", \n Name = "<--From mail address name-->",\n MailTo = "<--To mail address to where mail should be received-->", \n Subject = "<--Subject of the email-->", \n Message = "<--Message body of the email can contains HTML as well-->", \n Port = 587, \n SmtpHost = "smtp.gmail.com", \n Bcc = "<--BCC email id's separated by semicolon (;)-->" \n };\n List<Attachment> lstAttachments=new List<Attachment>\n {\n new Attachment("<--Path of the attachment-->>",MediaTypeNames.Image.Gif) //MediaType and Path of the attachment here I have selected Gif Image we have MediaTypeNames Application/Image/Text\n };\n\n Dictionary<string, string> dictHeaders = new Dictionary<string, string>\n {\n { "<--Key of the header-->", "<--Values of the header-->" }\n };Resolve missing references.
\nYou have to initialize all the variables as described above. From and Password will be the Gmail's account email id and password respectively because we are using Gmail's SMTP server.
\nIn the attachment, I have used the MediaTypeNames.Image.Gif, which is used for Gif Images. There are different constructors for the attachment class. For reference, you can read from here- Attachment Class. Attachments are not necessary to be passed. You can pass null in the SendMail method below.
\nHeaders are custom headers that will be sent with the email. It is not necessary to pass these headers. You can pass null in the SendMail method below.
\nStep 15 - Add the below line of code to call the SendMail method of the class library.
\n Console.WriteLine(Mail.SendEMail(mailArgs, lstAttachments, true, dictHeaders).Item2);Here we have used Gmail's SMTP server to send emails (From Mail Address) so we have to enable the Less Secure Apps in our from mail address account by enabling Allow less secure apps else we will get the error from Gmail's SMTP server (The SMTP server requires a secure connection or the client was not authenticated. The server response was: 5.7.0 Authentication Required.)
\nIn this article, we have learned about how to How to send emails through C#/.NET using SMTP. We have used the class library to initiate in the console app to send a mail to the particular emailId.The complete code for this blog can be found at Github Repo.
\n","frontmatter":{"date":"November 19, 2020","updated_date":null,"description":" In this article, we will learn how to send emails in .NET/C# using SMTP","title":"How to send emails in C#/.NET using SMTP","tags":[".NET","C#","SMTP"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.3333333333333333,"src":"/static/0def756cf8634c19ffe25f2d6fc37dbd/58556/coverimage.webp","srcSet":"/static/0def756cf8634c19ffe25f2d6fc37dbd/61e93/coverimage.webp 200w,\n/static/0def756cf8634c19ffe25f2d6fc37dbd/1f5c5/coverimage.webp 400w,\n/static/0def756cf8634c19ffe25f2d6fc37dbd/58556/coverimage.webp 800w,\n/static/0def756cf8634c19ffe25f2d6fc37dbd/99238/coverimage.webp 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Hemant Manwani","github":"hemant404","avatar":null}}}},{"node":{"excerpt":"AWS EC2 is a virtual computing environment (known as instances) to develop and deploy applications. To create an EC2 instance in AWS, we…","fields":{"slug":"/engineering/ec2-instance-aws/"},"html":"AWS EC2 is a virtual computing environment (known as instances) to develop and deploy applications. To create an EC2 instance in AWS, we need an active Amazon Web Services account.
\nFirst, let's login into our AWS account. Once login, we will land on the Management Console page, we can see all the AWS services.
\n![\"AWS](\"/00b62bc651136276e300af2178f08b67/1_console.webp\")
There is a drop-down on the top left corner, which is one more option to search and browse all the services provided by AWS. You can find EC2 under the Compute category.
![\"AWS](\"/cf995d68cacdb4e149eed6e98ca2437b/2_services.webp\")
Once we click on EC2 you will be redirected to the EC2 Dashboard. It shows the information related to all the EC2 resources for a specific Region in our account.
\n\nNote: If we change the region from the top right corner of the dashboard, it will show the selected region's information. In the below snapshot, we have selected
\nMumbairegion.
There is a button Launch Instance to create a new instance in the selected region on the dashboard's bottom section.
![\"EC2](\"/a8f74d863955c6320c60c0d29a52a72b/3_dashboard.webp\")
After clicking the Launch button, we need to select the Amazon Machine Image (AMI) it includes the operating system and applications required to launch an instance. Here we will select the Ubuntu Server 20.04 LTS as shown in the below snapshot.
\n![\"EC2](\"/c46efcd1445b2e70816a37ff5765b0dc/4_ami.webp\")
The next step is to choose the type of instance we need. AWS provides many types of instances based on different use cases with various CPU combinations, memory, storage, and networking capacity. We will here select the t2.micro instance, which is a free tier eligible instance.
\n\nwhile writing this tutorial, Amazon provides 750 hours per month of free usage on the t2.micro instance. It makes it very affordable to run small/sample applications for an initial period.
\n
![\"EC2](\"/5b219a8dd124e49014949a7934569eb9/5_type.webp\")
On the Instance Configuration Details Page, we have options to run more than one instance at once, and there are other configurations regarding roles and access management. We will skip all this and click on the Next: Add Storage button.
![\"Configure](\"/c980178a2bf57114a79b80e1e697dc41/6_configuratio.webp\")
We can increase or decrease the size of instance storage while creating it; the free tier is eligible upto 30GB; if you need more storage, it will be billed according to Elastic Block Store (EBS) Pricing
\n![\"Storage\"](\"/af636c41fc75f3e9556d65f0900d2742/7_storage.webp\")
On the next screen, we can add tags to our instance and storage; these tags are key-value pair which are very useful to add properties to our resources, especially when we have multiple instances.
\n![\"Tags\"](\"/013bb6c580181166d7ee92a32211d45b/8_tags.webp\")
We can define the firewall rules in a security group attached to our instance. With the help of these rules, we can control the traffic to our instance.
\n![\"Security](\"/542385138ace677410dfae52bef06896/9_security.webp\")
Once we are done with firewall rules, we can review the complete detail of our new instance on a single page, and here we can click Launch button to launch the instance.
![\"Review\"](\"/39083c0324aa6fe4c8bafab2ab1002ef/10_review.webp\")
When we click Launch, it will open a pop-up that will require you to select a pre-existing public-private key-pair or create one to connect to our instance securely. Once you select/download the key, you will be able to launch the instance.
![\"Security](\"/152f89066e3bcbe121bd4b29152a452b/11_key.webp\")
It will take approximately 5-10 min to launch the instance. Once launched, You can see the list of your running instances by clicking on the Instances button on the left menu.
![\"Running\"](\"/693d0043ef65710f306cd757b94d6f4f/12_runnning_instace.webp\")
As you can see, it is effortless to create a free tier AWS instance to deploy your application. In the upcoming article, we will show you how to deploy an application on the EC2 instance and the best practices.
\n","frontmatter":{"date":"November 18, 2020","updated_date":null,"description":"Learn how to create an EC2 (Elastic Compute Cloud) instance in an AWS account in simple and straightforward steps.","title":"How to create an EC2 Instance in AWS","tags":["AWS","DevOps","EC2"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/d8663624ccdd85c88db0a127028ee564/58556/ec2cover.webp","srcSet":"/static/d8663624ccdd85c88db0a127028ee564/61e93/ec2cover.webp 200w,\n/static/d8663624ccdd85c88db0a127028ee564/1f5c5/ec2cover.webp 400w,\n/static/d8663624ccdd85c88db0a127028ee564/58556/ec2cover.webp 800w,\n/static/d8663624ccdd85c88db0a127028ee564/99238/ec2cover.webp 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Puneet Singh","github":"puneetsingh24","avatar":null}}}},{"node":{"excerpt":"What is Git Cherry Pick Git cherry-pick is a powerful command that allows any specific Git commits to be selected by reference and append to…","fields":{"slug":"/engineering/git-cherry-pick/"},"html":"Git cherry-pick is a powerful command that allows any specific Git commits to be selected by reference and append to the current working HEAD. The act of picking a commit from a branch and adding it to another is cherry picking. For undoing modifications, git cherry-pick can be useful. Say, for example, that a commit is made to the wrong branch unintentionally. You may turn to the right branch and select the commit to where it is supposed to belong.
To showcase this, let us assume we have a repository with the following branches:
\nalpha - beta - gama - delta `Master`\n \\\n x - neutron - Ultraviolet `Feature`git cherry-pick commitSha
In this example, commitSha is a reference to commit. Using the git log, you can locate a commit referenced assum we wanted to use commit 'neutron' in master in this example. We make sure that we are working on the master branch first.
\ngit checkout master
git cherry-pick neutron
Once executed, our Git history will look like:
\nalpha - beta - gama - delta - neutron `Master`\n \\\n x - neutron - Ultraviolet `Feature`\n\t The neutron commit has been successfully picked into the feature branch.
\ngit cherry-pick is a useful tool but isn't best practice always. Cherry-picking can trigger duplicate commits, and traditional merges are preferred instead in many situations where cherry-picking would work. Git cherry-pick is a useful option for a few situations.
\nA team will often find individual members working in or around the same code sometimes. Perhaps there is a backend and frontend component of a new product feature. There may be some shared code between two sectors of the product. Perhaps the developer of the backend produces a data structure that will also need to be used by the frontend. In order to select the commit in which this hypothetical data structure was created, the frontend developer could use git cherry-pick. This selection would allow the developer of the front end to continue progress on their project side.
\nWhen a bug is discovered, it is essential to fix that quickly as possible. For example, let's say a developer has started working on a new feature. During the development of a new feature, they find an existing bug. The developer creates an explicit commit to fix this bug. This new patch commit can be cherry-picked directly to the master branch to quickly fix the bug.
\nA feature branch can often go stale and not be merged into a master. Often, without merging, a pull request might be closed. Git never sacrifices those commits, and they can be identified and cherry-picked back to life by commands such as git log and git reflog.
\n-edit\nPassing the -edit option causes git to trigger a commit message before the cherry-pick process is introduced.
\n—no-commit\nThe —no-commit option executes the cherry-pick, but it transfers the contents of the target commit into the working directory of the current branch instead of making a new commit.
\n—the-signoff\nThe —signoff option adds the signature line 'signoff' to the end of the cherry-pick commit message at the end.
\nGit cherry-pick also accepts merge strategy options and conflict resolution as well. Please check the git merge strategy documentation.
\n","frontmatter":{"date":"November 17, 2020","updated_date":null,"description":"Introduction to Git Cherry-pick and its usages.","title":"How to use Git Cherry Pick","tags":["git"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/7cc5358c073674d856e8ea5cddc47710/58556/cherrypck.webp","srcSet":"/static/7cc5358c073674d856e8ea5cddc47710/61e93/cherrypck.webp 200w,\n/static/7cc5358c073674d856e8ea5cddc47710/1f5c5/cherrypck.webp 400w,\n/static/7cc5358c073674d856e8ea5cddc47710/58556/cherrypck.webp 800w,\n/static/7cc5358c073674d856e8ea5cddc47710/99238/cherrypck.webp 1200w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Abhimanyu Singh Rathore","github":"abhir9","avatar":null}}}},{"node":{"excerpt":"Application Security is one of the primary concerns for a software developer. People trust your application and share sensitive or personal…","fields":{"slug":"/engineering/password-security-best-practices-compliance/"},"html":"Application Security is one of the primary concerns for a software developer. People trust your application and share sensitive or personal information. As a software developer, you need to take care of your application user information security. Authentication and authorization both play critical roles in application security. They confirm the identity of the user and grant access to your website or application.
\nThe process in which confirm the user's identity and provides access to sensitive information is called authentication. Generally, authentication is done through the email/username/password. Authentication using the password is the older and common way, so passwords are a critical component of user's identity security. Password policy is the front line of defense to protect user identity. However, weak passwords may violate compliance standards. A simple or common password could be reversed engineered back to plaintext and sold on the dark web, or result in a costly data breach if compromised.
\nPassword policies and compliance are rules and methods that enforce the user for using a secure and robust password. A billion credentials were stolen last year from multiple data breaches. According to Verizon's Data Breach Report, 81% of data breaches are caused by compromised, weak, and reused passwords. According to National Cyber Security Centre (NCSC) recent analysis, millions of peoples are using easy to guess passwords like 123456. Recently a security researcher claimed he hacked President Trump's tweeter account by guessing his password maga2020! so now we can understand the need for Password Policy & Compliance. You can check the top worst passwords list here.
The Minimum password age policy is to decide how many days minimum users must keep a password before changing it. This password policy.
\nThe \"Enforce password history\" policy is used to make sure the number of unique passwords a user must set before reusing an old password. This is an important policy because password reuse is a common issue – the user feels more comfortable with the old passwords. Using the same password for a long duration for a particular account, it will create a strong chance for the password compromised in some way, such as in a brute force attack. Password age policy shouldn't be efficient until the password history policy. Users must change their password, but they can reuse an old password; the effectiveness of a password age policy is greatly reduced.
\nThe Minimum Password Length policy decides the minimum number of characters needed to create a password. Minimum Password Length should be at least eight characters or more. Longer passwords are generally more secure and harder to crack than short ones. For even greater security, you could set the minimum password length to 14 characters.
\nThe Passwords Complexity Requirements policy make sure user shouldn't use basic passwords. Passwords should be a combination of uppercase, lowercase, and numbers also include some special characters. We can set the following policies in the password Complexity Requirements.
\nThe Password must use following characters combinations
\nThe users shouldn't use the common passwords, so Restrict the use of common passwords. You can refer to this document for a common password list maintained by LoginRadius and this list is dynamic, and it gets updated from time to time.
\nA Password dictionary is a file that contains a list of potential passwords. This feature prevents your user's from setting a password available in the dynamic password dictionary. We are using this dynamic Password Dictionary in the LoginRadius to prevent the use of dictionary passwords.
\nEnabling the Password Audit policy allows you to track all password changes. By monitoring the modifications that are made, it is easier to track potential security problems. This helps to ensure user accountability and provides evidence in the event of a security breach.
\nPassword compliance is a set of rules to enhance user's data security by encouraging users to use strong passwords and use them properly.
\nThe FDA regulates the set of rules for the food, drugs, biologics, medical devices, electronic products, cosmetics, veterinary products, and tobacco products Industries.
\nPasswords for FDA Industry Systems accounts must meet ALL of the following requirements:
\nThe Health Insurance Portability and Accountability Act (HIPAA) enforce a set of rules for sensitive patient data protection. Companies that deal with protected health information (PHI) must ensure HIPAA compliance.
\n!@#$%^&*()_+|~-=\\'{}[]:\";<>?,./;PCI is the set of rules or guidelines for the businesses that are dealing with payment card data.
\nNIST creates a set of rules or guidelines for the businesses that are providing services to the federal government. These guidelines to help federal agencies meet the requirements of the FISMA; however, other organizations reference NIST for strong security standards.
\nI have explained why we needed a strong password policy & compliance. It doesn't matter how strong a password you are using, but bad guys are using new methods or technologies for exposing the user data.\nMost of the data breaches are happing because of Common or weak passwords. MFA, passwordless, or one-time password are providing additional security for a user account.
\nhttps://www.fda.gov/food/online-registration-food-facilities/random-password-generator-fda-industry-systems
\nhttps://uwm.edu/hipaa/security-guidelines/#password
\nhttps://pcipolicyportal.com/blog/pci-compliance-password-requirements-best-practices-know/
\nhttps://spycloud.com/new-nist-guidelines/
\n","frontmatter":{"date":"November 12, 2020","updated_date":null,"description":null,"title":"Password Security Best Practices & Compliance","tags":["Security","Password","Compliance","Passowrd Policy"],"pinned":null,"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/4e0affaac848158a3cb23d1551a0076e/58556/password-security.webp","srcSet":"/static/4e0affaac848158a3cb23d1551a0076e/61e93/password-security.webp 200w,\n/static/4e0affaac848158a3cb23d1551a0076e/1f5c5/password-security.webp 400w,\n/static/4e0affaac848158a3cb23d1551a0076e/58556/password-security.webp 800w,\n/static/4e0affaac848158a3cb23d1551a0076e/99238/password-security.webp 1200w,\n/static/4e0affaac848158a3cb23d1551a0076e/135cd/password-security.webp 1280w","sizes":"(max-width: 800px) 100vw, 800px"}}},"author":{"id":"Vijay Singh Shekhawat","github":"code-vj","avatar":null}}}},{"node":{"excerpt":"Planning to work out some identity management best practices for 2021? 2020 has not been a good year in the history of cybersecurity and…","fields":{"slug":"/identity/identity-access-management-best-practices/"},"html":"Planning to work out some identity management best practices for 2021?
\n2020 has not been a good year in the history of cybersecurity and identity management. With the pandemic forcing many organizations to shift their workforce to remote environments abruptly, security and business continuity concerns hit real hard for the majority of IT stakeholders.
\nNot surprisingly though, external threat actors sought COVID-19 as the perfect opportunity to facilitate large-scale cyber attacks. Speaking of figures, cyber insurance and security company, Coalition observed a 47% increase in the severity of ransomware attacks and a whopping 100% increase in the count from 2019 to Q1 2020.
\nThe dust is still settling. With compromised credentials remaining a key component in most cyberattacks, it is time for business leaders to reevaluate their identity and access management best practices for 2021 and start executing.
\nForbes.com, 83% of enterprises' workload will be on the cloud by 2020. But then, it will be creating new challenges and worsening the existing ones for businesses. Among the top cloud security vulnerabilities in this row include account hijacking, DDoS attacks, data breach insecure interfaces and APIs, malicious insider threats, and misconfiguration. ![\"alt_text\"](\"/56e21e15b3bad5f35f42dceec078a859/Identity-and-Access-Management-img2.webp\" "\\"IOT\\"")
Identity and access management (or IAM) enables businesses to define the roles and privileges of individual users within the network. They request consumers to provide relevant information, automate identity management, accounts, and credentials.
\nIAM improves the overall consumer experience by ensuring compliance with corporate policies and government regulations using security tools like multi-factor authentication (MFA), consent and preference management services, single sign-on (SSO), and more.
\nAs we move into a new decade, the consumer identity and access management market will not only be more critical than ever but look different than it was a few years ago. In fact, it is also expected to grow from USD 7.6 billion in 2020 to USD 15.3 billion by 2025.
\nBy 2021, your business must incorporate the following identity and access management best practices to succeed.
\nThe best strategy in the dynamic setting of modern business networks is to presume that no one is trustworthy unless proved otherwise.
\nThe zero trust model is focused on continuously authenticating consumers—activities are tracked, and risk levels are evaluated during each session. Zero trust equips a device to identify abnormal behaviors that suggest a breach or violation of the law.
\nMulti-factor authentication or MFA is the first step in building layers of trust for your consumers' accounts. Apart from the password, it offers two additional layers of authentication.
\nThe former could be a key or a security pass. While the later means biometrics, for example, retina scans, fingerprints, or voice recognition that your consumers have inherited.
\nMFA ensures that even if one layer is compromised, the hacker still has to break in another layer of security to access your system.
\n![\"Enterprise](\"/860c267222fd012ab48fe9e6c26d0129/EB-The-Enterprise-Buyer%E2%80%99s-Guide-to-Consumer-Identity.webp\")
The Principle of Least Privilege (also known as The Principle of Least Authority) applies to the practice of assigning minimum levels of access – or permissions to a consumer that is essential to accomplish their roles and corresponding duties.
\nThough privileged accounts are necessary for some tasks, it should not be followed as an everyday practice. Because if a data breach happens to such accounts, the result may be catastrophic.
\nAn efficient way to reduce the possibility of internal and external data breaches is through role-based access control (RBAC) or the restriction of non-essential access to sensitive information.
\nYou can apply this identity and access management best practice by offering access to a consumer for a specific timeframe (for example, 30 minutes) and then automatically revoking access. Micromanaging access in this way can improve the overall cybersecurity quotient.
\nStrong passwords have always been one of the pillars of an impactful IAM strategy. The best ones should be easy to remember and hard to guess. Here are a few best practices for password creation recommended by NIST.
\nSelf-serve onboarding is enabling your consumers to onboard themselves. The onboarding journey often starts with a registration page. Your job is to drive your consumers past the registration page and then onto activation. It also, ultimately, helps you retain them.
\nThe more you can adapt your approach to their needs, the easier it will be to win loyal consumers. A few other areas you can successfully deliver include passwordless login, password reset, profile management, consent management, and preference management.
\nAnother identity and access management best practice are to roll out data security policies and procedures wherever possible and practically. Ensure that you adhere to global regulatory compliances like the General Data Protection Regulation (GDPR), California Consumer Privacy Act (CCPA), and other security standards like Health Insurance Portability and Accountability Act (HIPAA).
\nConsumers worry about the safety of their data the most. Adherence to regulatory enforcement reaffirms that their data is safe and in trustworthy hands.
\nAs the name suggests, passwordless login is the method of authenticating consumers without the need to enter a password. The benefits of going passwordless are many— it improves overall consumer experience as consumers no longer need to memorize any credential, saves time and productivity, more robust security against attacks like phishing, credential stuffing, and brute force, and greater ease of access.
\nPasswordless login can be implemented through different approaches. A few of the common ones include:
\nThere may be times when you provide access to someone; it stays in the same condition even if the access isn't required anymore. Anyone with malicious intent can access this data and conduct a breach.
\nTherefore, it is always safe to opt for routine access audits. You can review the given accesses and check if those accesses are still required. When a consumer needs additional access or wants to revoke access, you can take care of such requests accordingly in a timely fashion.
\nData is powerful, so it must be available to only the right people. One of the key tools you can use to ensure corporate cybersecurity is identity and access management. There are several IAM providers in the market, but how do you know which is your organization's best solution?
\nLoginRadius offers just the right framework (including the ones mentioned above) to go beyond consumer expectations—which is all that matters.
\nAs an ideal CIAM solution, LoginRadius is scalable and easy to deploy. It offers advanced MFA solutions, third-party vendor management using federated SSO protocols, zero-trust security architecture, and robust access management so that consumer workflow is duly specified and streamlined.
\nEnforcing identity and access management best practices require that you understand who can access your sensitive data and under what circumstances they can access it.
\nYou also need a comprehensive overview of your organization’s IT infrastructure so you can monitor all your elements for potential and existing threats. Staying updated on the latest industry trends will help you improve your current IAM environment.
\n![\"book-a-demo-loginradius-banner\"](\"/1bebf239d110701b9b534d7eb481a5ac/Book-a-demo-banner.webp\")
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.
\nWe’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 LoginRadius website—to be faster, more intuitive, and developer-first in every way.
\nThe goal? Having them spend less time searching and more time building.
\nLoginRadius’ 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.
\nHere’s a closer look at what’s new and why it’s important:
\n![\"This](\"/f46881583c7518a93bb24e94c32320de/a-developer-friendly-dark-theme.webp\")
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.
\nThe 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.
\nSo, 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.
\n![\"This](\"/e5358b82be414940f3fb146013845933/capabilities.webp\")
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:
\nThis structured layout ensures you can quickly understand each capability and how it integrates into your identity ecosystem.
\n![\"This](\"/a8c155c2b6faf3d5f4b4de4e2b14d763/developers-menu.webp\")
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.
\nThe 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.
\n![\"This](\"/b2f9a964a2da0ea83e2f8596b833bba7/we-support-your-tech-stack.webp\")
Developers now have a clear view of the tech stack available with LoginRadius, designed to support diverse business needs.
\nOur platform offers pre-built SDKs for Node.js, Python, Java, and more, making CIAM integration seamless across popular programming languages and frameworks.
\nCheck out our revamped LoginRadius website and see how the improved experience makes it easier to build, scale, and secure your applications.
\nDo 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!
\n","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":666,"currentPage":112,"type":"///","numPages":164,"pinned":"ee8a4479-3471-53b1-bf62-d0d8dc3faaeb"}},"staticQueryHashes":["1171199041","1384082988","2100481360","23180105","528864852"]}