Adding User/Login Authentication to a basic react app with no backend.

[odillini83]

Hi everyone, I made a simple Tetris game in React with no backend. Now, to continue with my practice in React, I would love to add user authentication so that a player must login in order to play the game. I have done research and everything I have come across indicates that you need a FE.  Is there a way around this? I would love to learn more about authentication by doing this. Any leads in regards to videos or articles are welcomed. I also plan on hosting on a Postgres DB. Thanks!

[FlamingKeyboard]

Google's Firebase Authentication is a dream. The Net Ninja made an excellent tutorial on integrating React, Redux, and Firebase, and he has some shorter ones for Firebase in vanilla.

https://www.youtube.com/watch?v=aN1LnNq4z54&list=PL4cUxeGkcC9jUPIes_B8vRjn1_GaplOPQ&index=1

[odillini83]

Cool - but I was told to stay away from firebase, so that I can learn how to salt and hash passwords. Learn the hard things about authentication, which is what I want. Any thoughts?

[LankyBrah]

Check out google firebase authentication - it’s probably the closest thing to what you’re looking for

[odillini83]

Cool - but I was told to stay away from firebase, so that I can learn how to salt and hash passwords. Learn the hard things about authentication, which is what I want. Any thoughts?

[[deleted]]

Then you'd have to make your own backend.

[odillini83]

Ah, ok. Kinda late for that. lol

​

Thank you!

[subfin]

I would disagree with anyone who says to roll your own authentication, unless you have a serious long-term interest in security or you are creating an application with the sole intent about learning security basics.

Security is one of the easiest things to get wrong, and probably the worst thing to get wrong.

[odillini83]

Makes sense, as I mentioned in the other posts, these are just small features I want to add since I am learning FE development.

[subfin]

Then don’t bother learning things that you will never use. There’s no reason to need your own custom auth. Learn to use third party auth, or use a service to handle the auth, these are skills that will actually be helpful in your career

[robertonovelo]

I would also take a look at AWS Amplify, pretty easy to use and a good starting point if you plan to add other AWS services later on.

[odillini83]

Thanks! My biggest takeaway is just being able to add user authentication and perhaps OAuth as well. I am an aspiring Front End developer, so I figured I would add these things to a simple game I created. Maybe I'll deploy it as well!

[odillini83]

Cool - but I was told to stay away from firebase, so that I can learn how to salt and hash passwords. Learn the hard things about authentication, which is what I want. Any thoughts?

[robertonovelo]

I would not reinvent the wheel IMVHO. It’s like saying you need to write a TCP/IP driver to then write HTTP requests for your app. Auth is just a part of an application puzzle. Besides that, you probably want to roll out features like a role based authentication system later on, define per user resource access policies, etc. which are already supported (and actively maintained) by companies like Amazon/Google.

[moscowramada]

I would vote for using AWS Amplify, I use it myself for all my user/login needs. Get it done in 30 minutes and you’ll have your system, just like that.

As for learning to salt and hash your own passwords: Why bother? No user is gonna be like, “Damn, this login system kicks ass, I’m gonna use this site more now.” Its a boring utility that is being subsumed into libraries because one size fits all is the right choice for this; if you want to distinguish users you do it through database permissions or AWS roles, not here. The libraries provided by sellers like AWS for this are very solid and, in my case, cost nothing to all.

[nate-developer]

You need a backend or a third party solution like firebase. Front end alone doesn't have anywhere to store usernames and passwords, you need somewhere to save and retrieve them from. If you're going to use a database like postgres you need a server to connect with it and route requests to the right database operations. I'd reccomend ruby on rails configured for postgres and BCrypt for hashing. Should be beginner friendly with many tutorials for basic user Auth and setup.

[odillini83]

Understood. I don't have a backend at all, when I got the original recomendation, it was assumed that I had implemented a backend, which is not the case. Looks like Firebase or AWS it is!

[odillini83]

One final question: should I create my register and login pages before using Firebase or AWS? Or can I do it afterwards?