asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: added storefront regions guides (#7623)

Browse Source
This commit is contained in:
Shahed Nasser
2024-06-09 15:19:09 +02:00
committed by GitHub
parent 6946814944
commit 46c5c5fe28
10 changed files with 261 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/apps/book/app/storefront-development/page.mdx
+7 -1
View File
@@ -10,4 +10,10 @@ In the next chapters, you’ll learn about building a storefront for your Medusa
Storefronts are built separately from the Medusa application. They interact with the Medusa application through the Store API routes.
You're free to choose how to build your storefront. You can start with our Next.js starter storefront or build a storefront from scratch using your preferred framework or tech stack. Both of these approaches are explained in the next chapters.
You're free to choose how to build your storefront. You can start with our Next.js starter storefront or build a storefront from scratch using your preferred framework or tech stack.
<Note title="Tip">
To learn how to build a storefront from scratch, check out the [Storefront Development guides](!resources!/storefront-development) in the Learning Resources documentation.
</Note>
www/apps/book/app/storefront-development/tips/page.mdx
-63
View File
@@ -1,63 +0,0 @@
export const metadata = {
title: `${pageNumber} Storefront Development Tips`,
}
# {metadata.title}
In this chapter, you’ll find tips to help you build a storefront.
## Connect to the Medusa Application
<Note type="soon">
Support for Medusa v2 in Medusa React and the JS Client is coming soon.
</Note>
To send requests from the storefront to the Medusa application’s Store API Routes, you have three options:
- **For React-based storefronts**: use Medusa React. It provides you with the necessary hooks to retrieve or manipulate data from your Medusa application.
- **For JavaScript frameworks**: use Medusa’s JavaScript Client in any JavaScript framework. This NPM package facilitates interacting with the backend’s REST APIs.
- **For other frontend technologies**: interact directly with the Medusa application by sending requests to its [Store REST APIs](https://docs.medusajs.com/api/store).
---
## Configure CORS
The Medusa application’s API routes are guarded by a CORS middleware. Make sure to set the `storeCors` property of the `http` configuration in `medusa-config.js` to the storefront’s URL.
For example:
```js title="medusa-config.js"
module.exports = defineConfig({
projectConfig: {
http: {
storeCors: "http://localhost:3000",
// ...
}
}
// ...
})
```
---
## Use Publishable API Keys
Publishable API keys specify the scope of a request. Admin users create them, and they can only be used on the client-side, such as in a storefront.
Publishable API keys are associated with sales channels. Then, when the publishable API key is passed in the header of a request, the Medusa application automatically infers what sales channel is being used.
<Note>
Products, carts, and orders are associated with a sales channel. If you don’t specify a sales channel or a publishable API key, the products, carts, and orders are associated with the default sales channel.
</Note>
Publishable API keys are provided by the [API key commerce module](!resources!/commerce-modules/api-key).
---
## Implement Commerce Functionalities
Refer to the [Commerce Modules reference](!resources!/commerce-modules) for how-to guides on common commerce functionalities.