Cat Drop

Vision

~~Silly~~ Highly sophisticated site to drop your favorite cat pics.

Architecture Diagram

    flowchart LR
        User((Cat Drop User))
        CFDist[Cloudfront Distribution]
        S3_Cat[(S3 cat pics)]
        S3_UI[(S3 UI)]
        ApiGW[Api Gateway]
        Lambda[λ]
        BucketCheck{Max number of cat pics?}

    User-->CFDist
    CFDist-- Fetch page content -->S3_UI
    CFDist-- Submit image -->ApiGW
    ApiGW-->Lambda

    Lambda-- Get count of current cat pics-->S3_Cat
    Lambda---->BucketCheck
    BucketCheck -->|Yes| Error_Response[400 error response]
    BucketCheck -->|No| Success_response[Upload cat pics]
    Success_response --> S3_Cat

Package Breakdown

cdk

Utilize AWS CDK infrastructure as code to:

Host single page svelte app via AWS CloudFront distribution and S3.
Host backend via AWS lambda and API Gateway

ui

Utilize svelte to build highly responsive, mobile friendly interface to drop cat pics.

service

Utilize typescript and express to host backend. The backend does some basic verification (i.e. submitted image size, and total count of cat pics do not exceed maximums) before saving the image to S3. Needs work!

TODO

Add eslint and 100% test coverage to yarn verify command.
Add tab to UI to display cat pics.
Implement AWS Web Application Firewall around Cloudfront Distribution and Api Gateway to protect against network level attacks.
Add hosted zone and register a domain such as cat.drop or catdrop.com.
- Host the backend on a subdomain such as api.cat.drop or api.catdrop.com.
- Host branches on subdomains such as mybranch.cat.drop and mybranch.api.cat.drop to test branches directly.
Publish StaticWebHost construct to private artifactory for use in other projects.
Publish build and deploy actions to github marketplace for use in other workflows.

gorskilauren/cat-drop