Firebase

Swift:超簡単!リアルタイムチャットができるFirebaseを試してみた。(超簡単編)


今回は、Firebaseを試してみたので
そのメモです。

今回の目標はこれです!
f:id:jumprails3303:20161124003903p:plain

こちらの記事を参考に作りました!!ありがとうございます!

crossbridge-lab.hatenablog.com

Firebaseとは??

mbaasの一種です。
Google様のサービスです。
リアルタイムチャットができます。
かっこいいです。

さてさて、やってみよう!

まずはプロジェクトを立ち上げます。

プロジェクトネームは『FireApp』にします。なんとなくです。
f:id:jumprails3303:20161123232919p:plain

そして、Firebaseに登録し、
f:id:jumprails3303:20161123233124p:plain

プロジェクトを作成しましょう。名前は『FireApp』にします。

作成したら、

f:id:jumprails3303:20161123233320p:plain
のボタンを押してください。

次にこのような画面が出てくると思います。
f:id:jumprails3303:20161123233648p:plain
ここのIOSバンドルIDには
f:id:jumprails3303:20161123233741p:plain
このbundle identifierを入力します。

その次はこのような画面が出てくると思います。
f:id:jumprails3303:20161123234019p:plain
そこで自動でダウンロードされる『GoogleServise-info.plist』xcodeプロジェクトに入れましょう。

そして、次はこのような画面が出てくると思います。
f:id:jumprails3303:20161123234307p:plain
ここに記述されている通り、ターミナルにて、
pod init
と入力してください。
すると
f:id:jumprails3303:20161123234558p:plain
『podfile』が作成されます。

このように編集してください、
target ‘FireApp’ do
# Comment this line if you’re not using Swift and don’t want to use dynamic frameworks
use_frameworks!
pod ‘Firebase/Core’
pod ‘Firebase’
pod ‘Firebase/Database’

# Pods for FireApp

end

以下の三行を付け足しました。
pod ‘Firebase/Core’
pod ‘Firebase’
pod ‘Firebase/Database’

そして、
ターミナルにて
pod install
と入力してください。

Firebaseに戻ります。
このような画面が出てくると思います。
f:id:jumprails3303:20161123235414p:plain
ここでは、『AppDelegate.swift』を編集するようです。
現在開いているxcodeプロジェクトを閉じてください、
そして、xcodeWorkSpaceを開いて、AppDelegate.swiftを編集しましょう。

import Firebase
FIRApp.configure()

この2行が足されるようです。場所は注意してください。

次にFirebaseの編集をします。
Databaseのルールをちょちょっといじります。
f:id:jumprails3303:20161124000107p:plain
データを書いたり、読んだりできるようにしました。下準備です。

さてとっ!
xcodeをいじって行きましょう!
StoryBoardを開いてください。
そして、このように配置してください。
f:id:jumprails3303:20161124004232p:plain
コードとも紐付けましょう!
名前はそれぞれ、
UITextView:textView
UITextField:messageField
UITextField:nameField

とします。

import UIKit


class ViewController: UIViewController{

    @IBOutlet weak var textView: UITextView!
    
    @IBOutlet weak var messageField: UITextField!
    
    @IBOutlet weak var nameField: UITextField!
    
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
    }
    
    
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

このようになって入れば成功です。

最終的なコードとしては、
このようになります。

import UIKit
import FirebaseCore
import Firebase
import FirebaseDatabase

class ViewController: UIViewController, UITextFieldDelegate {
    
    @IBOutlet weak var textView: UITextView!
    
    @IBOutlet weak var messageField: UITextField!
    
    @IBOutlet weak var nameField: UITextField!
    
    var databaseRef:FIRDatabaseReference!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        messageField.delegate = self
        
        databaseRef = FIRDatabase.database().reference()
        // databaseを呼んでる??
        
        databaseRef.observe(FIRDataEventType.childAdded, with: { snapshot in //セッティングしている。新しいデータが入ってくるのを見張ってる。もしも、新しいデータが入ってきた場合{}内の処理を実行する。
            if let name = (snapshot.value! as AnyObject).object(forKey: "name") as? String,
                let message = (snapshot.value! as AnyObject).object(forKey: "message") as? String {
                self.textView.text! = "\(self.textView.text!)\n\(name) : \(message)"
                
            }
        })
    }
    
    func textFieldShouldReturn(_ textField: UITextField) -> Bool{
        
        let messageData = ["name": nameField.text!, "message": messageField.text!]
        // firebaseにdictionary型を保存するためデータを作成!
        
        databaseRef.childByAutoId().setValue(messageData) // データを保存!
        
        textField.resignFirstResponder() //キーボードを閉じる
        messageField.text = "" //最終的にはtextFieldを空にする。
        
        return true
    }
    
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    
}

Firebaseのメソッドについて

コードの解説をします。

FIRDatabase.database().reference()

これはFirebaseを参照してます。
言い換えるとFirebaseを引っ張って来ています。

これからFirebaseを使ってうんたらかんたらしていくにあたって、
ちょっと来てもらう必要があるんです。

 

observe(FIRDataEventType.childAdded, with: { snapshot in}

『observe』つまり『観察』です。
これから『child』が、『add』されたときを『observe』する。
ということです。

ザッックリすぎるので、もう少し具体的にすると

『child』が『add』されたことを検知した場合{}内を実行する!
ということになります!

 

childByAutoId().setValue(messageData)

これは実際に『messageData』という変数を保存するメソッドです。

このメソッドが実行され、データが保存されると、

上記のobserve(FIRDataEventType.childAdded, with: { snapshot in}
が頑張ります。

textFieldShouldReturnについてはFirebaseは関係ないので
説明は割愛させていただきます。
こちらの記事をご覧いただければ幸いです。

swift3:⑥UITextFieldの使い方・・・Delegate(デリゲート)云々

 


ABOUT ME
ささお
3年目iOSエンジニア。 スタートアップで働いておりやす。 プログラミングスクールとエンジニアのキャリアを考えたい。 作ったアプリ - https://apps.apple.com/us/app/loverprofile/id1463563845?l=ja&ls=1