[BUG] / [FEATURE] Convert "Business Profiles" to simple Single-Page App, Give-up SEO for Now, and Change URL Scheme to Reference API ID instead of AirTable ID

[elchris]

NOTE: This issue would replace #372 and #371
NOTE: All API URLs which I pasted below will not work without an ?apiKey= parameter appended to them. You can obtain your own API key instantly by visiting and registering at: https://api.rebuildblackbusiness.com and from there you can actually read the API doc from which you can explore the various API endpoints.

• The pre-generation of pages was done to promote SEO. But we never did quite get it to work properly as described in [BUG] Fix SEO on Business Profile Pages #372 -- So as of right now, we literally have no vested interest in SEO.

• The pre-generation of pages:

  • adds overhead in development and deployment because it takes a whole hour to statically generate every single page for over 13,000 businesses. In development, we have to operate against a different instance of the API which has a smaller data set. Doing this however results in not being able to fully test the experience, most especially "searches", because there literally is very little to nothing to search for.
  • is very likely to be the root of [BUG] Fix pre-generation of Business Profile pages for newly-added pages since manual generation #371 , which could potentially be fixed by adding some sort of hook whenever a new business gets added to AirTable

• the pre-generated pages are happening by loading data from AirTable and that’s going to continue to hurt us because it forces us to reference the AirTable ID in the urls instead of referencing a business’s actual API ID from the API database which is what the developer API does .

• In the end we need to remove our dependence on AirTable. It needs to remain at arm’s length.

What I propose:

• Convert the business profile to a full SPA loading ALL of its data from the API, not AirTable. The single page app should only interact with the API. It should not touch AirTable. As such, no more pre generation of pages will be needed.

• change the business profile url to be anchored against the integer API ID instead of the AirTable ID. Keep the "textual part" of the slugs the same: Here's what I mean by example:

  • Before: https://www.rebuildblackbusiness.com/business/cassy's-support-service-llc-recNXBoD6kZPC5kZf
    • Notice the "recNXBoD6kZPC5kZf" part, that's the identifier for the AirTable record. We need to get away from that.
    • The API is able to retrieve records by AirTable ID right now, but it's a "private" feature which I want to disable
    • This the API call for it: https://api.rbb-api.com/private/api/v1/businesses/airtable/recNXBoD6kZPC5kZf
  • After (This is what we want): https://www.rebuildblackbusiness.com/business/cassy's-support-service-llc-13499
    • Notice the "13499": that's the API ID: https://api.rbb-api.com/api/v1/businesses/13499

• Once the business profile url scheme has been updated, and the profile page works correctly for any ID, be sure to update links in the search results pages.

Benefits:

• get rid of issues [BUG] Fix pre-generation of Business Profile pages for newly-added pages since manual generation #371 and [BUG] Fix SEO on Business Profile Pages #372
• reduce our dependency on AirTable for customer-facing experiences, and instead stay architecturally coupled to the API
• reduce development and deployment overhead with a simpler architecture
• should allow us to move more easily to NextJS later, whereby all of the React logic built to render the Business Profile page in an SPA paradigm, gets invoked and run on-demand using NextJS's ability to dynamically render a React page on-demand. See [Feature] [Architecture] Migrate to NextJS for Dynamic On-Demand Page Generation #375 for a description of NextJS-based approach.
• actually make the Owners Portal possible to finish. Because I need to make it possible for an owner to create a new business which does not exist in airtable. I will be saving the business in the application with an API integer ID, and it will not exist in AirTable so it will not have an AirTable id, and as such there is currently no way to link to it using an API ID. And I thought about enhancing the sync from a one-way sync (AirTable toward API) to a two-way sync (add API to AirTable) and when you play various use cases scenarios, it becomes a hot mess. Once an an owner claims a business or adds their own listing, it becomes severed from AirTable, and that’s how it should be.

[Mhmdabed11]

I can work on this. So from what I understand, we need to make the individual business information page a client side route and fetch data dynamically.

[elchris]

I can work on this. So from what I understand, we need to make the individual business information page a client side route and fetch data dynamically.

Yesssss!