firebaseextended/karas-coffee

Firebase Extensions Demo

A demo ecommerce application showcasing Firebase Extensions and other Firebase products.

To learn more about this project see the documentation or the video below:

---

Project structure

• /website
  • Source for the React web application.
• /functions
  • Source for Firebase Cloud Functions used by this project.
• /tools
  • Scripts/tools such as Stripe product importing and Cloud Firestore rules.

---

Local development

yarn

Running locally

yarn dev

Deploying to Firebase Hosting

yarn deploy

Importing product data into Stripe

cd tools
yarn stripe:import-products

Note: this script requires you create a tools/.env file with your STRIPE_SECRET_KEY set in it.

Deploy Firestore rules

cd tools
yarn firebase:deploy-firestore-rules

---

Technologies Used

• ️‍🔥  Firebase
  • 🔑  Firebase Authentication
  • 📄  Cloud Firestore
  • 🌍  Firebase Hosting
  • 🧩  Firebase Extensions
    • See the docs to learn about the Firebase Extensions used in this project.
• 💳  Stripe Checkout
  • Checkout creates a secure, Stripe-hosted payment page that lets you collect payments quickly.
• 📦  ShipEngine
  • ShipEngine’s APIs help brands, ecommerce platforms, 3PLs and others save time and money on shipping.
• 🔍  Algolia Search
  • Enables developers to build next generation apps with composable APIs.
• ⚛️  React
  • A JavaScript library for building user interfaces.
• ⚡️  Vite
  • Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects.

karas-coffee's Issues

Add extensions to firebase.json

To make it easier to deploy this project, consider adding all installed extensions to firebase.json. This would allow all extensions to be deployed/configured at once on a test project.

"Reuse a project's Extensions configuration" docs

Dragon

[docs]: Improve the "local development" instructions

It would be helpful for newcomers to have a bit more description and guidance in the form of a step-by-step set of instructions to getting this project up and running. Something akin to:

1. Clone the repo: git clone https://github.com/FirebaseExtended/karas-coffee
2. Go to the project directory: cd karas-coffee
3. Start the local development system: yarn dev << this starts the app in the "website" directory
4. . . .

What isn't currently clear, especially for newcomers, is the distinction between "local dev" and "deploy hosting" and "importing data into Stripe", etc. Unless the audience is experienced with all of these techs (React, Stripe, Firebase Hosting, Firebase Auth, etc...), there is little chance they'll know what to do.

Even as someone experienced with all of these techs, I personally find myself looking through package.json files and hunting around for "firebaseConfig" in the code to figure out what is actually happening.

Some very light-weight guidance such as above would go a long way to making this project more accessible to developers of varying levels of experience.

List all extensions used in README

Can we list all the extensions used with links to the extension detail pages in the README?