diff --git a/ecommerce/.npmrc b/ecommerce/.npmrc new file mode 100644 index 0000000..0085ae6 --- /dev/null +++ b/ecommerce/.npmrc @@ -0,0 +1,6 @@ +PUPPETEER_SKIP_DOWNLOAD=true +registry=https://artifactory.oci.oraclecorp.com/api/npm/global-dev-npm +@types:registry=https://artifactory.oci.oraclecorp.com/api/npm/global-dev-npm +@oracle:registry=https://artifactory.oci.oraclecorp.com/api/npm/global-dev-npm +strict-ssl=false +scripts-prepend-node-path=true diff --git a/ecommerce/README.md b/ecommerce/README.md new file mode 100644 index 0000000..90f4509 --- /dev/null +++ b/ecommerce/README.md @@ -0,0 +1,62 @@ +# How to run: + +## sample-data + +### change to the sample-data directory + $ cd sample-data + +### setup the schema + $ mysqlsh --sql -u admin -p'' < ddl.sql + +### seed the sample data + $ mysqlsh --sql -u admin -p'' < data.sql + +### define the stored procedures + $ mysqlsh --sql -u admin -p'' < define_stored_procedures.sql + +### insert the reviews + $ msqlsh --sql -u admin + + mysqlsh> call insert_reviews(); + mysqlsh> \quit + +## strapi + +### install + $ cd strapi + $ npm install + +### setup + $ cp .env.example .env + +Also, add the following values to your .env file + + # Database + DATABASE_CLIENT=mysql2 + DATABASE_HOST=localhost + DATABASE_PORT=3306 + DATABASE_NAME= + DATABASE_USERNAME= + DATABASE_SSL=true + DATABASE_SSL_REJECT_UNAUTHORIZED=false + +### run + $ DATABASE_PASSWORD= npm develop + +### access + +http://localhost:1337 + +## next.js + +### install + $ cd nextjs + $ npm install + +## run + $ npm run dev + +### access + +http://localhost:3000 + diff --git a/ecommerce/nextjs/.env.example b/ecommerce/nextjs/.env.example new file mode 100644 index 0000000..98f54bb --- /dev/null +++ b/ecommerce/nextjs/.env.example @@ -0,0 +1,16 @@ +# Add custom values +SITE_NAME="Ecwid Store" +COMPANY_NAME="Ecwid by Lightspeed." +TWITTER_CREATOR="@ecwid" +TWITTER_SITE="https://ecwid.com" + +# Your Store ID: https://support.ecwid.com/hc/en-us/articles/207806465-Where-is-my-Store-ID +ECWID_STORE_ID="" + +# We recommend using a public token. How you can get it: https://api-docs.ecwid.com/reference/customizations-for-a-single-store +ECWID_API_KEY="" + +# Provide Ecwid team (https://developers.ecwid.com/contact) with webhook URL and webhook events to set for your application: +# category.created, category.deleted, category.updated, product.created, product.deleted, product.updated, profile.updated +# and custom HTTP header "X-Ecwid-Revalidation-Secret" with value of your revalidation secret +ECWID_REVALIDATION_SECRET="" diff --git a/ecommerce/nextjs/.eslintrc.js b/ecommerce/nextjs/.eslintrc.js new file mode 100644 index 0000000..1bcb3ee --- /dev/null +++ b/ecommerce/nextjs/.eslintrc.js @@ -0,0 +1,31 @@ +module.exports = { + extends: ['next', 'prettier'], + plugins: ['unicorn', 'prettier'], + rules: { + 'no-unused-vars': [ + 'error', + { + args: 'after-used', + caughtErrors: 'none', + ignoreRestSiblings: true, + vars: 'all', + varsIgnorePattern: '^_', + argsIgnorePattern: '^_', + }, + ], + 'prettier/prettier': ['error'], + 'prefer-const': 'error', + 'react-hooks/exhaustive-deps': 'error', + 'unicorn/filename-case': [ + 'error', + { + case: 'kebabCase', + }, + ], + }, + parserOptions: { + babelOptions: { + presets: [require.resolve('next/babel')], + }, + }, +}; diff --git a/ecommerce/nextjs/.github/dependabot.yml b/ecommerce/nextjs/.github/dependabot.yml new file mode 100644 index 0000000..a9412c3 --- /dev/null +++ b/ecommerce/nextjs/.github/dependabot.yml @@ -0,0 +1,6 @@ +version: 2 +updates: + - package-ecosystem: 'github-actions' + directory: '/' + schedule: + interval: 'weekly' diff --git a/ecommerce/nextjs/.github/workflows/test.yml b/ecommerce/nextjs/.github/workflows/test.yml new file mode 100644 index 0000000..227f868 --- /dev/null +++ b/ecommerce/nextjs/.github/workflows/test.yml @@ -0,0 +1,35 @@ +name: test +on: pull_request + +# Cancel in progress workflows on pull_requests. +# https://docs.github.com/en/actions/using-jobs/using-concurrency#example-using-a-fallback-value +concurrency: + group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }} + cancel-in-progress: true + +jobs: + test: + runs-on: ubuntu-latest + steps: + - name: Checkout repo + uses: actions/checkout@v4 + - name: Set node version + uses: actions/setup-node@v3 + with: + node-version-file: '.nvmrc' + - name: Set pnpm version + uses: pnpm/action-setup@v2 + with: + run_install: false + version: 7 + - name: Cache node_modules + id: node-modules-cache + uses: actions/cache@v3 + with: + path: '**/node_modules' + key: node-modules-cache-${{ hashFiles('**/pnpm-lock.yaml') }} + - name: Install dependencies + if: steps.node-modules-cache.outputs.cache-hit != 'true' + run: pnpm install --no-frozen-lockfile + - name: Run tests + run: pnpm test diff --git a/ecommerce/nextjs/.gitignore b/ecommerce/nextjs/.gitignore new file mode 100644 index 0000000..e82a0f9 --- /dev/null +++ b/ecommerce/nextjs/.gitignore @@ -0,0 +1,39 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage +.playwright + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.pnpm-debug.log* + +# local env files +.env* +!.env.example + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts +.env*.local diff --git a/ecommerce/nextjs/.nvmrc b/ecommerce/nextjs/.nvmrc new file mode 100644 index 0000000..3c03207 --- /dev/null +++ b/ecommerce/nextjs/.nvmrc @@ -0,0 +1 @@ +18 diff --git a/ecommerce/nextjs/.prettierignore b/ecommerce/nextjs/.prettierignore new file mode 100644 index 0000000..71df57c --- /dev/null +++ b/ecommerce/nextjs/.prettierignore @@ -0,0 +1,3 @@ +.vercel +.next +pnpm-lock.yaml diff --git a/ecommerce/nextjs/.prettierrc.js b/ecommerce/nextjs/.prettierrc.js new file mode 100644 index 0000000..c92ccdf --- /dev/null +++ b/ecommerce/nextjs/.prettierrc.js @@ -0,0 +1,13 @@ +/** @type {import('prettier').Config} */ +module.exports = { + singleQuote: true, + arrowParens: 'avoid', + quoteProps: 'as-needed', + trailingComma: 'es5', + useTabs: false, + singleAttributePerLine: true, + semi: true, + printWidth: 100, + tabWidth: 4, + // plugins: ['prettier-plugin-tailwindcss'], +}; diff --git a/ecommerce/nextjs/.vscode/launch.json b/ecommerce/nextjs/.vscode/launch.json new file mode 100644 index 0000000..d876691 --- /dev/null +++ b/ecommerce/nextjs/.vscode/launch.json @@ -0,0 +1,28 @@ +{ + "version": "0.2.0", + "configurations": [ + { + "name": "Next.js: debug server-side", + "type": "node-terminal", + "request": "launch", + "command": "pnpm dev" + }, + { + "name": "Next.js: debug client-side", + "type": "chrome", + "request": "launch", + "url": "http://localhost:3000" + }, + { + "name": "Next.js: debug full stack", + "type": "node-terminal", + "request": "launch", + "command": "pnpm dev", + "serverReadyAction": { + "pattern": "started server on .+, url: (https?://.+)", + "uriFormat": "%s", + "action": "debugWithChrome" + } + } + ] +} diff --git a/ecommerce/nextjs/.vscode/settings.json b/ecommerce/nextjs/.vscode/settings.json new file mode 100644 index 0000000..2d33462 --- /dev/null +++ b/ecommerce/nextjs/.vscode/settings.json @@ -0,0 +1,9 @@ +{ + "typescript.tsdk": "node_modules/typescript/lib", + "typescript.enablePromptUseWorkspaceTsdk": true, + "editor.codeActionsOnSave": { + "source.fixAll": "explicit", + "source.organizeImports": "explicit", + "source.sortMembers": "explicit" + } +} diff --git a/ecommerce/nextjs/README.md b/ecommerce/nextjs/README.md new file mode 100644 index 0000000..5f3b724 --- /dev/null +++ b/ecommerce/nextjs/README.md @@ -0,0 +1,55 @@ +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FEcwid%2Fecwid-nextjs-commerce&repository-name=ecwid-nextjs-commerce&env=ECWID_STORE_ID,ECWID_API_KEY,COMPANY_NAME,SITE_NAME) + +# Next.js Commerce + +A Next.js 14 and App Router-ready ecommerce template featuring: + +- Next.js App Router +- Optimized for SEO using Next.js's Metadata +- React Server Components (RSCs) and Suspense +- Server Actions for mutations +- Edge Runtime +- New fetching and caching paradigms +- Dynamic OG images +- Styling with Tailwind CSS +- Checkout and payments with Ecwid +- Automatic light/dark mode based on system settings + +

+ +> Note: [Contact us](https://ecommerce-store.typeform.com/to/pZ5PYgNF?utm_source=github-commerce) if you’re a developer and need a premium Ecwid subscription for testing purposes. + +## Integrations + +Integrations enable upgraded or additional functionality for Next.js Commerce + +- [Orama](https://github.com/oramasearch/nextjs-commerce) ([Demo](https://vercel-commerce.oramasearch.com/)) + - Upgrades search to include typeahead with dynamic re-rendering, vector-based similarity search, and JS-based configuration. + - Search runs entirely in the browser for smaller catalogs or on a CDN for larger. + +## Running locally + +You will need to use the environment variables [defined in `.env.example`](.env.example) to run Next.js Commerce. It's recommended you use [Vercel Environment Variables](https://vercel.com/docs/concepts/projects/environment-variables) for this, but a `.env` file is all that is necessary. + +> Note: You should not commit your `.env` file or it will expose secrets that will allow others to control your Ecwid store. + +1. Install Vercel CLI: `npm i -g vercel` +2. Link local instance with Vercel and GitHub accounts (creates `.vercel` directory): `vercel link` +3. Download your environment variables: `vercel env pull` + +```bash +pnpm install +pnpm dev +``` + +Your app should now be running on [localhost:3000](http://localhost:3000/). + +
+ Expand if you work at Vercel and want to run locally and / or contribute + +1. Run `vc link`. +1. Select the `Vercel Solutions` scope. +1. Connect to the existing `commerce-ecwid` project. +1. Run `vc env pull` to get environment variables. +1. Run `pnpm dev` to ensure everything is working correctly. +
diff --git a/ecommerce/nextjs/app/[locale]/(checkout)/checkout/layout.tsx b/ecommerce/nextjs/app/[locale]/(checkout)/checkout/layout.tsx new file mode 100644 index 0000000..f2eceda --- /dev/null +++ b/ecommerce/nextjs/app/[locale]/(checkout)/checkout/layout.tsx @@ -0,0 +1,15 @@ +import Footer from 'components/layout/footer'; +import { Suspense } from 'react'; + +export default function Layout({ children }: { children: React.ReactNode }) { + return ( + +
+
+ {children} +
+
+