Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Okta: A Nice Solution... Even for Small Apps

DZone's Guide to

Okta: A Nice Solution... Even for Small Apps

In this article, see how Okta is more than an enterprise solution, but an option for solutions that have a small number of users - in this case, one.

· Web Dev Zone ·
Free Resource

Jumpstart your Angular applications with Indigo.Design, a unified platform for visual design, UX prototyping, code generation, and app development.

As a follow-up to my "New Application Journey" article, I wanted to focus on how Okta provides an easy-to-use and easy-to-configure option — even for non-enterprise-scale applications.

Recap

As a TL;DR (too long, didn't read) to the original article, I wasn't happy with the application my mother-in-law was using for her very small business in the southeast section of the United States. So, I used her business needs to create a new application from scratch using Angular, MySQL, and the AWS environment. However, I needed to have some layer of security, since I didn't want someone who happened to uncover the URL to her application to gain unauthorized access.

Like usage of AWS was an objective for me, I wanted to look into Okta as well. I have utilized Okta at several client engagements, but have not had the opportunity to setup Okta from the ground up.

About Okta

According to Wikipedia, Okta, is a publicly-traded identity management company based in San Francisco.[1] It provides cloud software that helps companies manage their employees' passwords, [2] by providing a “single sign-on” experience. [3] It was founded in 2009 and had its initial public offering in 2017, being currently valued at over $6 billion.

From a Gartner Magic Quadrant perspective, Okta is the leader in the Identity Management space:

Image title

When I looked into using Okta for this very small application, I was able to get started quickly by creating a developer account. You can get started using the following URL:

https://www.okta.com/free-trial/

Creating an Application

Once I had my account created on okta.com, I was able to create a new application.

The new application wizard allows me to pick Single-Page App (for my Angular client):

Image title

Then I populated the settings: (fictional information below)

Image title

From there, I will be able to see the private and public information related to my application. I am now ready to add information to my Angular and Spring Boot applications.

Connecting to Angular

The Okta site allows you to pick the client for the application you wish to secure.

Image title

After selecting Angular, I was taken to the following URL:

https://developer.okta.com/quickstart/#/angular/nodejs/express

Here, the necessary steps required to hook Angular into Okta were quick and easy to apply.

Connecting to Spring Boot

Next, I needed to make sure my Java API (running Spring Boot) was ready too.

Image title

Still on that same page, the biggest change was to introduce a dependency to the okta-spring-boot-starter artifact:

<dependency>
    <groupId>com.okta.spring</groupId>
    <artifactId>okta-spring-boot-starter</artifactId>
    <version>0.5.0</version>
</dependency>

Once this was in place and I followed the necessary steps to introduce my Okta configuration, updating the RESTful controllers was as simple as using the @PreAuthorize annotation. Here is a simple example:

@RestController
@PreAuthorize("hasAuthority('GroupForAccessToMotherInLawsApp')")
class ThisIsARestController {

    @GetMapping("/api/endpoint")
    public List<String> getSomething() {
        // handle request
    }
}

In the example above, the @PreAuthorize annotation would check to see if the token for the current user accessing the API is a member of the GroupForAccessToMotherInLawsApp group... which is not really the name of the group I chose.

The End State

Once I had everything in place, I was ready to create a User record for my mother-in-law. That is as simple as filling out the following form, checking the box to "Send user activation email now," and single-clicking the Save button.

Image title

After she received the email and configured her Okta account, she was able to login to her application using her email address. When she tried to access the URL for her application, Angular realized there was not a valid token for her and redirected her to the login page:

Image title

Another cool thing about Okta is the ability to personalize the login screen. So, I opted to reuse that same really cool picture of the beach.

Looking Ahead

This article is a continuation of a multi-part series that I am putting together regarding my new application journey to providing a better application experience for my mother-in-law. Below, is a list of the current and planned articles, if you are interested in reading more:

  • New Application Journey

  • Okta, a nice solution - even for small apps (this article)

  • FormBuilder in Angular 6 

  • The Challenge of the Commission Report (coming soon)

  • Making the County List Dynamic (coming soon)
  • Getting CI/CD in place (coming soon)

  • What I Learned After Initial Deployment (coming soon)

Have a really great day!

Take a look at the Indigo.Design sample applications to learn more about how apps are created with design to code software.

Topics:
okta ,angular ,aws ,application security ,web dev

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}