Virra Marketing

Read more about the design of this project.

This project was my first production web app—a new marketing website for Virra Marketing and a web application to test new software services.

Stack

Runtime: Node.js

Web framework: Next.js

Database: Firestore

Payments: Stripe

CMS: Sanity

Hosting: Vercel

Stack decisions

Virra had already integrated with Firestore as a database. Next.js seemed a good option as a frontend framework, with its file-based routing, API routes, wonderful documentation, and large backing. Although admittedly, at the time I had not the comparative knowledge to articulate what the tradeoffs of Next.js are. Vercel, the company behind Next.js, was then the clear choice as a hosting provider.

Next.js leans towards client-side over server-side. The documentation goes so far to explicitly recommend fetching data client side. Vercel maintains a “React Hooks for Data Fetching” library called SWR for client side fetching.

Next.js provides an integrated file-based routing for creating API routes. Behind the scenes, Vercel utilizes AWS Lambda functions to handle the API routes.

Lessons

As the first production web app, I learned a great deal about web applications with this project. I dove into React and Node, with Next.js and Firestore as a helpful buffer in “serverless” architecture.

Learning about the architecture behind Next.js (AWS Lambda Functions)