Skip to content

Instantly share code, notes, and snippets.

@taniarascia
Last active July 5, 2024 05:43
Show Gist options
  • Save taniarascia/a2d35af43ce133de20ac0a8c72558fea to your computer and use it in GitHub Desktop.
Save taniarascia/a2d35af43ce133de20ac0a8c72558fea to your computer and use it in GitHub Desktop.
JavaScript Authentication & Authorization Book/Course

Authentication in Real-World Web Apps with JavaScript

Outline of ideas, concepts to cover, potential projects to write.

Setup Idea

  • Book with a video for each chapter.

Prerequisites/Overview

  • HTML, CSS, JavaScript
  • Front end/client side (Browser)
  • Back end/server side (Node)
  • REST APIs
  • HTTP codes

Concepts

  • Authorization (AuthZ)
  • Authentication (AuthN)
  • Cryptography
  • Headers
  • Sessions
  • JSON Web Tokens (JWT)
  • Identity Provider (IDP)
  • Cross-origin resource sharing (CORS)
  • Single sign on (SSO)
  • Multi-factor authentication (MFA)

Vulnerabilities

  • Leaking sensitive data
  • Storing unencrypted passwords
  • Cross-site request forgery (CSRF/XSRF)
  • Cross-site scripting (XSS)

Persistence

  • Cookies
    • HTTP Only/Secure/SameSite
  • Web Storage
    • Local Storage
    • Session Storage

Specifications/Protocols/Terms/Standards

  • OAuth 2.0
    • Client-side app
      • Proof Key for Code Exchange (PKCE)
      • Implicit grant
    • Server-side app
      • Authorization Code Flow (Authorization Code grant)
  • OpenID Connect (OIDC)
  • System for Cross-domain Identity Management (SCIM)
  • Role-based access control (RBAC)

Project

  • Create a full-stack application
    • Simple front end
    • Node/Express back end
    • Implements sign up, log in, log out, reset password
    • Login 1: Custom username/password login
    • Login 2: OAuth 2.0/OIDC with Google/Twitter/GitHub as the SSO IDP (Google OIDC, Google OAuth 2.0)
    • Ability to associate SSO to an existing user
    • Different roles (admin, user, maybe one more)

Topics to Cover

  • When to use different strategies (for example, PKCE in a client-side only app, session cookies for a BE+FE on the same subdomain, etc).
@stephencweiss
Copy link

Initial reaction is that I love the concepts section, but I've seen / read about almost all of those and where I struggle is what a strategy.

I'm kind of envisioning the concepts are the component pieces, but I'd like to see a section that ties them together and specifically addresses why someone might use them in different ways. What are the trade offs that developers need to consider when taking one approach vs another?

Basically - is there a place where you could walk through a few different, contrasting strategies and identify why someone might choose that approach? What would they be getting? What would they be giving up?

If that's already included - yay 🎉 !

@maheshinder19
Copy link

Awesome. All the best. Looking forward to giving it a read soon!

@MarcinHoppe
Copy link

I'd add a few things, listed by category:

Concepts

  • Basics of cryptography needed to explain password hashing (will be useful later when implementing username/password login)
  • Perhaps obvious, but logging the user out is missing
  • Session management for event such as password reset, account recovery etc.
  • Multifactor authentication would probably be good to mention

Vulnerabilities

  • Leaking sensitive data like tokens, passwords, etc.

Protocols

  • Maybe just mention SAML. It is still the protocol in the enterprise space.

Project

  • Username/login option should include signup and password reset. It is often done poorly and leads to security vulnerabilities. I think there is value in explaining how to do it correctly

@Codeindeed
Copy link

Wow looking up to read them soon

@creative-cranels
Copy link

Awesome! Looking forward to read it (: good luck!!!
https://aaronparecki.com/oauth-2-simplified/
This article made me easier to understand oauth2

@JamesOkunlade
Copy link

Really looking forward to this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment