firebase realtime database data

app.js

import React, { Component } from 'react'
import firebase from 'firebase';

export default class List extends Component {
  constructor(props) {
    super(props);
    this.state = {
      loaded: false,
      data: {},
    };
  }

  componentDidMount() {
    firebase.database().ref('notes/').on('value', snapShot => {
      this.setState({ data: snapShot.val(), loaded: true })
    });
  }

  render() {
    return (
      <div>
        {this.state.loaded ? this.renderList() : null}
      </div>
    )
  }

  renderList = () => {
    const { data } = this.state;
    return (
      <div>
        {Object.keys(data).map((a, i) => {
          return (
            <div key={i}>
              <p key={`data${i}`}>{JSON.stringify(data[a])}</p>
            </div>
          )
        })}
      </div>
    );
  };
}