forked from crowetic/commerce
* Icky 161 folder and env setup (#1) * folder and env setup * codegen.json headers removed Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * Feature/icky 194 (#5) * folder and env setup * codegen.json headers removed * use-cart code flow updated * use-cart code flow updated * Implemented get-cart functionality * removed unused file * getAnonymousShopperToken function added * normalization mapping updated * PR points resolved * Anonymous shopper token query added * getAnonymousShopperToken function added * Anonymous shopper token query added Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * Icky 175 (#3) * folder and env setup * codegen.json headers removed * icky-175-get-site-info * PR comments resolved * update category Id Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * Icky-169-LogIn (#4) * Update README.md * Initial Commit * Commited Keys * GraphQL Changes * GraphQL Query * Final Changes * Changed login.ts * Made changes in login.ts * Final Changes * Refactored login.ts * SignUp Initial Checkin * logout Initial * Customer Account Initial Commit * Logout - deleted cookie * Reverted ReadMe and UserNav file * Final Changes * Resolved comments * Resolved comments 1 * Resolved comments 2 * Resolved comments 3 * Resolved comments 4 Co-authored-by: SushantJadhav <Sushant.Jadhav@kibocommerce.com> * ICKY-166-getProducts-and-getProduct (#6) * GetProduct Initial Commit * Passed productCode as Slug to get-product * Moved currencyCode in Config file * Icky 173 (#9) * Initial commit related to getAllPages * Initial Changes * Making documentListName configurable * fixing dynamic page rendering and adding typescript code Co-authored-by: amolnadagonde <amol.nadagonde@kibocommerce.com> Co-authored-by: kibo-sushant <sushant.jadhav@blueconchtech.com> * Feature/icky 176 (#8) * GetProduct Initial Commit * addItemToCart function implemneted * Add Item to cart functionality implemented * ICKY-166-getProducts-and-getProduct (#6) * GetProduct Initial Commit * Passed productCode as Slug to get-product * Moved currencyCode in Config file * Icky 173 (#9) * Initial commit related to getAllPages * Initial Changes * Making documentListName configurable * fixing dynamic page rendering and adding typescript code Co-authored-by: amolnadagonde <amol.nadagonde@kibocommerce.com> Co-authored-by: kibo-sushant <sushant.jadhav@blueconchtech.com> * addItemToCart function implemneted Conflicts resolved * Add Item to cart functionality implemented * booleans removed from query * cart size option enabled * updated addItem for with and without variants products Co-authored-by: kibo-sushant <sushant.jadhav@blueconchtech.com> Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> Co-authored-by: kibo-sushant <89385472+kibo-sushant@users.noreply.github.com> Co-authored-by: kibo-kevinwatts <85258296+kibo-kevinwatts@users.noreply.github.com> Co-authored-by: amolnadagonde <amol.nadagonde@kibocommerce.com> * Removed types from schema.d.ts (#11) * Final Changes (#16) * Icky 177 (#13) * addItemToCart function implemneted Conflicts resolved * Add Item to cart functionality implemented * remove Item from cart implemented * removed unused code Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * Icky 178 - Update Cart Quantity implemented (#14) * update cart quantity implemented * add item to cart bug fixed Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * Icky 182 (#12) * initial commit * useSearch hook * remove extra spaces * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * initial commit * useSearch hook * remove extra spaces * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * changes in product-search-vars * remove unwanted boolean * Feature/icky 179 (#17) * initial commit * useSearch hook * remove extra spaces * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * initial commit * useSearch hook * remove extra spaces * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * changes in product-search-vars * remove unwanted boolean * initial commit * updated Provider * usewishlist/getwishlist * changes in provider.ts * initial commit * useSearch hook * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * initial commit * useSearch hook * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * initial commit * usewishlist/getwishlist * updated Provider * changes in provider.ts * normalize wishlistitem * changes in get-customer-account * remove unwanted code * resolve empty wishlist case * resolve pr comments Co-authored-by: kibo-sushant <sushant.jadhav@blueconchtech.com> * token encoding and decoding fixed (#19) Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * Feature/icky- 180 & 181 (#20) * initial commit * useSearch hook * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * initial commit * useSearch hook * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * usewishlist/getwishlist * changes in provider.ts * changes in get-customer-account * initial commit * useSearch hook * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * initial commit * useSearch hook * revert pages and component changes * remove extra spacing in search.tsx * changes in catalog/products and product-search-vars * usewishlist/getwishlist * changes in provider.ts * remove unwanted code * initial commit * resolve pr comments * changes in add-item * remove wishlist fragment * remove item from wishlist * changes in normalize.ts * changes in additemtowishlist mutation * resove pr comments * Feature/icky 291 (#22) * Kibo API authentication helper handling oauth token generation / refresh and making auth ticket available to process via next server runtime config * Update .env template with placeholder for Kibo Auth Url * resolve ICKY-275 (#24) * Fix/icky 276 (#21) * remove Item from cart implemented * update cart quantity implemented * removed unused code * ICKY 176 and 263 implemented * ICKY 263 removed * PR points resolved Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> * ICKY-263 (#23) * ICKY-263 * resolve pr comments * resolve pr comments for customer typescript * docs: update kibo commerce readme with env details (#26) * resolve icky-264 (#25) * chore: remove extra field from .env.template * chore: remove extra .vscode launch json file * chore: cleanup test message from kibocommerce fork * chore(docs): remove extra field from .env template and .env related docs * chore: remove test data json file * chore: delete yarn.lock * refactor: remove unused fetch from kibo config, remove unused CommerceProvider * refactor: rename queries and util modules for consistency * chore: add checkout related api noop handlers and hooks * chore: revert modified core files * chore(config): add kibo production sandbox cdn to image domains config * fix: page normalizer and query for static pages * chore: remove commented code and unnecessary imports * fix(module paths): switch framework alias for relative path Co-authored-by: kibo-chandradeeptalaha <89371824+kibo-chandradeeptalaha@users.noreply.github.com> Co-authored-by: Chandradeepta <43542673+Chandradeepta@users.noreply.github.com> Co-authored-by: kibo-geetanshuchhabra <89399259+kibo-geetanshuchhabra@users.noreply.github.com> Co-authored-by: kibo-sushant <89385472+kibo-sushant@users.noreply.github.com> Co-authored-by: SushantJadhav <Sushant.Jadhav@kibocommerce.com> Co-authored-by: amolnadagonde <amol.nadagonde@kibocommerce.com> Co-authored-by: kibo-sushant <sushant.jadhav@blueconchtech.com> Co-authored-by: kibo-amolnadagonde <75060520+kibo-amolnadagonde@users.noreply.github.com>
158 lines
6.2 KiB
Markdown
158 lines
6.2 KiB
Markdown
[](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fcommerce&project-name=commerce&repo-name=commerce&demo-title=Next.js%20Commerce&demo-description=An%20all-in-one%20starter%20kit%20for%20high-performance%20e-commerce%20sites.&demo-url=https%3A%2F%2Fdemo.vercel.store&demo-image=https%3A%2F%2Fbigcommerce-demo-asset-ksvtgfvnd.vercel.app%2Fbigcommerce.png&integration-ids=oac_MuWZiE4jtmQ2ejZQaQ7ncuDT)
|
|
|
|
# Next.js Commerce
|
|
|
|
The all-in-one starter kit for high-performance e-commerce sites. With a few clicks, Next.js developers can clone, deploy and fully customize their own store.
|
|
Start right now at [nextjs.org/commerce](https://nextjs.org/commerce)
|
|
|
|
Demo live at: [demo.vercel.store](https://demo.vercel.store/)
|
|
|
|
- Shopify Demo: https://shopify.vercel.store/
|
|
- Swell Demo: https://swell.vercel.store/
|
|
- BigCommerce Demo: https://bigcommerce.vercel.store/
|
|
- Vendure Demo: https://vendure.vercel.store
|
|
- Saleor Demo: https://saleor.vercel.store/
|
|
- Ordercloud Demo: https://ordercloud.vercel.store/
|
|
- Spree Demo: https://spree.vercel.store/
|
|
|
|
## Features
|
|
|
|
- Performant by default
|
|
- SEO Ready
|
|
- Internationalization
|
|
- Responsive
|
|
- UI Components
|
|
- Theming
|
|
- Standardized Data Hooks
|
|
- Integrations - Integrate seamlessly with the most common ecommerce platforms.
|
|
- Dark Mode Support
|
|
|
|
## Integrations
|
|
|
|
Next.js Commerce integrates out-of-the-box with BigCommerce, Shopify, Swell, Saleor, Vendure and Spree. We plan to support all major ecommerce backends.
|
|
|
|
## Considerations
|
|
|
|
- `framework/commerce` contains all types, helpers and functions to be used as base to build a new **provider**.
|
|
- **Providers** live under `framework`'s root folder and they will extend Next.js Commerce types and functionality (`framework/commerce`).
|
|
- We have a **Features API** to ensure feature parity between the UI and the Provider. The UI should update accordingly and no extra code should be bundled. All extra configuration for features will live under `features` in `commerce.config.json` and if needed it can also be accessed programatically.
|
|
- Each **provider** should add its corresponding `next.config.js` and `commerce.config.json` adding specific data related to the provider. For example in case of BigCommerce, the images CDN and additional API routes.
|
|
- **Providers don't depend on anything that's specific to the application they're used in**. They only depend on `framework/commerce`, on their own framework folder and on some dependencies included in `package.json`
|
|
|
|
## Configuration
|
|
|
|
### How to change providers
|
|
|
|
Open `.env.local` and change the value of `COMMERCE_PROVIDER` to the provider you would like to use, then set the environment variables for that provider (use `.env.template` as the base).
|
|
|
|
The setup for Shopify would look like this for example:
|
|
|
|
```
|
|
COMMERCE_PROVIDER=shopify
|
|
NEXT_PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN=xxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN=xxxxxxx.myshopify.com
|
|
```
|
|
|
|
And check that the `tsconfig.json` resolves to the chosen provider:
|
|
|
|
```
|
|
"@framework": ["framework/shopify"],
|
|
"@framework/*": ["framework/shopify/*"]
|
|
```
|
|
|
|
That's it!
|
|
|
|
### Features
|
|
|
|
Every provider defines the features that it supports under `framework/{provider}/commerce.config.json`
|
|
|
|
#### Features Available
|
|
|
|
The following features can be enabled or disabled. This means that the UI will remove all code related to the feature.
|
|
For example: Turning `cart` off will disable Cart capabilities.
|
|
|
|
- cart
|
|
- search
|
|
- wishlist
|
|
- customerAuth
|
|
- customCheckout
|
|
|
|
#### How to turn Features on and off
|
|
|
|
> NOTE: The selected provider should support the feature that you are toggling. (This means that you can't turn wishlist on if the provider doesn't support this functionality out the box)
|
|
|
|
- Open `commerce.config.json`
|
|
- You'll see a config file like this:
|
|
```json
|
|
{
|
|
"features": {
|
|
"wishlist": false,
|
|
"customCheckout": true
|
|
}
|
|
}
|
|
```
|
|
- Turn `wishlist` on by setting `wishlist` to `true`.
|
|
- Run the app and the wishlist functionality should be back on.
|
|
|
|
### How to create a new provider
|
|
|
|
🔔 New providers are on hold [until we have a new API for commerce](https://github.com/vercel/commerce/pull/252) 🔔
|
|
|
|
Follow our docs for [Adding a new Commerce Provider](framework/commerce/new-provider.md).
|
|
|
|
If you succeeded building a provider, submit a PR with a valid demo and we'll review it asap.
|
|
|
|
## Contribute
|
|
|
|
Our commitment to Open Source can be found [here](https://vercel.com/oss).
|
|
|
|
1. [Fork](https://help.github.com/articles/fork-a-repo/) this repository to your own GitHub account and then [clone](https://help.github.com/articles/cloning-a-repository/) it to your local device.
|
|
2. Create a new branch `git checkout -b MY_BRANCH_NAME`
|
|
3. Install the dependencies: `npm i`
|
|
4. Duplicate `.env.template` and rename it to `.env.local`
|
|
5. Add proper store values to `.env.local`
|
|
6. Run `npm run dev` to build and watch for code changes
|
|
|
|
## Work in progress
|
|
|
|
We're using Github Projects to keep track of issues in progress and todo's. Here is our [Board](https://github.com/vercel/commerce/projects/1)
|
|
|
|
People actively working on this project: @okbel & @lfades.
|
|
|
|
## Troubleshoot
|
|
|
|
<details>
|
|
<summary>I already own a BigCommerce store. What should I do?</summary>
|
|
<br>
|
|
First thing you do is: <b>set your environment variables</b>
|
|
<br>
|
|
<br>
|
|
.env.local
|
|
|
|
```sh
|
|
BIGCOMMERCE_STOREFRONT_API_URL=<>
|
|
BIGCOMMERCE_STOREFRONT_API_TOKEN=<>
|
|
BIGCOMMERCE_STORE_API_URL=<>
|
|
BIGCOMMERCE_STORE_API_TOKEN=<>
|
|
BIGCOMMERCE_STORE_API_CLIENT_ID=<>
|
|
BIGCOMMERCE_CHANNEL_ID=<>
|
|
```
|
|
|
|
If your project was started with a "Deploy with Vercel" button, you can use Vercel's CLI to retrieve these credentials.
|
|
|
|
1. Install Vercel CLI: `npm i -g vercel`
|
|
2. Link local instance with Vercel and Github accounts (creates .vercel file): `vercel link`
|
|
3. Download your environment variables: `vercel env pull .env.local`
|
|
|
|
Next, you're free to customize the starter. More updates coming soon. Stay tuned.
|
|
|
|
</details>
|
|
|
|
<details>
|
|
<summary>BigCommerce shows a Coming Soon page and requests a Preview Code</summary>
|
|
<br>
|
|
After Email confirmation, Checkout should be manually enabled through BigCommerce platform. Look for "Review & test your store" section through BigCommerce's dashboard.
|
|
<br>
|
|
<br>
|
|
BigCommerce team has been notified and they plan to add more details about this subject.
|
|
</details> |