This monorepo is a playground for all of my React
, Next.js
, Typescript
& Solidity
projects.
I’ve spent considerable time developing apps and dApps, both for personal side projects and companies I've worked with. Along the way, I realized the need for a simple, fully-configured, and customizable monorepo that would allow me to quickly iterate on new projects.
This monorepo is organized into four main workspaces: apps
, contracts
, packages
, & configs
. Each workspace serves a distinct purpose, making the overall structure intuitive and easy to navigate.
-
The
apps
workspace contains a collection of projects built withReact
,Next.js
, &TypeScript
, ranging from blockchain explorers to static websites. -
The
contracts
workspace includes a set of smart-contracts built and developed withSolidity
&Foundry
. -
The
packages
workspace houses reusable libraries, providing essential UI components, cryptographic utilities, and TypeScript helpers. -
The
configs
workspace offers base configurations for TypeScript projects, ensuring consistent setups and best practices across all applications.
This architecture is designed to promote modularity, reuse, and ease of development, enabling efficient project iteration and scalability.
Within the apps
workspace, you'll find a curated collection of apps I've developed over the years in React
, Next.js
& Typescript
. While not exhaustive, this list covers a variety of topics, including blockchain
, 3D
, ai
projects, and basic static
applications, to name just a few.
Blockchain Explorer for the
Dusk
ecosystem.
Statistics Explorer for the
Omni
ecosystem.
Simple Swap component for
Deblock-Hq
.
A website talking a little bit about me.
A basic boilerplate to quickly bootstrap a new app.
The contracts
workspace is dedicated to housing a variety of smart contracts
that have been developed using Solidity
and deployed
/tested
with Foundry
. This workspace serves as a central directory for managing and organizing solidity
code, providing a foundation for decentralized applications and blockchain-based solutions. It streamlines development and ensures all contract-related files are accessible for efficient testing
, deployment
, maintenance
& usability
for the apps
workspace.
...
The packages
workspace contains a set of reusable libraries
that provide core functionality across all apps within the monorepo. These packages include @web-playground/ui
for building consistent user interfaces, @web-playground/crypto
for handling cryptographic operations, and @web-playground/utils
, which offers a collection of utility functions and types for efficient TypeScript development.
This package is primarily built on top of the shadcn
framework, with several additional utilities that I have incorporated based on their frequent use in various projects. It is intended to function as a foundational ui
package for the app
workspace, offering essential components
and tools to streamline the development process. By integrating these commonly used utilities, the package ensures consistency
and efficiency
, providing a reliable base
for building user interfaces across different applications within the monorepo.
This package contains a collection of essential functions
and type
utilities specifically designed for use in cryptographic
software development. These utilities play a critical role in simplifying various cryptographic
operations and ensuring the secure implementation of algorithms
and data transformation
. By providing reusable components, this package enhances the efficiency
and reliability of crypto-related
projects, allowing developers to focus on building secure applications without having to recreate foundational
tools from scratch.
This package contains a variety of utility functions
and types
that are useful for anything related to TypeScript
development. It offers a little bit of everything, making it a versatile resource for handling different tasks and challenges commonly encountered when working with TypeScript. Whether looking for helpful functions or reusable types, this package serves as a handy toolkit
to simplify and streamline the development process.
The packages
workspace contains a set of reusable configs
that provide core functionality across all apps within the monorepo.
This package provides a comprehensive set of base configurations
essential for developing a TypeScript
application. It includes general settings
, tools
and file configuration
to streamline the setup process, ensuring a solid and similar foundation to build upon. By offering pre-configured options tailored to common development needs, this package simplifies project initialization and promotes best practices, allowing focusing on the core functionality of an app.