👋 Hello! This app is a very simple POS (point-of-sale) application that supports three main use cases: creating orders, adding items to an order, and completing or exiting an order. This also allows you to view an itemized view of all completed orders. It uses Serialized to keep track of events and to pull the data.
To start, fork it and then clone this repository locally onto your machine or download it as a .ZIP file.
Once you have the repository on your machine, follow the steps to get started:
- Set up your
.envfiles - you will need a.envfile in theapidirectory (to be used by the backend to authenticate into the Serialized API). You will need a Serialized account and within that, a project created in your account. - Your
.envfile will look like this:
SERIALIZED_ACCESS_KEY=
SERIALIZED_SECRET_ACCESS_KEY=
To find the SERIALIZED_ACCESS_KEY and SERIALIZED_SECRET_ACCESS_KEY values, go to Settings > API Keys in your Serialized dashboard for the project you created and set the environment variables to the corresponding values.
Once your .env is set up, install dependencies. You'll need to do the following:
- In the
apidirectory, runnpm install(installs general back-end dependencies) - In the
clientdirectory, runnpm install(installs React project dependencies)
To run your application, open a new window or tab in the Terminal so that you have two tabs or windows open.
In one tab, run npm start in the api folder. (The back-end will run on localhost:9000)
In another tab, run npm start in the client folder.
Once localhost:3000 launches the front-end, you’ll see the following screen:
To confirm an order was created, go to your Serialized Dashboard for your project you created and go to the Data Explorer page. You'll see a list of orders that have been created.
To confirm items have been added to an order or that your order has been completed, go to your Serialized Dashboard > Data explorer > Aggregates > order (under Aggregate type column) > Aggregates > click the Aggregate ID of the top (and most recent) entry.
To see details on events within an Aggregatem you can click on Event IDs within this view.
To confirm your projections have been created for viewing your completed orders, go to your Serialized Dashboard for your project > Projections. You should be able to see your created projections from here. If you click into the projections, you can view the schema of the projection.

