Closed mbifulco closed 3 years ago
Update - I should have the design implemented for this by the end of the weekend. There'll be some loose ends that still need to be tied up, but we should be in a semi-releasable state soon!
A few notes on this work:
https://rebuildblackbusiness.com/mikes-candy-shop
where the ending slug is unique. @elchris it would be super helpful if this were a unique field stored in the database somewhere. Keeping IDs out of the URL is a best practice for SEO as well, per moz.
I'm about to push a big ol' stack of changes to this PR. It's taking shape nicely, but there's a bunch of data on the Profile page in Figma that we don't have yet. That stuff is stubbed out here:
😅 I'm putting this down for the day... it's been a long sunday!
store
, globe
, phone
, share-alt
, flag
, share-square
- update: font-awesome isn't referenced in the project yet. I'm going to let this be for now.'
Looking good! A couple small design detail tweaks/feedback
Allllright - I just pushed a mess of additional changes which address some of the todo items above. I think I'm still missing a bit of metadata from the API that may be needed to complete the page. This includes links to facebook/instagram/twitter/linkedin for businesses (yelp is present currently, from what I can see). I'm also not sure what the share profile
CTA button at the bottom of the page should do 🤔
Ah hey I also removed yarn.lock to fix #330
Shoot one more thing - I added react-query
as a dependency to the project to handle API fetching / caching / etc for individual business pages. It works like a dream and allows us to have a custom hook to make things work. Because of that, you'll also see devtools for react-query when running the project locally (but not when it is built for production). That looks like this:
and can be opened by clicking the little icon that sticks to the lower-left corner of the browser window:
This is now hooked up to a search endpoint for airtable Ids, so the data for each page should be fully connected - check it out on the deploy preview: https://deploy-preview-320--rebuild-black-business.netlify.app/business/ashes-the-cigar-lounge!-rec4mmetqTsWYEAsE
Desktop looks great, nice work!
Noticed a couple misalignments on the mobile preview, I also noticed that the category image takes a good amount of time to load, aren't they static assets?
i'm still seeing bad calls to the API on:
/api/v1/businesses/airtable/null
Good catch @elchris - making that change now.
Good catch @elchris - making that change now.
... it's still passing null to the endpoint instead of the airtable record id :(
We're bumping into some problems getting the site to talk to the new API route - @elchris is on the case 👍
Ok - we pushed an update to both this PR and the API (both staging and production). That should do the trick.
Describe your PR
This PR adds a URL for each individual business sourced from Airtable. As of right now, there's not much content on those pages (just some SEO stuff, and a title) - but the pages exist! Design implementation comes next.
I'm opening this PR to get some feedback (please read below!)
Fixes #268
Pages/Interfaces that will change
lots of new URLs!
Screenshots / video of changes
Steps to test
/business/1946d007-3c76-5c4d-ac23-10e47bf759a5
TODO
/utils/business.js
which should be modified to generate a slug for each business (and should have a strategy for duplicate slugs)