GREEN stack

git merge with/green-stack

Plugin features when merged

Sets you up with the GREEN stack:

• Apply the changes from the with/portability-pattterns plugin branch (#3 plugin: Portability Patterns)
• Apply the changes from the with/nativewind plugin branch (#1 plugin: Nativewind)
• Apply the changes from the with/turborepo plugin branch (#8 plugin: Turborepo)
• Apply the changes from the with/graphql-server-apollo plugin branch (#5 plugin: Graphql Apollo)
• Apply the changes from the with/react-query plugin branch (#6 plugin: React Query)
• Fleshes out the .example.env files and adds notes for how to manage them Locally, or in Expo & Vercel
• Creates the @green-stack/core package and moves all essential core files there

Schemas as Single Sources of Truth

• Adds zod as a way to build schemas that serve as single sources of truth
• createDataBridge() to bundle input & output schemas, resolver & API paths, reusable on server ↔️ client
• bridgedFetcher() helper to build typed fetcher fn from a DataBridge created by createDataBridge()
• createResolver() helper to build flexible zod & DataBridge powered resolvers for REST & GraphQL
• schemaPlugin() helper to build your own schema powered helpers / utils / automations
• generateSchema() helper to build the executable graphql schema automatically from resolvers

Designed for Copy-paste

• @app/registries workspace to keep track of generated files and support a new driver system
• check-workspaces script to see if copy-pasted package/feature workspaces are missing stuff
• link-routes script to automatically link routes from workspaces in expo & next.js
• collect-resolvers script to collect all resolvers across workspaces in resolvers.generated.ts
• collect-drivers script to keep track of all drivers defined under .../{workspace}/drivers/...
• collect-generators script to register all generators from across workspaces
• npx turbo gen workspace generator to create new package or feature workspaces

Universal App helpers and improvements

• Fleshes out utils in @green-stack/core with helpers for strings, arrays, objects, numbers, scripts, json, …
• Improves Link component with type hints for known routes, injecting params through props
• useLayoutInfo() hook for measuring Views or other layout elements in Expo & Next.js

When upgrading to FullProduct.dev ⚡️

Codegen to create new features easily - with/codegen

• npx turbo gen schema generator to create new Schema as Single Sources of Truth
• npx turbo gen resolver generator to create new Resolvers and/from input & output schemas
• npx turbo gen route generator to create new Universal Routes and Screens

Automagic Docgen - with/automatic-docs

• document-components script to build interactive Nextra docs from React components & prop examples
• Allows you to flesh out generated docs by adding a {Component}.docs.mdx file next to it
• Storybook-like controls behavior to play around with inside Nextra & built with Next.js

Icon management made easy - with/icons

• collect-icons script to convert .svg icons across workspaces to components & list them for easy use
• <UniversalIcon/> component and SVG icons examples
• registerIconRenderer() util to integrate with icon libraries

Even more plugins to pick and choose 🚀

Recommended presets:

• with/recommended-nosql merges all recommended plugin branches for NoSQL setups
• with/recommended-sql merges all recommended plugin branches for SQL setups

Next to with/supabase or with/mongodb, also merges with/stripe-payments + with/clerk-auth

Database plugin branches

• with/mongodb to create Mongoose DB models from Zod schemas as Single Source of Truth
• with/prisma to create Prisma DB tables from Zod schemas as Single Source of Truth
• with/supabase to use Supabase for the DB layer + other handy serverless utils
• with/drizzle-orm to use Drizzle for the DB layer + other handy DB utils

Universal Auth plugin branches

• with/clerk-auth to add Authentication for Web & Mobile to your app with Clerk

Universal Payment plugin branches

• with/stripe-payments to add Payments for Web & Mobile to your app with Stripe
• with/lemonsqueezy-payments to add Payments for for Web & Mobile with Lemon Squeezy

Disclaimer