Login/Registering Screen

Hello,

Me and my group are working on creating a simple app using Framework7. One of the requirements is to have a login screen. The problem is, we are all new to F7 and we are unsure as to how we meant to implement a login/register screen.

We have spent a fair bit of time on the internet and looking at the documentation, but with no video tutorial we are unable to figure out how to get this login/register screen to work.

We have the 1 screen template loaded, so we can see the HTML and JS code, however we just don’t know how to make it talk to the back end. The back end has not been created as we are unsure as to how to do it properly.

If anyone knows of any good resources to help us out, then we would greatly appreciate the help.

Thank you

Read the example that is in the documentation.

https://framework7.io/docs/login-screen.html#examples

Basically, just send the backend username and password. validate the credentials with a db. If user and password are correct. Return a JWT, or whatever you need.

For registration do the same. You can use again the documentation as an example;

https://framework7.io/docs/inputs.html#examples

There you have a lot of information. Just send the fields you feel like to the backed.
idk, Name, Last Name, Email, Birthday, Username, etc.

Store the user in the db. Redirect user to login page.

To communicate with the back end F7 has an request library.

https://framework7.io/docs/request.html#post

I created a YouTube tutorial how to login/signup users with F7. Might be helpful: https://youtu.be/cYlSZLV5qN4

2 Likes