Remnant Farm Kombucha

Remnant Farm Kombucha, or RFK for short, is an artisinal brewing company that specializes in creating boldly-fresh, and "set-apart" kombucha, in both hard and soft varieties. In July 2023, I embarked on an 7-month journey with RFK to design, architect, and build a comprehensive e-commerce platform. The platform was designed to reach a wider audience and provide a seamless shopping experience for customers, opening the company up to a never-before-seen level of growth and success.

Operating as my LLC, Recursion Tech, and with the help of my partner, Duck Software, we created a sleek web frontend, a robust backend, and a seamless iOS application. This platform enabled customers to create an account, browse flavors, manage order for pick-up or delivery, use promo codes, and pay for their orders using Stripe CLI. The platform also included administrative features such as managing orders, updating product inventory, viewing sales reports, and automating emails/order fulfillment.

Throughout the development process, I worked closely with the RFK team to ensure that the platform met their unique needs and requirements. I also provided training and support to ensure that the team could manage the platform effectively after launch. The platform had a total of 8 successful deployments and was officially released to the public on November 1, 2023. During its lifetime, the platform server 100+ customers, processed over 300 orders, and generated over $5,000 in revenue for RFK.

The project was divided into key phases, each building upon the last to ensure a smooth transition from concept to reality.

My involvement began with understanding Remnant Farm's vision and the unique challenges they faced. During our first meeting, I collected information about their current processes, customer base, and goals for the platform. From there, I created a spreadsheet of requirements and desired features for the platform. The team and I worked together to prioritize these features and create a project timeline. I went with the MoSCoW method to prioritize features and mapped them to an estimated release version for the platform (as seen below).

Once we had an understanding of the features, we wrote down some of the technologies that we could use to implement our design. The diagram below shows how a customer can go from viewing an item, to placing it in the cart, and checking out. The user-journies were mapped out and gave us a better understanding of what pages we would need for a successful platform.

By the end of this stage, we had a clear understanding of the platform's requirements, a detailed project plan, and a prototype of the platform's design. We were able to make a powerpoint presentation with the summary of work and describe the final product we were going to deliver to them. We were ready to move on to the next phase: architecture and development.

Given the requirements, we listed down the possible technologies that we could use to implement the platform:

• Web Frontend: AngularJS and TailwindCSS
• iOS Frontend: Swift and SwiftUI
• Backend: GCP, Firebase, Firestore, Cloud Functions (expressJS API)
• Payment Processing, Shipping, and Inventory: Stripe CLI

We chose these tools based on our experience with them and their ability to meet the project's requirements quickly. We also considered the ease of integration and maintenance, as well as the cost of each tool. The final and most important part of our technological requirements, were ensuring that our platform was robust, secure, and scalable.

Using the priotized feature list, we connected the components that we needed to give us a high level architecture diagram:

A large piece to getting started was configuring all of the moving parts. I created 2 new firebase projects, 1 for the development environment and 1 for production. I went with separated GitHub repos for each components due to the complexity of this problem (as opposed to my usual mono-repo approach). For the frontend, I created a new Angular project with typescript and TailwindCSS. The frontend repo used GitHub actions to automatically deploy to Firebase hosting (depending on if a change was pushed to the dev or prod branch). The backend repo was configured to automatically deploy Cloud Functions to Firebase for its respective environment. Payment processed was also easy to configure using Firestore's Stripe extension. The iOS application was built using Swift and SwiftUI, and was deployed to the App Store using Xcode.

Firestore was not my first choice database, I would rather go with the relational approach, but due to time-constraints and the ability to sync the inventory with stripe, we used Firestore. The diagram below shows the initial database schema that we used for the platform to try and keep things organized.

As with any development project, our design went through many iterations and we were having regular meetings to review feedback from the RFK team. For Angular, I wanted to make use of lazy-loading and establish a robust module structure from the start of development. I created a module for each collection of related pages: authentication, user, checkout, and admin (as shown in the diagram below).

Another important part of the development process was the user interface. I wanted to make sure the platform was easy to use, visually appealing, and uniform across the iOS and web app. The style guide below shows a snippet of the color palette, typography, and component styles that we used throughout the platform. RFK also provided us with some of their commonly used branding images.

For documenting cloud functions, we used this document to track the development process.

The final and most important part of the development process was testing. We used a combination of manual and automated testing to ensure that the platform was bug-free and met the requirements. For the frontend, I used Angular's built-in testing tools to write unit tests for each component and Cypress for end-to-end testing. For the backend, I used Postman to test the API endpoints.

As the official release date was about a month and a half out, we had to make sure that we were on track to meet our deadline. We had weekly meetings with the RFK team to review progress, get feedback, and make any necessary changes. We were on a cadence of 1 release per every 2 weeks. To collect feedback from the RFK team, we used Google Forms to create surveys that asked questions about the platform's usability, performance, design, and track bugs. It was also at this stage, that we optimized the web app for SEO, responsive design, accessability, and Google Lighthouse performance.

The final form of our application can be summarized using our end-to-end data pipeline diagram:

On November 1, 2023, we officially launched the platform to the public. The RFK team notified their customer base, posted on social media, and updated the website to announce the launch. Using Firebase Analytics, we were able to track exactly how many users visited the site, how many orders were placed, and how much revenue was generated. The development team and I were up all night ensuring that the platform was running smoothly and that any issues were resolved quickly. I was especially worried about our automated email platform and ensuring that the order fulfillment process was working correctly, and all went according to plan!

Here are a couple of the technical skills that I learned or improved upon during this project:

• StripeCLI: I had never used StripeCLI before, so I had to learn how to use it to process payments and manage orders. It was also very convienient that it had direct integration with Firestore.
• Google Maps API: I had used Google Maps API before, but never to the extent that I did on this project. I learned how to use the API to calculate the distance from zipcodes to determine if a customer was eligible for delivery or not. This was a key feature for the platform and I'm excited to use this API again.
• Cloud Functions: I had used Cloud Functions before, but never to the extent that I did on this project. I learned how to use Cloud Functions to automate emails, update inventory, and manage orders. I also learned how to use Firestore triggers to update the database in real-time.

Here are a couple of the soft skills that I learned or improved upon during this project:

• Contracting: I learned how to operate as an LLC and refine my business process to ensure seamless and timely delivery of the platform.
• Project Management: I learned how to manage the RFK team's expectations and communicate effectively with them. I learned how to set realistic deadlines, provide regular updates, and handle feedback constructively.
• Team Management: I learned how to work with a team of developers, designers, and testers to ensure that the platform was delivered on time and met the requirements. I learned how to delegate tasks, provide support, and resolve conflicts. Additionally, I worked with varying levels of stakeholders within the RFK team to ensure that the platform met their unique needs and requirements.