📚 Documentation: Deep dive authentication recipe with Flutter

[gewenyu99]

💭 Description

Goal

Deep dive tutorial for beginners to learn Appwrite Authentication in depth with Flutter.

Content

1. The end product should be a functional app with auth screens.
2. Step by step from setup. If there will be test data, provide a Server SDK script with instructions.
3. Format should be similar to /docs/tutorials/sveltekit
4. Should contain the following content
   1. Sign up
   2. Log in
   3. Verification
   4. Recovery
   5. Conditional routing based on auth state
   6. Preferences
   7. Delete account

How to contribute

Pitch an outline detailing each page you plan to add and headings within, and ask to be assigned. Open a PR after the outline has been approved.

The Appwrite team will collaborate with you on the outline and PR.

Thanks for taking the time to make our documentation better 🙏

👀 Have you spent some time to check if this issue has been raised before?

• I checked and didn't find similar issue

🏢 Have you read the Code of Conduct?

• I have read the Code of Conduct

[Rohit-RA-2020]

Hey @gewenyu99 can I work on this?

[Ayushpanditmoto]

/assign

[Ayushpanditmoto]

Please assign me please @gewenyu99 please

[PratyushChauhan]

Hey @gewenyu99 i am thinking of making something similar to firebase_ui example in firebase docs for flutter.
Please provide me a sample outline so that I can write it out in detail.

[Haimantika]

Hey @gewenyu99 can I work on this?

Hi @Rohit-RA-2020 have assigned the issue to you! Thank you for showing interest in contributing to Appwrite! Happy Hacktoberfest 🎃

Notes:

1. Please update us with your progress every 3 days, so that we know that you are working on it.
2. Join us on Discord - https://appwrite.io/discord to chat about Hacktoberfest and Appwrite!

[Haimantika]

Please assign me please @gewenyu99 please

Hi, we assign on first-come, first-serve basis, if Rohit is unresponsive, then we will assign you.

[Haimantika]

Hey @gewenyu99 i am thinking of making something similar to firebase_ui example in firebase docs for flutter.
Please provide me a sample outline so that I can write it out in detail.

Hi, we assign on first-come, first-serve basis, and you are third in line, if the issue still remains unsolved, we will assign it to you.

[gewenyu99]

What @Haimantika said! 😸

[Rohit-RA-2020]

Outline: Deep dive authentication recipe with Flutter

1. Creating a Idea Tracker with flutter

1. Overview / title of every step in the tutorial and the concept that will be included.

   • SignUp
   • LogIn
   • Account Verification
   • Recovery
   • Conditional Routing
   • Prefs
   • Delete

2. Prerequisites

   • Flutter installed on local computer and account on cloud.appwrite.io
   • Basic knowledge of Dart and Flutter

2. Creating a new Flutter Project

1. Running flutter create command
2. Adding Appwrite as a dependency
3. Running the App for the first time

3. Setting up Appwrite

1. Creating a new Project on Appwrite Cloud
2. Adding a new Flutter App under Add a platform
3. Initializing flutter app with project Id and endpoint

4. Adding Standard Authentication

1. Creating a appwrite_config.dart file and creating a Class with client as a static variable to provide easy access.
2. Basic UI of signup and login pages
3. Creating first user through flutter app and creating an email session with password

5. Verification and Recovery

1. Verification

   • Explaining why verification is important
   • Creating a button to trigger .createVerification()

2. Recovery

   • Adding Page for Account recovery
   • Sending password recovery email with .createRecovery()
   • Completing password recovery with .updateRecovery()

6. Conditional Routing

1. This can be done with using shared preferences with storing the user logged in info in the local storage
   • Creating different routes and as soon as app launches, redirect the route depending upon the shared preferences

A basic Example of how Routing will be done

graph TD
    A[App launches] --> B(Checking shared prefs)
    B --> C{No user}
    B --> D{User present}
    C --> E[Route to Auth screen]
    D --> F[Route to Home Screen]
    D --> G{User logouts}
    G --> E   

Loading

7. Preferences and Delete Account

1. Preferences

   • Getting the prefs as a key value object
   • Updating the prefs (can be optional | opinion required)

2. Delete can have different options (What all things need to be implemented?)

   • Deleting an user by its unique ID
   • Deleting the current session
   • Deleting all the sessions.

[Rohit-RA-2020]

Hey @gewenyu99 I have started working based on this outline. Please let me know what things need to change.

Also, Do I need to use a state management package like Provider or Riverpod? and I need some help with things that I need to implement with Prefs and deleting

[Rohit-RA-2020]

Also, this Tutorial will be based upon email signup/login or other Auths like Phone Auth and Magic URL, Because OAuth has a different section 🤔

[gewenyu99]

Hi, I decided to do an example project so we can be consistent. Please follow the outline and format here:
#89

[Rohit-RA-2020]

Sure, will do so

[PratyushChauhan]

Is anyone still working on this?

[Rohit-RA-2020]

Is anyone still working on this?

Yes, I'm

[gewenyu99]

👀 Excited to see this tutorial :D

[Rohit-RA-2020]

#275

[tessamero]

@Rohit-RA-2020 can you update the open PR? We'd like to merge it soon and be able to send you the appwrite swag :)

[Rohit-RA-2020]

@Rohit-RA-2020 can you update the open PR? We'd like to merge it soon and be able to send you the appwrite swag :)

I have made few changes and waiting for review 👍🏼

[tessamero]

@Rohit-RA-2020 awesome :)