marcus smart background

Basketball Cards App

The App

The app allowed users to create a starting five of virtual basketball cards with their favorite players. Saved decks were shared globally for other users to view, copy, and edit. It was supported on desktop and mobile browsers.

The System

Four user actions on the frontend made calls to API endpoints, including searching for a card, saving a deck, loading saved decks, and deleting a deck. The search endpoint received the player name entered into the search bar and returned the player's data scraped from www.basketballreference.com. Clicking save used local state management to call the API's create or update endpoints depending on if the saved deck was new or preexisting. Two more user actions called API endpoints that loaded or deleted decks from the database.

The Details

Local Git repositories for the frontend and backend fed CI/CD pipelines to Netlify and AWS deployments, respectively. Netlify has a simple, batteries-included CI/CD system, automatically triggering builds whenever local commits are pushed to a remote repository. AWS is a little more complex.

To set up a similar process for the backend, the local repository fed into AWS CodePipeline and CodeDeploy to initiate builds on an Amazon Linux 2 instance. CodePipeline watches remote GitHub repositories for pushes and stores the code in an S3 bucket. CodeDeploy watches the bucket and, in this case, used an appspec.yml file to manage the deployment.

The MSSQL database was deployed manually via AWS RDS. Below are pictures of the database setup, some artifacts of the DNS and SSL, as well as the Apache server and a look at how it was debugged on the Linux instance.