March 27th, 2022
Running a MySQL Database Client on Kubernetes
In the first version of my SaintsXCTF application, one underdeveloped aspect of the technology stack was the MySQL database infrastructure. The only way to access the production database was to create a bastion host and interact with it via the command line. This bastion host was a server that was only accessible from my IP address and could only interact with my MySQL database. All other network ports were closed.
While this was an okay start, I really wanted a user interface to interact with the MySQL database with similar functionality to a local MySQL IDE, such as DataGrip. After researching different options, I decided to use phpMyAdmin, a MySQL administrative client that can run on a web server.
March 12th, 2022
UI Testing SwiftUI Views
In my previous article, I discussed SwiftUI and how to integrate SwiftUI components into a UIKit application. SwiftUI is a (relatively) new framework for creating user interfaces in Apple ecosystem applications. User interfaces built using SwiftUI are configured completely in code with Swift. In this article, I discuss how to UI test SwiftUI views in an iOS application.
February 28th, 2022
Creating SwiftUI Components Within a UIKit iOS Application
SwiftUI is a new framework that creates user interfaces for iOS and other Apple operating system applications. SwiftUI is completely programmatic (user interfaces in SwiftUI are built exclusively by writing Swift code). This is in stark contrast to previous frameworks such as UIKit which use a combination of Swift or Objective-C code and storyboards. Storyboards are graphical interfaces which allow engineers or designers to build user interfaces without writing code.
As someone who prefers solutions that involve writing code exclusively, SwiftUI is a welcome addition to the iOS landscape and a positive change in direction from Apple. Using GUIs such as storyboard to build interfaces have many downsides, such as difficulties when working in large groups on a single UI file and confusing merge conflicts when using version control systems. Since I'm very passionate about programming (as most software engineers are), altering values in a GUI to change a UI is a lot less exciting than coding!
February 18th, 2022
Building an API for Authentication with AWS Lambda and API Gateway
My SaintsXCTF application has multiple APIs. One of these APIs, auth.saintsxctf.com, is hosted on AWS API Gateway and AWS Lambda. Its main purpose is to provide an authentication mechanism for the application. In this article, I discuss endpoints within this API and how they provide application authentication using JWTs.
February 5th, 2022
Building an API for Sending Emails with AWS Lambda and API Gateway
My SaintsXCTF application has multiple APIs. One of these APIs, fn.saintsxctf.com, is hosted on AWS API Gateway and AWS Lambda. Its main purpose is to send emails to users based on certain website actions, such as changing a password or registering. In this article, I discuss the infrastructure needed to make the API, the source code of the API endpoints, and the approach used to deploy the API to AWS.
January 17th, 2022
Learning the Basics of Apache Airflow
Over the last six months, I’ve ued Apache Airflow extensively at work. Airflow is a platform and framework for building and automating data pipelines1. Airflow data pipelines are written in Python and interoperate with many different technologies, such as databases, cloud platforms, containers, and more. Often, Airflow is used in the realms of data analytics and machine learning.
While Airflow data pipelines are written in Python, the software they automate and schedule do not need to be Python related. Nonetheless, the fact that Airflow's language is Python makes data pipelines highly configurable and customizable. Since Python is very popular and simpler to learn compared to other languages, most engineers will be able to work with Airflow easily.
January 10th, 2022
Testing a Flask API
In a prior article, I discussed my Flask API written for SaintsXCTF, an application which allows users and their teammates to log running exercises and keep track of their running mileage. As with any piece of software, this Flask API requires extensive testing to keep it functional and maintainable. In this article, I discuss the automated testing approach I implemented for the API.
January 2nd, 2022
Restricting Access to Static Website Amazon S3 Buckets using Terraform
For years, unsecured AWS S3 buckets have been a major source of data leaks in the Software Engineering industry. Enter a Google search for "S3 bucket public data leak" and you will find countless examples of hackers leaking data from Amazon S3.
The biggest reason why S3 data leaks are so common is that objects (files) in S3 buckets are easily misconfigured to be public over HTTP. When an S3 bucket is public, its contents are available for anyone in the world to view. For engineers new to AWS and the S3 service, the mistake of configuring S3 buckets to be public is very common.
December 24th, 2021
Building an API with Flask and SQLAlchemy
While researching API frameworks and libraries, I grew interested in the Flask framework. Flask is a very lightweight framework, allowing engineers to quickly create APIs in Python without much opinionated tooling. For example, Flask does not come installed with a database access layer or ORM, allowing engineers to pick whichever database access library they prefer. This flexibility is appealing to me because it allows me to configure and design the API to my liking. Also, working in Python is easy and allows me to quickly write API code.
In this article, I begin by describing how I structured my SaintsXCTF API, which is written in Flask. Next, I provide an overview of Flask and SQLAlchemy, an object relational mapper (ORM). Finally, I dive into my API code. You can view the code discussed in this article in my saints-xctf-api repository.
December 3rd, 2021
Redux in a TypeScript React Application: Following the Ducks Pattern
Redux is a state management pattern that is commonly used in complex React applications. Redux, based on the Flux design pattern, is helpful when application state is shared between many pages of a website and is updated frequently1. In my saintsxctf.com website, Redux stores and uses application state across all my webpages. SaintsXCTF is a good example of a website that can benefit from Redux; it needs login information, user preferences, team memberships, group memberships, and more to be shared amongst all pages.
In this article, I start by going over the basics of Redux. I'll also explain the “ducks pattern”, which is an approach to writing Redux code. Then, I'll walk through the Redux configuration and code in my SaintsXCTF application. All the code for my SaintsXCTF web application is available in a GitHub repository.
November 15th, 2021
Building a Web Application with React and TypeScript
I recently rewrote my web application saintsxctf.com using React and TypeScript. This article looks at how the application is configured and walks through some React code. All the code for the website exists in a GitHub repository.
November 1st, 2021
SaintsXCTF Version 2.0: React Web Application Overview
At its core, SaintsXCTF is a web application that allows users to log their running workouts, openly express how they felt while running, and encourage and support teammates. From a user perspective, the website is the most important part of the SaintsXCTF technology stack, since it is what they interact with every day and depend on being operational.
When I wrote the first version of the saintsxctf.com website, I was a senior in college who just began learning web development. I was also new to user interface (UI) design and user experience (UX) design. Over time, this inexperience became more and more apparent when viewing the first version of the website and its underlying code. While designing the second version of the website, I knew not only did I need to follow best engineering practices, but I also had to make an elegant user interface.