How to add Magic Link to a SvelteKit application

What is SvelteKit?
SvelteKit is a framework for building extremely high-performance web apps.
There are two basic concepts in SvelteKit:
  • Each page of your app is a Svelte component
  • You create pages by adding files to the src/routes directory of your project. These will be server-rendered so that a user's first visit to your app is as fast as possible, then a client-side app takes over
  • Building an app with all the modern best practices — code-splitting, offline support, server-rendered views with client-side hydration — is fiendishly complicated. SvelteKit does all the boring stuff for you so that you can get on with the creative part.
    Getting started
    The easiest way to start building a SvelteKit app is to run npm init:
    npm init svelte@next sveltekit-magic
    The above command will ask you some questions about how you'd like to set the template. Choose the 'SvelteKit demo app'. This comes with a Todo list application built-in. We'll make changes to the app, so the user needs to log in using Magic to access the todos.
    cd sveltekit-magic
    npm install
    npm run dev
    This will scaffold a new project in the sveltekit-magic directory, install its dependencies, and start a server on http://localhost:3000.
    Open up http://localhost:3000 on a browser, and you should see something that looks like this...
    {WIP} - This guide will not be using the Cookies, @hapi /iron or session with cookies as show in this Guide.
    To read the full guide, please visit https://magic.link/posts/magic-svelte

    72

    This website collects cookies to deliver better user experience

    How to add Magic Link to a SvelteKit application