{"id":13630145,"url":"https://github.com/commercelayer/commercelayer-checkout","last_synced_at":"2025-04-17T13:31:40.001Z","repository":{"id":35752587,"uuid":"194605092","full_name":"commercelayer/commercelayer-checkout","owner":"commercelayer","description":null,"archived":true,"fork":false,"pushed_at":"2023-07-25T09:46:03.000Z","size":13299,"stargazers_count":31,"open_issues_count":30,"forks_count":19,"subscribers_count":7,"default_branch":"master","last_synced_at":"2024-11-08T21:38:29.732Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/commercelayer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2019-07-01T05:25:21.000Z","updated_at":"2024-01-31T11:17:18.000Z","dependencies_parsed_at":"2024-01-14T08:29:10.682Z","dependency_job_id":"b89ad6f6-829f-4057-a999-d5a68ee3b797","html_url":"https://github.com/commercelayer/commercelayer-checkout","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/commercelayer%2Fcommercelayer-checkout","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/commercelayer%2Fcommercelayer-checkout/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/commercelayer%2Fcommercelayer-checkout/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/commercelayer%2Fcommercelayer-checkout/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/commercelayer","download_url":"https://codeload.github.com/commercelayer/commercelayer-checkout/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249344813,"owners_count":21254742,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-01T22:01:31.582Z","updated_at":"2025-04-17T13:31:38.577Z","avatar_url":"https://github.com/commercelayer.png","language":"JavaScript","funding_links":["https://www.paypal.com"],"categories":["JavaScript"],"sub_categories":[],"readme":"\u003e **Warning**\u003cbr /\u003e\nThis library is deprecated and no longer maintained. A brand new Commerce Layer [Checkout](https://github.com/commercelayer/mfe-checkout) has been officially released — we strongly recommend you to use that instead.\n\n# Commerce Layer Checkout\n\nThis application provides you with a **PCI-compliant**, **PSD2-compliant**, and **production-ready** checkout flow that lets you easily place orders through the [Commerce Layer](https://commercelayer.io/) API. It supports [Stripe](https://stripe.com), [Braintree](https://www.braintreepayments.com), [Adyen](https://www.adyen.com/), and [PayPal](https://www.paypal.com) payment methods out of the box and can be used as is or as a reference to build your own checkout experience.\n\n## Overview\n\n![Demo](docs/demo.gif?raw=true 'Demo')\n\n## Getting started\n\nYou can get your checkout application up and running in 4 simple steps:\n\n### 1. Get your credentials\n\nCreate a **sales channel** application on [Commerce Layer](https://commercelayer.io) and take note of your API credentials (base endpoint, client ID)\n\n### 2. Deploy\n\nYou can deploy the application to any web server or CDN. Deploy to Netlify or Zeit with one click:\n\n[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/commercelayer/commercelayer-checkout)\n[![Deploy with ZEIT Now](https://zeit.co/button)](https://zeit.co/new/project?template=https://github.com/commercelayer/commercelayer-checkout)\n\n### 3. Customize\n\nConfigure your API credentials and customize the look and feel by setting the following environment variables:\n\n| Name                             | Description                                                                                | Example                                                   |\n| -------------------------------- | ------------------------------------------------------------------------------------------ | --------------------------------------------------------- |\n| VUE_APP_API_BASE_URL             | Your organization endpoint                                                                 | https://acme.commercelayer.io                             |\n| VUE_APP_API_CLIENT_ID            | Your sales channel application client ID                                                   | xxxxxxxxxxxxxxxxxxxx                                      |\n| VUE_APP_BRAND_NAME               | Your brand name                                                                            | My Brand                                                  |\n| VUE_APP_BRAND_COLOR              | Your brand primary color (used by buttons and links)                                       | #1976D2                                                   |\n| VUE_APP_SUCCESS_COLOR            | Your favorite success color (used by the order confirmation page)                          | #4CAF50                                                   |\n| VUE_APP_ERROR_COLOR              | Your favorite error color (used by the form validations)                                   | #D32F2F                                                   |\n| VUE_APP_LOGO_URL                 | Your logo public URL                                                                       | https://yourbucket.s3-eu-west-1.amazonaws.com/logo.png    |\n| VUE_APP_LOGO_WIDTH               | Your logo width                                                                            | 240                                                       |\n| VUE_APP_FAVICON_URL              | Your favicon public URL                                                                    | https://yourbucket.s3-eu-west-1.amazonaws.com/favicon.ico |\n| VUE_APP_HIDE_GIFT_CARD_OR_COUPON | Hide the gift card or coupon code field                                                    | TRUE                                                      |\n| VUE_APP_SUBSCRIPTION_REF         | Enables the customer subscription checkbox (using its value as the subscription reference) | NEWSLETTER                                                |\n| VUE_APP_STRIPE_PUBLIC_KEY        | Your Stripe public key (required by Stripe)                                                | pk_live_XXXXXXXXXX                                        |\n| VUE_APP_ADYEN_ENV                | Your Adyen environment (required by Adyen)                                                 | live                                                      |\n| VUE_APP_ADYEN_ORIGIN_KEY         | Your Adyen origin key (required by Adyen)                                                  | pub.v2.XXXXX.YYYYY.ZZZZZ                                  |\n| VUE_APP_GTM_CONTAINER_ID         | Your Google Tag Manager container ID                                                       | GTM-XXXXXXX                                               |\n| VUE_APP_GTM_AUTH                 | Your gtm_auth parameter                                                                    | xxxxxxxxxx                                                |\n| VUE_APP_GTM_PREVIEW              | Your gtm_preview parameter                                                                 | env-1                                                     |\n| VUE_APP_GTM_COOKIES_WIN          | Your gtm_cookies_win parameter                                                             | x                                                         |\n| VUE_APP_GTM_LOAD_SCRIPT          | Load the Google Tag Manager script                                                         | TRUE                                                      |\n| VUE_APP_GTM_ENABLED              | Enable Google Tag Manager tracking                                                         | TRUE                                                      |\n| VUE_APP_GTM_DEBUG                | Enable Google Tag Manager console debug                                                    | TRUE                                                      |\n\n### 4. Checkout\n\nCheckout any order by visiting `https://checkout.yourdomain.com/:order_id`, where `checkout.yourdomain.com` is the domain associated with your checkout application.\n\n## Configure your market(s)\n\nGo to _Settings → Markets_ in Commerce Layer and add the Checkout URL template to your market(s), making sure to include the `:order_id` param placeholder:\n\n![Checkout URL configuration](docs/checkout-url-config.png?raw=true 'Checkout URL configuration')\n\nThis way, you'll to get the actual URL (i.e. with the real order id) returned by the orders API in the `checkout_url` order attribute:\n\n![Checkout URL API response](docs/checkout-url-api-response-snippet.png?raw=true 'Checkout URL API response')\n\n## License\n\nCommerce Layer Checkout is an open-sourced software licensed under the [MIT license](LICENSE.txt).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcommercelayer%2Fcommercelayer-checkout","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcommercelayer%2Fcommercelayer-checkout","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcommercelayer%2Fcommercelayer-checkout/lists"}