CARWORLD.LOVE

Frontend: React SPA

Desktop

Mobile (collapsed and expanded nav menu)

Demo

Want to test out a purchase? All credit card info is just "42" repeated as needed.

I encourage you to test this out so you can see the emails we send for order confirmation!

Navigation

Navigation in Car World functions similarly on Mobile and Desktop! Merely click on any option to route there, and see your current location highlighted in the UI. For mobile, first tap the Car World Logo to open the menu.

Helpful Errors

Run into any issues in the app? No worries! carworld.love has some handy stylized Toasts to deliver error messages.

Backend: AWS Serverless

Car World is a Serverless application. This means that there is no server actively running our Car World application code that we administer to on the backend; instead, Car World application code is defined with AWS Lambdas. Each time the client needs to access a piece of backend functionality, the request comes into our API GateWay. The gateway will then route that request to the appropriate lambda controller to process the request. In certain cases we will first authenticate the request with our Validator lambda before passing it on to the appropriate controller.

Transaction Handling

One of the core features of Car World is the Merch marketplace. This marketplace is handled by the Commerce Controller. There are two main flows that run through this controller:

Initate PaymentIntent
Handle Transaction

The nature of our integration with the Stripe API dictates these flows. In the first flow, Initate PaymentIntent, a call is made from the client to begin a transaction. The Commerce Controller initializes Stripe's transaction concept, the PaymentIntent, and returns to the client both the PaymentIntent ID as well as Stripe's Client Secret.

The above flow leads directly into the next flow; Handle Transaction. Here, the client first sends the email associated with the transaction to the Commerce Controller, which then caches it. After this the client communicates all transaction details (card, billing) directly to Stripe via the previously obtained secret. Stripe processes the payment on their end, and passes the result of the transaction to the Commerce Controller. The Commerce Controller fetches the email using the PaymentIntent ID, and records the transaction. After, the Commerce Controller sends transaction details to SES (simple email service), which emits an order confirmation email to both the user and the admins (physical store administrators).

Authentication

carworld.love is not just a marketplace; it is also a community. Car World caters to it's audience by providing them the ability to make accounts, track their Digital Devotion Points (DDP), and more. The security and api operations created to support these features are handled by the Auth Controller. Key controller actions are highlighted below:

CDK: Structure and Deployment

All of Car World's infrastructure is automatically generated through AWS CDK (Infrastructure as Code). The following diagram shows the file hierarchy, as it pertains to the CDK and infra.

|--infra
|---+ infrastructure as code
  |
  |--lambda
  |---+ api endpoints as lambda functions
  |
  |--infra
  |---+ cloudformation to build and deploy the infrastructure stored here
    |
    |--CWCore Stack
    |---+ CWAPIGW, Controllers (Profile, Commerce, Auth), Databases, Secret fetching
  |
  |--tests
    |---+ unit

The cdk.json file tells the CDK Toolkit how to execute your app.

This project is set up like a standard Python project. The initialization process also creates a virtualenv within this project, stored under the .venv directory. To create the virtualenv it assumes that there is a python3 (or python for Windows) executable in your path with access to the venv package. If for any reason the automatic creation of the virtualenv fails, you can create the virtualenv manually.

To manually create a virtualenv on MacOS and Linux:

$ python3 -m venv .venv

After the init process completes and the virtualenv is created, you can use the following step to activate your virtualenv.

$ source .venv/bin/activate

If you are a Windows platform, you would activate the virtualenv like this:

% .venv\Scripts\activate.bat

Once the virtualenv is activated, you can install the required dependencies.

$ pip install -r requirements.txt

At this point you can now synthesize the CloudFormation template for this code.

$ cdk synth

Need to add dependencies to lambda?

$ mkdir zip
$ zip -r zip/function.zip index.js node_modules/ package.json package-lock.json

To add additional dependencies, for example other CDK libraries, just add them to your setup.py file and rerun the pip install -r requirements.txt command.

Useful commands

cdk ls list all stacks in the app
cdk synth emits the synthesized CloudFormation template
cdk deploy deploy this stack to your default AWS account/region
cdk diff compare deployed stack with current state
cdk docs open CDK documentation

Enjoy!

License

All code contained in this repository is licensed under the GNU General Public License v3.0.

MatthewMSaucedo/CarWorld