Giter VIP home page Giter VIP logo

nextjs-local-authentication's Introduction

Next.js local authentication with MongoDB

Greetings, traveler!

This is the beginning stages of an app I'm building. As long as the app itself is half-finished, I figure this shell is a satisfactory portfolio piece in the meantime. Please enjoy the source code on GitHub, and observe the following features:

Pages

  • This demo consists of five pages: a homepage, /dashboard, /settings, /register, and /login.
  • The dashboard and settings pages require aunthentication, so if you try to visit either before logging in, you'll be redirected to the login page.

Accounts

  • You can register with any username (that doesn't currently exist in the database) and password you like, and your credentials (after your password has been hashed with bcrypt) will be stored in a database managed by MongoDB Atlas on a free plan.
  • If you'd rather not create an account, you can instead log in with username ty and password password (I promise I never use that in real life).
  • Once you've logged in, the dashboard page isn't terribly interesting, but if you head on over to Settings, you can change your username and/or password and even delete your account, which completely removes its database entry. Note, though, that you can do none of these things with the demo ty account, for which the profile update and delete account APIs will return 403 errors.
  • If you try fiddling around with multiple accounts, you'll see that you can't register an account with a username that already exists, and you also can't change your username to that of another account.

Cookies

  • Authentication and session information are facilitated by a browser cookie named "token", which you can see with your browser's web development tools. If you do not check the "remember me" box on the login page, this cookie will expire when you end your browser session (i.e., quit the browser program, not just close the tab or window). If you do check the box, this cookie will expire in two weeks.
  • If you open the dashboard and/or settings pages in multiple browser tabs, when you log out in one tab (in the profile dropdown in the top-right of the page), you'll automatically be logged out of all other tabs.

Design

Serverless functions

  • This demo's APIs (and server-rendered pages) are serverless functions created using Next.js and hosted on ZEIT Now.

Thanks for checking out this demo!

Sincerely,
Ty

nextjs-local-authentication's People

Contributors

dependabot[bot] avatar tymick avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

Forkers

wasabi93 ac-ch

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.