Authentication Beyond Passwords

Rate this content
Bookmark

Passwords have long been the keys to our kingdoms. However, they often become the weak points in our armor — forgotten, misused, or exploited. Our Next apps often make use of passwords to authenticate users, but what would a world with no passwords look like? And how we can start driving into that future today?

This workshop has been presented at React Day Berlin 2023, check out the latest edition of this React Conference.

FAQ

The primary focus of Juan's workshop is the future of authentication, specifically passwordless authentication. Participants will implement a Next.js application that allows users to sign up and log in using passwordless authentication flows.

Juan has been a software engineer for over 20 years.

You can find Juan online on most social media platforms at @BAJCMartinez.

Juan enjoys software engineering because he loves to build stuff, particularly software.

Juan experienced a scenario where he was on a train and needed to show his ticket but couldn't remember his password, causing a frustrating situation. This highlights how passwords are easy to forget and can cause inconvenient situations.

Traditional passwords are easy to forget, guess, or crack. People often use simple passwords or reuse the same password across multiple services, which can be compromised if leaked.

Alternatives to traditional passwords mentioned include multifactor authentication, one-time passwords, biometrics, hardware keys, magic links, social logins, and WebAuthn.

WebAuthn is a W3C recommendation for defining an API that lives in browsers for the creation of strong, attested, scoped, public key-based credentials. It uses private-public key cryptography to provide a strong method of authentication.

Passkeys are a method of passwordless authentication that use unique private-public key pairs for each service. They are phishing-resistant and provide a better user experience by eliminating the need for passwords.

Platforms that currently support passkeys include Auth0 by Okta, Google, Apple, and GitHub.

Juan Cruz Martinez
Juan Cruz Martinez
127 min
06 Dec, 2023

Comments

Sign in or register to post your comment.

Video Summary and Transcription

This workshop focuses on the future of authentication, specifically passwordless authentication. It explores the challenges with passwords and introduces various passwordless authentication methods such as magic links and WebOfN. The registration and authentication process for passwordless authentication are discussed, along with the use of passkeys for authentication. The workshop also covers the setup of Auth0 and the creation of a Next.js application with Auth0 integration.

1. Introduction to the Workshop

Short description:

My name is Juan, a developer advocate at Okta. I have been a software engineer for over 20 years, working for big corporations like Siemens and Cal Size. I love building software and you can find me online at BA JC Martinez.

So, hey, my name is Juan. I'm a developer advocate at Okta. I have been a software engineer for over 20 years now, working in all kinds of different projects. I work mostly for big corporations like Siemens and Cal Size. And now I'm working at Okta, which is a completely different type of organization. And the main reason why I do software engineering is because I love to build stuff, but just software stuff. Don't ever ask me to build an IKEA furniture because I'm terrible at it. But as long as it comes to software, I always find my way around that. You can find me online in most social media platforms at BA JC Martinez. So, yeah, you can follow me there if you like to connect and have further discussions about the workshop or just software engineering topics in general, I'm always posting stuff.

2. Introduction to Passwordless Authentication

Short description:

Today's workshop is about the future of authentication and how it is passwordless. We'll start with a presentation and then dive into coding a Next.js application for passwordless authentication. This will be an interactive session, so feel free to ask questions and share your thoughts. Let me share a personal experience with passwords. While on a train, I realized I forgot my password when I needed to access my ticket. Passwords are easy to forget, and I'm not alone in this struggle.

So the workshop. So today's workshop is going to be about the future of authentication and how the future of authentication is passwordless. At the beginning, we're going to have a short presentation on introducing the topic, but then we're going to get all hands into code and implementing a Next.js application that is going to allow users to sign up and log in using passwordless authentication flows. We're going to discuss that into a lot of detail today.

Also, this is going to be an interactive session. So if you have any questions, if you have any comments or anything you would like to talk about, please feel free to use the chat. I would love to do this as interactive as possible as you follow me along creating the application and working on the code. So it doesn't feel just me doing a presentation of everything, but it's actually all of us building in public in a way.

So let's get started a little bit with our presentation. That was enough a little bit about myself. And oh, look at that. I just got a notification here on my phone that says that my train to Berlin is here. So that means that I get to jump on the Deutsche Bahn train and enjoy my four hour ride to Berlin. Now, while I'm on the train, I see the person that is responsible for checking on the tickets. So I take up my phone, and I open the Deutsche Bahn app. Just to find out that I'm not logged in, right? And as the guy is getting closer, I need to enter my username or my email and password in order to access my ticket. So I can present it to him. But I kind of like forgot what my password is. And now this is a total nightmare scenario because he's approaching I don't know what my email that I used to sign up wasn't like my regular email was like my company email. What was the password that I use? Like, I'm terrible at this. And I'm not the only one because passwords are easy to forget. Right?

Watch more workshops on topic

0 to Auth in an hour with ReactJS
React Summit 2023React Summit 2023
56 min
0 to Auth in an hour with ReactJS
WorkshopFree
Kevin Gao
Kevin Gao
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool. There are multiple alternatives that are much better than passwords to identify and authenticate your users - including SSO, SAML, OAuth, Magic Links, One-Time Passwords, and Authenticator Apps.
While addressing security aspects and avoiding common pitfalls, we will enhance a full-stack JS application (Node.js backend + React frontend) to authenticate users with OAuth (social login) and One Time Passwords (email), including:- User authentication - Managing user interactions, returning session / refresh JWTs- Session management and validation - Storing the session securely for subsequent client requests, validating / refreshing sessions- Basic Authorization - extracting and validating claims from the session token JWT and handling authorization in backend flows
At the end of the workshop, we will also touch other approaches of authentication implementation with Descope - using frontend or backend SDKs.
0 to Auth in an Hour Using NodeJS SDK
Node Congress 2023Node Congress 2023
63 min
0 to Auth in an Hour Using NodeJS SDK
WorkshopFree
Asaf Shen
Asaf Shen
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool.
We will enhance a full-stack JS application (Node.JS backend + React frontend) to authenticate users with OAuth (social login) and One Time Passwords (email), including:- User authentication - Managing user interactions, returning session / refresh JWTs- Session management and validation - Storing the session for subsequent client requests, validating / refreshing sessions
At the end of the workshop, we will also touch on another approach to code authentication using frontend Descope Flows (drag-and-drop workflows), while keeping only session validation in the backend. With this, we will also show how easy it is to enable biometrics and other passwordless authentication methods.
Table of contents- A quick intro to core authentication concepts- Coding- Why passwordless matters
Prerequisites- IDE for your choice- Node 18 or higher
0 To Auth In An Hour For Your JavaScript App
JSNation 2023JSNation 2023
57 min
0 To Auth In An Hour For Your JavaScript App
WorkshopFree
Asaf Shen
Asaf Shen
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool.
We will enhance a full-stack JS application (Node.js backend + Vanilla JS frontend) to authenticate users with One Time Passwords (email) and OAuth, including:
- User authentication – Managing user interactions, returning session / refresh JWTs- Session management and validation – Storing the session securely for subsequent client requests, validating / refreshing sessions
At the end of the workshop, we will also touch on another approach to code authentication using frontend Descope Flows (drag-and-drop workflows), while keeping only session validation in the backend. With this, we will also show how easy it is to enable biometrics and other passwordless authentication methods.
Managing Authentication in Next.js
Node Congress 2022Node Congress 2022
155 min
Managing Authentication in Next.js
Workshop
Michele Riva
Michele Riva
Next.js is a compelling framework that makes many tasks effortless providing many out-of-the-box solutions. But when it comes to authentication and user security, it's our mission to make it reliable, secure, and efficient. In this workshop, we'll focus on different user authentication and session management approaches, starting from a custom authentication strategy (that we will build together), and ending learning how to identify and integrate the right auth provider (Auth0, Firebase, etc.) for any app.
Table of contents:- A brief introduction to Next.js- Building an authentication mechanism from scratch- Why we should avoid custom authentication- How to identify the proper authentication mechanism and provider- Integrating NextAuth.js, Auth0, Firebase, or any other provider
Building a Realtime App with Remix and Supabase
Remix Conf Europe 2022Remix Conf Europe 2022
156 min
Building a Realtime App with Remix and Supabase
Workshop
Jon Meyers
Jon Meyers
Supabase and Remix make building fullstack apps easy. In this workshop, we are going to learn how to use Supabase to implement authentication and authorization into a realtime Remix application. Join Jon Meyers as he steps through building this app from scratch and demonstrating how you can harness the power of relational databases!
Server-side Authentication in GraphQL
GraphQL Galaxy 2020GraphQL Galaxy 2020
40 min
Server-side Authentication in GraphQL
Workshop
Roy Derks
Roy Derks
A hands-on workshop about handling authentication and authorization in GraphQL. During this 3 hour workshop you’ll learn how to add authentication to a GraphQL server using JWTs, and handle query responses with user roles. As a bonus we’ll be adding an authentication server with Auth0.The contents:        - Authentication with JWTs        - Handling query responses and user roles        - Auth0Prerequisites:        - JavaScript (preferably TypeScript)        - GraphQL

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

The State of Passwordless Auth on the Web
JSNation 2023JSNation 2023
30 min
The State of Passwordless Auth on the Web
Passwords are terrible and easily hacked, with most people not using password managers. The credential management API and autocomplete attribute can improve user experience and security. Two-factor authentication enhances security but regresses user experience. Passkeys offer a seamless and secure login experience, but browser support may be limited. Recommendations include detecting Passkey support and offering fallbacks to passwords and two-factor authentication.
Server-side Auth with Remix, Prisma, and the Web Platform
Node Congress 2022Node Congress 2022
34 min
Server-side Auth with Remix, Prisma, and the Web Platform
Top Content
This Talk is about server-side authentication with Remix, Prisma, and the web platform. It covers adding authentication to a Remix app, troubleshooting and login setup, handling user login and session creation, creating user sessions and redirects, handling user ID retrieval and validation, and working with cookies in Remix. The speaker emphasizes that Remix is ready for production and suitable for enterprise apps. Remix simplifies the mental model and improves performance by bridging the network gap between the front end and back end.
GraphQL Authentication and Authorization at Scale
GraphQL Galaxy 2021GraphQL Galaxy 2021
22 min
GraphQL Authentication and Authorization at Scale
This talk discusses the implementation of GraphQL Authentication and Authorization at scale at Unity. The speaker explains how they use GraphQL Federation to expose business functionality through a centralized schema and the challenges they faced in handling auth at scale. They describe how they simplified configuration and scaling using Mercurius and implemented hooks and an Orth plugin. The implementation at Unity involves a Unity Orth endpoint and a central Unity Orth directive definition. The talk also covers the implementation of AuthPolicyHandler and AuthDirective for downstream services and showcases different access levels. The Mercurius Auth plugin provides a scalable approach to authentication and ongoing improvements include adding support for a filter schema.
Who Are Vue? Authn In Vue, The Important Parts
Vue.js Live 2024Vue.js Live 2024
23 min
Who Are Vue? Authn In Vue, The Important Parts
This Talk introduces authentication in Vue.js and emphasizes that it is not as difficult as it may seem. The speaker explains the concept of authentication and its importance. A code example is used to demonstrate how to implement authentication in Vue.js, including separate UI parts for login, home, and dashboard views. The Talk also covers handling authentication in the Vue.js router, including defining routes, accessing user credentials, and making requests to the backend.