mirror of
https://github.com/vercel/commerce.git
synced 2025-07-15 17:01:22 +00:00
56 lines
2.0 KiB
Markdown
56 lines
2.0 KiB
Markdown
# [Spree Commerce][1] Framework
|
|
|
|
A preview integration of Spree Commerce within NextJS Commerce. It supports browsing and searching Spree products and adding products to the cart as a guest user.
|
|
|
|
## Installation
|
|
|
|
Start by following the [instructions for setting up NextJS Commerce][2].
|
|
|
|
Next, setup Spree. The easiest way to run Spree locally is to follow the installation tutorial available at [the Spree Starter GitHub repository][3].
|
|
|
|
You have to adjust Spree Starter to allow `localhost` and [CORS][4] requests. Run `docker-compose run web bundle add rack-cors` and:
|
|
|
|
```ruby
|
|
# In config/application.rb add a configuration for CORS:
|
|
|
|
module SpreeStarter
|
|
class Application < Rails::Application
|
|
config.middleware.insert_before 0, Rack::Cors do
|
|
allow do
|
|
origins '*'
|
|
resource '*', headers: :any, methods: :any
|
|
end
|
|
end
|
|
end
|
|
end
|
|
|
|
# In config/environments/development.rb add 'localhost':
|
|
|
|
config.hosts << 'localhost'
|
|
```
|
|
|
|
By default, Spree Starter and NextJS Commerce both run on port `3000`. Avoid collisions by running NextJS Commerce on port `4000`:
|
|
|
|
```json
|
|
// In package.json, modify two scripts:
|
|
{
|
|
"scripts": {
|
|
"dev": "NODE_OPTIONS='--inspect' next dev -p 4000",
|
|
"start": "next start -p 4000",
|
|
...
|
|
}
|
|
...
|
|
}
|
|
```
|
|
|
|
Third, supply NextJS Commerce with custom environment variables required by the Spree Framework. Create a `.env.local` file in the root of NJC with contents based on `framework/spree/.env.template`.
|
|
|
|
`NEXT_PUBLIC_SPREE_CATEGORIES_TAXONOMY_ID` and `NEXT_PUBLIC_SPREE_BRANDS_TAXONOMY_ID` rely on IDs generated by Spree. Go to the Spree admin panel and create Categories and Brands taxonomies if they don't exist and copy their IDs into `.env.local`. The values of the other environment variables can be copied from `framework/spree/.env.template` as is.
|
|
|
|
Lastly, run `yarn dev` :tada:
|
|
|
|
[1]: https://spreecommerce.org/
|
|
[2]: https://github.com/vercel/commerce
|
|
[3]: https://github.com/spree/spree_starter
|
|
[4]: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
|