Skip watching entire videos - get the full transcript, search for keywords, and copy with one click.
Share:
Video Transcript
in today's video I will show you how to
set up the login and sign up page using
Super Bass and react this is what the
final result will look like this is a
sign up page where anyone can sign up
for an account and once you have an
account you can click on this link to go
to the sign in page once the user
successfully signs up for an account you
will be able to go to super based
dashboard and see the user here so to
get started the first thing you need to
do is go to superbass.com and create an
account once you've successfully create
an account you should see this page
where you can create a new project click
on new project and click on new
organization and for the names type
whatever you'd like I'll just type in
tutorial for this example and hit create organization
organization
then type in a name for your project
I'll just do a tutorial example and for
your database password just make sure
and then for the pricing plan just make
sure it says free and then click on
create new project
once you're on this page just copy both
of these values that you see here as we
would need these values later now we
create our react app and then connect
our Super Bass back into it later so we
can start by typing in the command npx
create react up followed by like the
periods just to build the react project
in its current folder and I'll just hit
enter once the react app has been
created the next thing we want to do is
to create an environment file to load
all of our secret variables that we're
going to be using from Super Bass so
I'll just create a file now called dot
EMV and we're going to need two
different keys and I'll just paste them
here you can name them whatever you
would like for the first key for the
Super Bass URL we can get this by going
back to Super based dashboard and just
copying the URL here and just pasting it
and then for the add-on can you just
copy it here and then paste it here as
well and hit save then we can open up
the source folder and open up the app.js
file we will be using a pre-built auth
UI component that super bass offers we
can learn more about it by going to this
link which I'll make sure to leave a
link in the description once you're on
this page just scroll down until you see
this code snippet and just click copy
then switch back to the code editor and
just place all the code except for the
very last line and just hit save online
8 and 9 we just need to replace both
these values from the values that we
have in our Varma file so let's do
process.env and copy the value here
and then do the exact same thing for the
second line here and just make sure to
use the right key
and then hit save one last thing that we
need to do is to actually install the
Super Bass package which you can do by
going back to documentation like
scrolling up and copying the command
here and then pasting inside terminal
and just hit enter
once that process completes actually we
need to remove the code that's on line
15 then the very last step we need to do
is to add one more import statement and
that is this import statement here once
you've done that now you can run the
application by typing npm Run start and
hitting enter and if you've done all the
steps correctly you should now see this
page we can test the sign up Page by
clicking on this link and then see email
address is type in your email and then
for the password type in any password
and click sign up
you should now see this message saying
to check your email if you go to your
email you should see a link just like
this asking you to confirm your sign up
and just click on the link that says
confirm your mail
it should bring you back to this page if
we go back to the super based dashboard
and click on authentication here you
should now see the email that we just
signed up with if we go back to the
react app we can now log into our
account as well and the easy way to test
that this is actually working is to look
at the network tab as we make the sign
in request so if I type in the email
again and type in my password
and click on sign in and if we click on
the network request we can see that in
the headers that we get a status code of
200 back and a response we can see
things like our access tokens refresh
token and token type and that's the end
of this super based all tutorial
hopefully you have a better
understanding of how to set up your own
login and signup page using Super Bass
as a back end if you found this video
helpful in any way please like the video
and don't forget to subscribe for more content
Click on any text or timestamp to jump to that moment in the video
Share:
Most transcripts ready in under 5 seconds
One-Click Copy125+ LanguagesSearch ContentJump to Timestamps
Paste YouTube URL
Enter any YouTube video link to get the full transcript
Transcript Extraction Form
Most transcripts ready in under 5 seconds
Get Our Chrome Extension
Get transcripts instantly without leaving YouTube. Install our Chrome extension for one-click access to any video's transcript directly on the watch page.
Chrome Extension