Code Monkey home page Code Monkey logo

loginkit's Introduction

LoginKit

Version License Platform

About

LoginKit is a quick and easy way to add Facebook and email Login/Signup UI to your app. If you need to quickly prototype an app, create an MVP or finish an app for a hackathon, LoginKit can help you by letting you focus on what makes your app special and leave login/signup to LoginKit. But if what you really want is a really specific and customized login/singup flow you are probably better off creating it on your own.

LoginKit handles Signup & Login, via Facebook & Email. It takes care of the UI, the forms, validation, and Facebook SDK access. All you need to do is start LoginKit, and then make the necessary calls to your own backend API to login or signup.

This is a simple example of how your login can look. Check out the example project to see how this was done and tinker around with it.

This other example is LoginKit in use in one of our client apps.

Requirements

Installation

LoginKit is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "ILLoginKit"

Getting Started

Login Coordinator

Everything is handled through the LoginCoordinator class. You insantiate it and pass the root view controller which is the UIViewController from which the LoginKit process will be started (presented) on. This will usually be self.

import LoginKit

class ViewController: UIViewController { 

    lazy var loginCoordinator: LoginCoordinator = {
        return LoginCoordinator(rootViewController: self)
    }()
    
    ...

    func showLogin() {
        loginCoordinator.start()
    }
    
    ...

}

Afterwards call start on the coordinator. That's it!

Customization

Of course you will want to customize the Login Coordinator to be able to supply your own UI personalization, and to perform the necessary actions on login or signup.

That is done by subclassing the LoginCoordinator class.

class LoginCoordinator: ILLoginKit.LoginCoordinator {

}

Start

Handle anything you want to happen when LoginKit starts. Make sure to call super.

override func start() {
    super.start()
    configureAppearance()
}

Configuration

You can set any of these properties on the superclass to change the way LoginKit looks. Besides the images, all other properties have defaults, no need to set them if you don't need them.

Property Effect
backgroundImage The background image that will be used in all ViewController's.
mainLogoImage A logo image that will be used in the initial ViewController.
secondaryLogoImage A smaller logo image that will be used on all ViewController's except the initial one.
tintColor The tint color for the button text and background color.
errorTintColor The tint color for error texts.
loginButtonText The text for the login button.
signupButtonText The text for the signup button.
facebookButtonText The text for the facebook button.
forgotPasswordButtonText The text for the forgot password button.
recoverPasswordButtonText The text for the recover password button.
namePlaceholder The placeholder that will be used in the name text field.
emailPlaceholder The placeholder that will be used in the email text field.
passwordPlaceholder The placeholder that will be used in the password text field.
repeatPasswordPlaceholder The placeholder that will be used in the repeat password text field.
// Customize LoginKit. All properties have defaults, only set the ones you want.
func configureAppearance() {
    // Customize the look with background & logo images
    backgroundImage = 
    mainLogoImage =
    secondaryLogoImage =

    // Change colors
    tintColor = UIColor(red: 52.0/255.0, green: 152.0/255.0, blue: 219.0/255.0, alpha: 1)
    errorTintColor = UIColor(red: 253.0/255.0, green: 227.0/255.0, blue: 167.0/255.0, alpha: 1)

    // Change placeholder & button texts, useful for different marketing style or language.
    loginButtonText = "Sign In"
    signupButtonText = "Create Account"
    facebookButtonText = "Login with Facebook"
    forgotPasswordButtonText = "Forgot password?"
    recoverPasswordButtonText = "Recover"
    namePlaceholder = "Name"
    emailPlaceholder = "E-Mail"
    passwordPlaceholder = "Password!"
    repeatPasswordPlaceholder = "Confirm password!"
}

Completion Callbacks

Override these other 4 callback methods to handle what happens after the user tries to login, signup, recover password or enter with facebook.

Here you would call your own API.

// Handle login via your API
override func login(email: String, password: String) {
    print("Login with: email =\(email) password = \(password)")
}

// Handle signup via your API
override func signup(name: String, email: String, password: String) {
    print("Signup with: name = \(name) email =\(email) password = \(password)")
}

// Handle Facebook login/signup via your API
override func enterWithFacebook(profile: FacebookProfile) {
    print("Login/Signup via Facebook with: FB profile =\(profile)")
}

// Handle password recovery via your API
override func recoverPassword(email: String) {
    print("Recover password with: email =\(email)")
}

Finish

After successfull login call the finish() method on LoginCoordinator. Be sure to call super.

override func finish() {
    super.finish()
}

Code

The final result would look something like this.

import Foundation
import ILLoginKit

class LoginCoordinator: ILLoginKit.LoginCoordinator {

    // MARK: - LoginCoordinator

    override func start() {
        super.start()
        configureAppearance()
    }

    override func finish() {
        super.finish()
    }

    // MARK: - Setup

    // Customize LoginKit. All properties have defaults, only set the ones you want.
    func configureAppearance() {
        // Customize the look with background & logo images
        backgroundImage = #imageLiteral(resourceName: "Background")
        // mainLogoImage =
        // secondaryLogoImage =

        // Change colors
        tintColor = UIColor(red: 52.0/255.0, green: 152.0/255.0, blue: 219.0/255.0, alpha: 1)
        errorTintColor = UIColor(red: 253.0/255.0, green: 227.0/255.0, blue: 167.0/255.0, alpha: 1)

        // Change placeholder & button texts, useful for different marketing style or language.
        loginButtonText = "Sign In"
        signupButtonText = "Create Account"
        facebookButtonText = "Login with Facebook"
        forgotPasswordButtonText = "Forgot password?"
        recoverPasswordButtonText = "Recover"
        namePlaceholder = "Name"
        emailPlaceholder = "E-Mail"
        passwordPlaceholder = "Password!"
        repeatPasswordPlaceholder = "Confirm password!"
    }

    // MARK: - Completion Callbacks

    // Handle login via your API
    override func login(email: String, password: String) {
        print("Login with: email =\(email) password = \(password)")
    }
    
    // Handle signup via your API
    override func signup(name: String, email: String, password: String) {
        print("Signup with: name = \(name) email =\(email) password = \(password)")
    }

    // Handle Facebook login/signup via your API
    override func enterWithFacebook(profile: FacebookProfile) {
        print("Login/Signup via Facebook with: FB profile =\(profile)")
    }

    // Handle password recovery via your API
    override func recoverPassword(email: String) {
        print("Recover password with: email =\(email)")
    }

}

Author

Daniel Lozano, [email protected]

License

LoginKit is available under the MIT license. See the LICENSE file for more info.

loginkit's People

Contributors

danlozano avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.