DEV Community

Discussion on: ▲🔥 Getting started with Next.js, ZEIT Now, and Firebase

Collapse
 
iljapanic profile image
Ilja Panic

Thank you for sharing such a wonderful tutorial!

It took me only a single afternoon to build a functioning dashboard for managing a volunteer delivery service using your detailed guide.

I know this is out of the scope of your post, but would you be able to point me in the right direction or share resources for achieving following:

  1. Make the Firebase collection (spaces) sortable on change. I'm using Firebase's orderBy but that only sorts on the initial load, so I have to refresh the page to sort changes. I suppose I would have to extrapolate the Firebase data into a React state and sort/display that. Unfortunately, I'm not fully comprehending how you retrieve the collection and storing it into items because it's compounded with other variables using some sort of shorthand. So I guess my question is how to get the Firebase data into a component state?
  2. How to dynamically paginate the collection items? That is automatically split the firebase calls and dynamically generate pages based on the total number of records and desired items-per-page.

I understand it's a lot to ask, but I'm sure any hints would help out many people in the future as well.

Thanks again for a great tutorial!

Collapse
 
benzguo profile image
bg • Edited

Yay, glad it was useful!

This example uses firestore-pagination-hook, which was useful for viewing a firestore collection quickly for this example. I'm not sure how well it scales to more complex use cases.

There are some other React + Firebase libraries out there, which I haven't tried, but you may want to check out as alternatives. This one looks popular: github.com/CSFrequency/react-fireb...

Collapse
 
iljapanic profile image
Ilja Panic

Thank you for sharing additional references. I will look through them and see where they take me.