Passing Data From React Native App to Firebase

I have built a simple "ToDo" app with react native and I would like to connect it with Firebase. I tried to follow tutorials but can't figure out how to do it in my case. I set the Firebase rules (read, write) to true so authentication is not require. Could anybody help me and put me on the right track? Here is what I came up with so far. The current state is set as an example.

App.js file:

import Note from './app/components/Note';

import * as firebase from 'firebase';

const firebaseConfig = {
  apiKey: "XXXXXXXXXXXXXXXXXXXXXX",
  authDomain: "XXXXXXXXXXXXXXXXXXXXXXXXXX",
  databaseURL: "XXXXXXXXXXXXXXXXXXXXXXXXXXXX",
  projectId: "XXXXXXXXXXXXXXX",
  storageBucket: "XXXXXXXXXXXXXXXXXXXXXXXXX"
}

const firebaseApp = firebase.initializeApp(firebaseConfig);

export default class App extends React.Component {

  constructor(props) {
    super(props);

    this.noteRef = firebase.database().ref().child('note');

    this.state={
      noteArray: [{'date':'2/17/2012','note':'new'}]
    };

    this.note=[];
  }

  componentDidMount(){
    this.noteRef.on('child_added', (dataSnapshot)=>{
      this.note.push({id:dataSnapshot.key(), date: dataSnapshot.val(), note: dataSnapshot.val()});
    });
  }

  render() {
    let notes = this.state.noteArray.map((val, key)=>{
      return <Note key={key} keyval={key} val={val} deleteMethod={ ()=>this.deleteNote(key)}/>
    });
    return (
      <KeyboardAvoidingView behavior='padding' style={styles.container}>
        <View style={styles.header}>
          <Text style={styles.headerText}> Notekiip </Text>
        </View>

        <ScrollView style={styles.scrollContainer}>
          {notes}
        </ScrollView>

        <View style={styles.footer}>
          <TouchableOpacity onPress={this.addNote.bind(this)} style={styles.addButton}>
            <Text style={styles.addButtonText}>+</Text>
          </TouchableOpacity>

          <TextInput style={styles.textInput}
            onChangeText={(noteText)=> this.setState({noteText})} value={this.state.noteText}
            placeholder='Type note here' placeholderTextColor='white' underlineColorAndroid='transparent'>
          </TextInput>
        </View>

      </KeyboardAvoidingView>
    );
  }

  addNote() {
    if (this.state.noteText){
      var d = new Date();
      this.state.noteArray.push({date: d.getFullYear() + '/' + (d.getMonth() 
      + 1)  + '/' + d.getDate(), 'note': this.state.noteText});
      this.setState({noteArray: this.state.noteArray})
      this.setState({noteText: ''});
    }
  }

  deleteNote(key){
    this.state.noteArray.splice(key,1);
    this.setState({noteArray: this.state.noteArray});
  }
}

Note.js file:

export default class Note extends React.Component {
  render() {
    return (
      <View key={this.props.keyval} style={styles.note}>

        <Text style={styles.noteText}>{this.props.val.date}</Text>
        <Text style={styles.noteText}>{this.props.val.note}</Text>

        <TouchableOpacity onPress={this.props.deleteMethod} style={styles.noteDelete}>
          <Text style={styles.noteDeleteText}>D</Text>
        </TouchableOpacity>
      </View>
    );
  }
}