Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feature: Next.js e-commerce template #292

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Conversation

emwp
Copy link
Contributor

@emwp emwp commented Jan 14, 2025

Add Next.js E-commerce Template

Description

This PR adds a new nextjs/firebase-ecommerce template to demonstrate building a full-featured e-commerce application using Next.js and Firebase services. This template showcases real-world implementation patterns and Firebase integration best practices.

Key Features

  • Product catalog with dynamic routing and ISR for optimal performance
  • Shopping cart functionality
  • User authentication
  • Secure checkout process with Stripe
  • Responsive design with Tailwind CSS
  • TypeScript implementation

Firebase Services Utilized

  • Firebase Authentication
  • Firebase Data Connect
  • Cloud Storage (for product images)
  • Deployment to Firebase App Hosting

Implementation Details:

The template follows the same structure as our existing basic Next.js starter (referenced in starters/nextjs/basic) but adds e-commerce specific features and Firebase service integrations. It maintains compatibility with Firebase App Hosting's configuration-free deployment process.

Testing

  • Verified e-commerce flows locally
  • Tested deployment to Firebase App Hosting
  • Tested with the two latest Node.js versions (20, 22)

Comment on lines +31 to +32
# vercel
.vercel
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
# vercel
.vercel

}
}

query GetOrdersByCustomerId($customerId: String!) @auth(level: PUBLIC) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we lock this down by auth.id? Same with getorder

)
}

mutation CreateOrder(
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

create and update order need to be authenticated

@@ -0,0 +1,114 @@
mutation UpsertCustomer(
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

auth plz

const cookieStore = await cookies()
const session = cookieStore.get('__session')?.value

if (session) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we should do real auth here, you can see the latest on how to accomplish this in nextjs in the updates I made to our codelab https://github.com/firebase/friendlyeats-web/blob/bffaeae7647f7ea61b4a369a9567881cb8183e8c/nextjs-end/src/components/Header.jsx#L12

Copy link
Collaborator

@jamesdaniels jamesdaniels left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My main feedback here is that we actually need to do real authn/z as people will actually go to production with our starter templates.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants