Code Monkey home page Code Monkey logo

real-world-vendure's Introduction

real-world-vendure

This project demonstrates a real-world Vendure server setup. It was generated with @vendure/create, but adds extra tooling and includes some example real-world plugins.

Getting Started

  1. Clone this repo
  2. yarn to install dependencies
  3. yarn populate to populate the database with some sample data
  4. In the /src/ui-extensions/react-app directory, run yarn and then yarn build
  5. In the root dir, run yarn start to start the Vendure server

Tooling

These are tools for finding and fixing common code issues and formatting your code in a standard way. Run yarn lint:fix to lint and format your code.

Jest is a testing framework used in the plugin end-to-end tests. Ts-jest allows Jest to work directly with TypeScript files without requiring a compilation step.

Jest tests for the reviews plugin are run with yarn e2e:reviews

This is used to generate TypeScript types based on the Vendure server's GraphQL APIs. It is used to automatically generate correct types for plugin resolvers and plugin e2e tests. This ensures that whenever a schema is changed or a CustomField added, new typings can be generated to make sure your resolvers and tests are correct.

Whenever a change to the GraphQL API is made either by a plugin schema extension or by the definition of CustomFields, run yarn generate-types to update the TypeScript definitions.

Plugins

Braintree Payments Plugin

This is a working implementation for the Braintree payment provider. It demonstrates how a typical PaymentMethodHandler is used. The basic pattern will be similar for other modern payment processors such as Stripe or PayPal. See the Braintree plugin readme for more information.

Reviews Plugin

This plugin adds the capability for customers to create product reviews which can then be used to display product ratings.

The plugin showcases several advanced capabilities of the Vendure plugin system. See the reviews plugin readme for more information.

UI Extensions

This repo also demonstrates several approaches to extending the Admin UI:

Directory structure

  • /src contains the source code of your Vendure server. All your custom code and plugins should reside here.
  • /static contains static (non-code) files such as assets (e.g. uploaded images) and email templates.
  • /migrations contains database migration scripts (see migrations section below).

Development

yarn start

will start the Vendure server and worker processes from the src directory. Note - the first time you run this the custom UI extensions of the reviews plugin will be compiled which may take a few minutes. Subsequent runs will be much faster (providing the UI extensions of the reviews plugin do not change).

Build & deploy

yarn build

will compile the TypeScript sources into the /dist directory and compile the custom Admin UI app into the /admin-ui directory.

Then to run in production, the files /dist/index.js & /dist/index-worker.js should be run in Node.

Migrations

Migrations allow safe updates to the database schema.

The following npm scripts can be used to generate migrations:

yarn migration:generate [name]

run any pending migrations that have been generated:

yarn migration:run

and revert the most recently-applied migration:

yarn migration:revert

real-world-vendure's People

Contributors

michaelbromley avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.