Projects.build

Goal

Primary: Build experience, methodologies and opinions around web application engineering.
Secondary: Experiment with different web technologies, web development frameworks, and languages.

 

Approach

Develop a web application to manage and rate project builds with multiple web technologies. Through solving the same problem with different approaches discover where boundaries of application concerns exist for abstraction to shareable logic, preferred architecture patterns for code organization, and management of a largely self dependent code base.

Each app implementation purposefully use a bare minimum set of dependencies to focus the app engineering on using the primitives supplied with the libraries, frameworks, and languages plus limit external dependency decision making. This is for the purpose of experimenting with these primitives as building blocks and understanding where it makes sense to favor abstraction to an external dependency.

This repo additionally over-engineers overall code organization, function & type utilities, and code logic abstractions. This is for the purpose of experimenting with development in a monorepo and logic co-location patterns, advanced JavaScript/TypeScript capabilities and patterns, and code architecture patterns.

 

Repo Contents

This monorepo contains client rendered JS apps, api endpoint server apps, server rendered apps, and fullstack JS framework apps. Each app is a component (i.e. client SPA or api endpoints) for composition into a fullstack web application or a fullstack web application itself. Each fullstack application implementation provides the same functionality, to create and manage a list of project builds.

• The apps directory contains the client, api, server, and fullstack app implementations (e.g. React, Remix, etc.).

• The packages directory mostly contains logic that is shared across apps. It is primarily split between the library and shared packages. The library package contains general code that is not application specific, and the shared package contains shareable code that is application context specific.

• The configs directory contains shared base configurations for tools or dependencies (e.g. eslint, typescript, etc).

 

Apps

• Client React

• API Node + Hono

• Server Go

 

Packages

• API Json Server
• DB Schema Drizzle
• Library
• Shared

 

Configs

• Typescript

 

Resources

• Heroicons
• Reshot Free Icons & Illustrations

 

Notes/References

• Monorepos with Pnpm
• TS Paths in a Monorepo
• Data Handling