A monorepo architecture starter project for building framework agnostic applications with a feature rich development workspaces configuration, using the latest releases of pnpm for package management, Turborepo build system for monorepos. Includes Astro for framework agnostic, content driven apps, Solid framework for interactive web apps with Vinxi Bundler for optimized builds. A Tailwind CSS Design System for core styles and ui primitives. Including Biome configured with Ultracite and additional configs for code quality controls and simple AI integration.
This starter project leverages Turborepo to manage a monorepo structure that combines Astro framework agnostic architecture with shared component libraries and configuration packages. It provides a robust setup for modern web development with flexible app experiences based on proven use cases and design patterns.
- Prioritize developer experience by focusing on architecture, optimization, scalability, and AI integration.
- Minimize black box abstractions by giving full control of the entire source code to the developer.
- Rely only on field third party libraries, supported by flexible options for ejecting and replacing dependencies.
- Support open source and collaborate with existing libraries and frameworks, striving to establish universal patterns.
- Astro Framework Agnostic Apps: Flexible app experiences based on proven use cases and design patterns.
- HTML/CSS Driven Design System: Modular architecture with framework agnostic principles, emphasizing good UI/UX patterns with pure HTML/CSS solutions and modifier wrappers for external libraries.
- Tailwind Integration: Thematic styles and functional CSS utilities and components.
- Reusable UI Primitives: Low-level UI components built for easy integration and migration DX.
- MDX Data Transformations and Rendering: Transformation of MDX data into pages using Astro (for static sites) and Solid (for web app functionality) with low-level tools for developing web pages and app content in markdown, allowing scaling into remote content stored in databases, CMS, or storage.
- Solid.js App Integrations: Reusable Solid.js integrations using Solid Start and/or Astro Solid framework patterns, enabling seamless sharing of components, hooks, and utilities across both static and dynamic applications. This approach supports building interactive islands, hybrid rendering, and consistent state management, making it easy to compose Solid.js features in Astro projects or standalone Solid Start apps.
- Setup nested biome configs for packages and apps that need to override base biome/ultracite options (i.e. Tailwind, Solid, Astro, etc).
- Add react and next ui packages and configs with example react and next app using shared design system styles.
- Setup turbo/generators configs and templates for various packages and apps, with tempaltes and configs to generate internal modules and files common to these different packages and apps.
- Setup AI Agent context rules to support multiple AI Agent workflows (currently only Cursor is supported).
- Setup configs to support multiple IDE's (currently only VSCode is supported).
astro: Astro Content-driven web framework.biome: Biome Fast code formatting and linting tools.solid: Solid Solid Start web app framework.tailwind: TailwindCSS Functional CSS utilities and theme tokens.ultracite: Ultracite AI ready code formatter (uses biome).vinxi: Vinxi Bundler** for efficient bundling.
LG Gnosys includes the following workspaces:
astro-web: an Astro Build web app with Solid Framework integrationnext-web: WIPsolid-web: a Solid Start web app
@configs/biome: common Biome v2 configurations@configs/env: common Zod app and infrastructure environment schemas.@configs/typescript: common Typescript v5 configurations
@ds/core: required package for using other Design System packages@ds/primitives: optional package for primitive Design System styles to enhance core styles@ds/themes: optional package for using various Design System theme presets@ds/ui: component styles to integrate UI libraries with Design System styles
@lib/ai: WIP@lib/analytics: WIP@lib/mdx: WIP
@services/airtable: WIP@services/printify: WIP@services/stripe: WIP
@ui/astro: WIP@ui/data-start: WIP@ui/react: WIP@ui/solid: a stub Solid component library shared bySolidandAstro/Solidapplications
@utils/app: common utils for converting app environment variables into metadata@utils/format: common formatting utils for data, dates, etc...@utils/ui: common utils used by UI components
To bootstrap your new turborepo using this starter, simply run:
npx create-turbo@latest --example "https://github.com/luckgrid/lg-gnosys"To install all dependencie, the the following command:
cd lg-gnosys
pnpm iTo build all apps and packages, run the following command:
cd lg-gnosys
pnpm run buildTo develop all apps and packages, run the following command:
cd lg-gnosys
pnpm run devTip
Vercel Remote Cache is free for all plans. Get started today at vercel.com.
Turborepo can use a technique known as Remote Caching to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines.
By default, Turborepo will cache locally. To enable Remote Caching you will need an account with Vercel. If you don't have an account you can create one, then enter the following commands:
cd lg-gnosys
npx turbo loginThis will authenticate the Turborepo CLI with your Vercel account.
Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your Turborepo:
npx turbo linkLearn more about the power of Turborepo:
LG Gnosys is currently licensed under the MIT License.