Getting started

Running the project

To get started developing, consult sapper.svelte.dev.

npm install # or yarn
npm run dev

This will start the development server on localhost:3000. Open it and click around.

Handshake login protocol and OIDC implementation

Sequence diagram outlining the OIDC Authentication flow with Handshake

Protocol

https://docs.namebase.io/handshake-login/handshake-based-oidc-authentication-protocol

OIDC Implementation Guide

https://docs.namebase.io/handshake-login/oidc

Project structure

Routes - src/routes

• create: generates key pair, stores the identity and helps creating the TXT records

• list: view to manage the identities

• login: handle signing and redirects during the OIDC flow

Providers | Context - src/providers

• AnnouncementContext: handles banner messaging
• IdentitiesContext: provides interfaces to manipulate identities
• LoadingContext: handles loading bar at the top
• LoginContext: handles metadata during the OIDC flow
• MediaContext: deals with media query

Services

• IdentityService: provides an easy way to handle indentity by abstracting crypto and storage.

// name: handshake name
// hnsRandom: anti replay attack from oidc
signAndGetpublicKey(name: string, hnsRandom: string)

• DeviceService: provides an abstraction to handle device specific data.

Components

• UI Components like navbar, icons, name/, ...

Join the community

Ask in the Namer Community Discord's https://discord.com/invite/V3aTrkp

Notes

Handshake Login is still experimental and will require rigorous security review before being used for production applications (ie. don’t ask your bank to support Handshake login just yet)