Connect with us

iOS App Development

How To Build a Login Page with Swift & Firebase

In this Tutorial you will learn How To Build a Sign Up & Login page with Swift & Firebase.

So for this Tutorial we are going to be using the Firebase Authentication Pod, which allows developers to Authenticate users easily and securely. You need to jump into your Firebase Console and enable the Sign-In method to login with our app. In the Firebase Console, go to the Authentication tab and enable the Email/Password provider and hit Save.

Create a new Xcode project and add the Firebase SDK, our Tutorial will show you how. Make sure you add the Authentication Pod to you pod file, which authenticate users and allow them to login.

In Xcode you want to create a layout for the Login & Sign up page, I added a Segmented Control , two Text Fields, for the email and password, and also a Button. You also want to Create Outlets for all of these elements to your swift file and also a Action for your Button.

@IBOutlet weak var seg: UISegmentedControl!
@IBOutlet weak var email: UITextField!
@IBOutlet weak var pass: UITextField!
@IBOutlet weak var btn: UIButton!
    
@IBAction func btn_clicked(_ sender: Any) {
        
}

We want to import the Firebase SDK into our swift file. Use import FirebaseAuth to do this.  So you want to create two functions one to login and one signup, in each of these functions will go the code to login a user and also create a user.

The login function will check to see if the text fields is empty, if it is a message will be printed, otherwise if the error is equal to nil it will try to login with the email and password, if it fails it will print an error message.

func login(){
        
        if self.email.text == "" || self.pass.text == "" {
            
          print("Please Enter Some Text")
            
        } else {
            
            Auth.auth().signIn(withEmail: self.email.text!, password: self.pass.text!) { (user, error) in
                
                if error == nil {

                   print("You have successfully logged in")
              
                    
                } else {
    
                    print("Error")
                }
            }
        }
        
    }

The Sign-Up function will check to see if the email field is empty if it is a error message will be printed, otherwise if there is no error the method will create a user with the email and password text field.

 func signUp(){
        
        if email.text == "" {
            
            print("Error")
            
        } else {
            Auth.auth().createUser(withEmail: email.text!, password: pass.text!) { (user, error) in
                
                if error == nil {
                    print("You have successfully signed up")
                } else {
                    print(error)
                }
            }
        }
        
    }

In the action for your button you want to call your Login and Sign-Up functions. You want to use the Segmented Control to control weather the user is logging in or registering, use the index to do this.

 @IBAction func btn_clicked(_ sender: Any) {
        
        if seg.selectedSegmentIndex == 0 {
            
            login()
            
        } else if seg.selectedSegmentIndex == 1 {
            
            signUp()
            
        }
        
    }

Click Build & Run and your Login and Sign-Up page should be working. You will first have to register a user, if you want to check if everything works correctly.

Enter a email and password, select “Register” in your segmented control and it should register the user to the Firebase account connected.

So if you try to login with your user details and everything should work perfectly.

If you came across any error feel free to leave a comment and we will get back to you.

Continue Reading
Advertisement //pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (adsbygoogle = window.adsbygoogle || []).push({});
Click to comment

Leave a Reply

Your email address will not be published. Required fields are marked *

iOS App Development

How to Setup Firebase SDK for Xcode using Cocoapods

This Tutorial will show you How to Setup Firebase SDK for Xcode using Cocoapods.

Firebase offers functionality like analytics, databases, messaging and crash reporting  and much more, Its used by loads of Development teams around the world—including NPR, Shazam, Duolingo, and Venmo.

First create a project in the console and then click Add project, then give it a name.

Click Add Firebase to your iOS app and follow the setup steps. You will need to enter the Bundle ID for your app and a name you also have the option of entering a App Store id. It’s important to enter the bundle ID your Xcode app is using; this can only be set when you add an app to your Firebase project.

At the end, you’ll download a GoogleService-Info.plist  file which you will need to add to your Xcode project. Make sure the file is included in your app’s build target. You need to install the SDK. You may have already completed this as part of creating a Firebase project.

We recommend using CocoaPods to install the libraries. You can install Cocoapods by following these instructions. After you have installed CocoaPods you will need to add the pods for the libraries that you want to use.

Open Terminal and direct yourself to your Xcode project, here we want to create a Podfile. 

 cd your-project directory
 pod init

You then need to add the Pods you want to use.

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'FirebaseSocialNetwork' do
  # Comment the next line if you're not using Swift and don't want to use dynamic frameworks
  use_frameworks!

  # Pods for FirebaseSocialNetwork

   pod 'Firebase/Core’

  target 'FirebaseSocialNetworkTests' do
    inherit! :search_paths
    # Pods for testing
  end

  target 'FirebaseSocialNetworkUITests' do
    inherit! :search_paths
    # Pods for testing
  end

end

This will add the libraries needed to get up and running, along with Google Analytics for Firebase. Jump back into Terminal and install the Pod file.

 pod install

Direct yourself to the Project Folder and open the “.workspace” project file, make sure you use the .workspace file from now on.

The final step is to initialise Firebase in your application. Import the Firebase module in your UIApplicationDelegate. In the didFinishLaunchingWithOptions method configure Firebase.

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
        // Override point for customization after application launch.
         FirebaseApp.configure()
        return true
}

Hit Build and Run and your Project should be running with no errors. If you had any problems or came across some errors hit us up on out social networks or leave a comment.

Continue Reading

Copyright © 2019 TheGadgetBook | Tutorials , Tech & Much More.