Converting Firebase app code to use Fetch API

Question

I'm working through the code in this repository React-powered Hacker News client and would like to modify this to use fetch instead of the Hacker News firebase API specific code that is currently used (as a learning exercise).

This is the code requiring the firebase/app and firebase/database. Before I spend a lot of time on this is it feasible for me (with only basic Javascript/React experience) to update this to use fetch instead of firebase proprietary code?

My understanding is that I could use fetch to retrieve the data i.e. something based on:

fetch('https://hacker-news.firebaseio.com/v0/')
  .then(response => {
    return response.json()
  })
  .then(data => {
    // Work with JSON data here
    console.log(data)
  })

  })

I'm not sure how I would emulate these kind of functions though as they as using firebase.database() code.

function storiesRef(path) {
  return api.child(path)
}

function itemRef(id) {
  return api.child('item/' + id)
}

function userRef(id) {
  return api.child('user/' + id)
}

function updatesRef() {
  return api.child('updates/items')

Answer 1

Assuming your data structure is the same, you should be able to access the data object in the same way; so for your itemRef function: return data.item[id];

function userRef(id) {
   return dataAPI.user[id];
}

var user = userRef('1234567890xxxx');

As long as you have data returned from your api request from the given endpoint you should be able to reason about it like any typical object.

var dataAPI = fetch('https://hacker-news.firebaseio.com/v0.json') // append .json at the end of the url to make a RESTful request
  .then(response => {
    return response.json()
  })
  .then(data => {
    // Work with JSON data here
    return data;
  }, error => {
    console.error('onRejected function called: ' + error.message);
  })


function storiesRef(path) {
  //return api.child(path)
  return dataAPI[path];
}

function itemRef(id) {
  //return api.child('item/' + id)
  return dataAPI.item[id];
}

function userRef(id) {
  //return api.child('user/' + id)
  return dataAPI.user[id];
}

function updatesRef() {
  //return api.child('updates/items')
  return dataAPI.updates.items;
}

Some other notes:

1. to query a Firebase DB url, append .json to the end of the url (see: firebase.google.com/docs/database/rest/start and firebase.google.com/docs/database/rest/retrieve-data).
2. the Firebase REST API requires token authentication (see: stackoverflow.com/questions/40520696/how-do-i-access-my-firebase-database-via-http-rest-api).
3. the Firebase REST API is intended to be used directly from the command line or server (at least for full CRUD operations).