WhatsApp-Clone-Client-React VS Passport

This tutorial was written using Tortilla — the Tutorial framework.

Client — urigo/WhatsApp-Clone-Client-React

When I was writing the WhatsApp-Clone I used a different approach to overcome the problems mentioned above. Instead of creating a dedicated component for each styled element, I used a container that has all the CSS rules with private classes. By private classes I mean, classes which start with an underscore (e.g. _my-class). This way I’m less likely to collide globally defined CSS rules:

If you want to see graphql-code-generator in action, you can look at the awesome WhatsApp-Clone-Client-React project made by The Guild. Here is the diff (thanks to Eytan Manor) showcasing the generated hooks applied to a real codebase.

Next, use something like https://www.npmjs.com/package/passport, this is authentication middleware, and it works similarly for different authentication providers. Carefully read the documentation. OAuth is complicated, but that's because it solves a complicated problem

Passport is outdated and the project has been more or less on a stand-still for years now. As of currently, there are more than 320 open issues and very few have been resolved within the last months. I'd highly advice you not to use Passport for your applications in 2023. You've received some great alternatives by others in the comments here.

lib: The lib folder, short for "library", is mostly used to store the actual source code of the package, but it can also be used to store third-party code, utilities and helpers. Example from passport.

Research - there's github and stackoverflow documentation saying this is part of passport.js 0.6.0 that can be resolved by turning logout into a callback function (I was not the first person to encounter this error).

passport for authentication

I went down the rabbithole of using next-auth (now authjs) for a recent project. Having used Passport.js [1] for Oauth2 the last time I was doing node.js ~3 years ago, I found this library to have many footguns as comments/answers on SO and Github.

Seems like many people are trying to shoehorn their codebase [2] (!!) to make it work with the way the library manages sign-in flow, redirects, cookies, logout, etc. [3]

These were solved problems in the MEAN stack era with middlewares, but now that Next.js/react is the trend, people are doing everything they can to make it work - from relaxing security configs, to stashing things in the JWT just so some callback can get an additional piece of data.

[1] https://github.com/jaredhanson/passport

Passport to act as auth middleware to authenticate requests Passport

Checkout using NestJS that uses Passport or just checkout Passport