### Repository

https://github.com/enyason/Syde

### History

- [Implementing Syde(An online Forum) in Flutter](https://steemit.com/utopian-io/@ideba/implementing-sydean-online-forum-in-flutter)

### New Features

- **Authenticate User**

  A platform such as this should be able to identify it's users. To achieve this, I implemented Google sign in.

 <center> ![Screenshot_authentication.png](https://cdn.steemitimages.com/DQmYKhXbaXkVLp3LnoWbxWdgdHaMSrGquRWjtoNyunSWReR/Screenshot_authentication.png)</center>

  #### *Implementation*

  Implementing the authentication was a bit straight forward with the flutter plug-in. To make things modular I used the bloc pattern to handle click events from the user and then respond to the click event by calling the sign in method on an abstract class I created. This abstract class handles everything concerning authentication.

  

  - The code block below is the auth bloc where we listen for data on the stream and react accordingly

  ```
  class AuthBloc {
    final BaseAuth baseAuth;
    
    //stream controller to handle streams
    StreamController<ClickEvents> _controller = StreamController<ClickEvents>();
  
    AuthBloc(this.baseAuth) {
    
    //listen for data on the stream
      _inputStream().listen((event) {
        if (event is ClickEvents) {
          baseAuth.signInWithCredentials(baseAuth.getFireBAseAuth());
        }
      });
    }
  
  //create a stream 
    Stream<ClickEvents> _inputStream() {
      return _controller.stream;
    }
  
  //create a sink- with a sink, data can be added unto the stream
    Sink<ClickEvents> get eventSink => _controller.sink;
  
  //close the stream
    void dispose() {
      _controller.close();
    }
  }
  
  abstract class ClickEvents {}
  
  class LogInClick extends ClickEvents {}
  
  //make a global instance of AuthBloc
  final authBloc = AuthBloc(Auth());
  ```

  

  - The code snippet below shows abstract methods used for implementing the authentication. for full details check [source code](https://github.com/enyason/Syde/blob/master/lib/Auth/auth.dart) 

  ```
  abstract class BaseAuth {
    FirebaseAuth getFireBAseAuth();
  
    GoogleSignIn getGoogleLogin();
  
    Future<FacebookLoginResult> initFaceBookLogIn(
        FacebookLogin fbLogIn, List<String> permission);
  
    Future<GoogleSignInAuthentication> getGoogleSignInAuth();
  
    AuthCredential getAuthCredential(GoogleSignInAuthentication auth);
  
    Future<void> logUserOut(FirebaseAuth mAuth);
  
    Future<void> storeUser(FirebaseUser user);
  
    Future<FirebaseUser> signInWithCredentials(FirebaseAuth mAuth);
  }
  ```

  

  - The code block stores user's details to fire-store if user details do not exist

  ```
  Future<void> storeUser(FirebaseUser user) async {
      if (user != null) {
        // Check is already sign up
        final QuerySnapshot result = await Firestore.instance
            .collection('users')
            .where('id', isEqualTo: user.uid)
            .getDocuments();
        final List<DocumentSnapshot> documents = result.documents;
        
        documents.forEach((val) {
          print("Data = ${val.data}");
        });
        
        if (documents.length == 0) {
          // Update data to server if new user
          Firestore.instance.collection('users').document(user.uid).setData({
            'name': user.displayName,
            'photoUrl': user.photoUrl,
            'id': user.uid,
            'created': DateTime.now().millisecondsSinceEpoch.toString()
          });
        }
  
  
      }
    }
  ```

  - From the Login Screen, all we need is a line of code in the `onTap` function to begin authenticating a user

  ```
   onTap: () {
          authBloc.eventSink.add(LogInClick());
        }
  ```


### Technology Stack

- [Android Studio](https://developer.android.com/studio/index.html)
- [Flutter](https://flutter.dev): Flutter is google mobile framework for building beautiful cross-platform apps
- [FireBase](https://firebase.google.com): Firebase will provide us with online backend functionality such database, cloud functions, authentication, real-time functionalities etc
- [SQFlite](https://pub.dartlang.org/packages/sqflite) : this is flutter version of SQLite. This will enable local storage on the phone
- [RxDart](https://pub.dartlang.org/packages/rxdart) : RxDart is used for reactive programming
- BLOc pattern is used as the architectural pattern for layering the app.



### IMPORTANT RESOURCES

*Github *: https://github.com/enyason/Syde



### Roadmap

The screenshots above show the current state of the application. I will work towards implementing all the features as described above. More attention would be given to the layouts and presentation of the app, to improve the user's experience. Some of the updates to expect are:

-  ~~Authenticate User~~
- Persisting user post
- Searching all posts
- Providing different layouts
- ToDo for users to track their daily progress
- Push Notifications
- Posts sharing
- Users dashboard
- Searching all users
- Direct Messaging with Users
- ChatGroup
- Bookmarking post


***Demo Video***
https://youtu.be/KR4w4k0JHSU


***Github*** - https://github.com/enyason/Syde

### How to contribute?

You can reach me by commenting on this post or send a message via enyasonjnr@gmail.com.If you want to make this application better, you can make a Pull Request. [Github](https://github.com/enyason/Syde)