Christopher Lee

Full Stack Developer

JavaScript/TypeScript • Python • AWS

Amazon Web Services

REST API for Google Sheets

  • FastAPI
  • Google APIs

A trip itinerary planner using Google Sheets as a backend, utilizing a FastAPI REST API in conjunction with Google Workspace APIs (Google Drive, Google Sheets).

View the API documentation

  • Uses a Google Cloud project authorized for access by a service account. The FastAPI server uses the service account to request credentials for access the Google Drive and Google Sheets APIs.
  • Includes a migration script for bootstrapping the project (sets up shared folders, template spreadsheets).
  • Includes a reference front-end built with React and Bootstrap.

REST API for Google Sheets (serverless)

  • AWS SAM
  • Amazon API Gateway
  • AWS Lambda
  • Google APIs

A trip itinerary planner that uses Google Sheets as a backend, utilizing Amazon API Gateway with AWS Lambda function integration to provide a serverless REST API that communicates with Google Workspace APIs (Google Drive, Google Sheets).

Built with the AWS Serverless Application Model (SAM).

  • Google Cloud service account credentials are stored as secure strings in AWS Systems Manager Parameter Store and retrieved on API calls by Lambda functions using the Boto3 SSM client.

N Queens Visualizer

  • React
  • Tailwind CSS
  • Mocha
  • Backtracking

An interactive visualizer for the N Queens puzzle written with React and Tailwind CSS.

  • Solutions are calculated and yielded to the visualizer on user request, via a recursive generator using a backtracking depth-first search algorithm.
  • Tests for the solver are written using Mocha.

Try out the app

Work in progress:

  • Refactoring of the generator function to async and implemention of an AbortController that can be triggered on user input (to terminate a calculation that is taking too long and overloading and blocking the browser).
  • Rewrite of the visualizer to HTML Canvas.

Learning projects

  • React
  • React Router
  • Express
  • FastAPI
  • SQL
  • REST APIs

React Resume Generator

  • React
  • Material UI
  • CSS-in-JS
  • Web APIs

A fully client-side React app, utilizing Material UI, to process and render JSON Resume data into print-formatted HTML and PDF.

Try out the app

The HTML document is rendered with components from a bespoke React component library styled with custom CSS. PDF generation is via React-pdf.

  • State management via React hooks and context providers.
  • React component library: built using Vite library mode with CSS modules, refactored into React-pdf components with styling refactored for the React-pdf StyleSheet API.
  • Live formatting in response to user interaction via Emotion styled components.
  • Web APIs: File API for upload of local files, Fetch API for remote data sources
  • Data editing via React CodeMirror.

This site

  • Astro
  • React
  • Sass
  • CSS
A collection of blog sites built with Astro using built-from-scratch React components styled with Sass and/or Tailwind CSS, with content authored in MDX.
https://coffee.chrjl.dev (under construction)
https://blog.chrjl.dev (under construction)

This landing page uses CSS scroll snapping with conditional styling via scroll-state container queries (if supported, not yet widely available).

A JavaScript fallback using Intersection Observer handles conditional styling for browsers that do not support scroll-state.