{"id":16610,"library":"create-varity-app","title":"Create Varity App","description":"Create Varity App is a command-line interface (CLI) tool designed to bootstrap production-ready web applications with integrated authentication, database, storage, and payment capabilities. Functioning as an 'all-in-one' platform, Varity aims to significantly reduce development and deployment time, boasting '60-second deploys' and claiming 60-80% cost savings compared to traditional cloud setups like AWS. It achieves this through a 'zero-configuration' approach for core services, leveraging internal packages such as `@varity-labs/sdk` for backend interactions and `@varity-labs/ui-kit` for frontend components. The package is currently in a beta state, version `2.0.0-beta.22`, indicating active development and a rapid release cadence for new features and improvements. It targets developers building SaaS products, dashboards, or any web application requiring robust foundational features without extensive manual setup. Key differentiators include its unified platform experience, emphasis on developer experience with React and TypeScript, and a marketplace for monetization.","status":"active","version":"2.0.0-beta.22","language":"javascript","source_language":"en","source_url":"https://github.com/varity-labs/varity-sdk","tags":["javascript","varity","create-app","saas","dashboard","nextjs","starter","template","react"],"install":[{"cmd":"npm install create-varity-app","lang":"bash","label":"npm"},{"cmd":"yarn add create-varity-app","lang":"bash","label":"yarn"},{"cmd":"pnpm add create-varity-app","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core SDK for database, storage, and other backend interactions within Varity applications.","package":"@varity-labs/sdk","optional":false},{"reason":"React component library for authentication, payments, and account management within Varity applications.","package":"@varity-labs/ui-kit","optional":false}],"imports":[{"note":"`create-varity-app` is primarily a CLI tool; its programmatic imports are not intended for direct use. Applications are scaffolded using `npx`.","wrong":"import createVarityApp from 'create-varity-app'","symbol":"create-varity-app","correct":"npx create-varity-app my-app"},{"note":"The database instance is exposed as `db` from the core SDK, not a more generic `database`.","wrong":"import { database } from '@varity-labs/sdk'","symbol":"db","correct":"import { db } from '@varity-labs/sdk'"},{"note":"Authentication context for React components is provided by `AuthProvider` from the UI kit.","wrong":"import { Auth } from '@varity-labs/ui-kit'","symbol":"AuthProvider","correct":"import { AuthProvider } from '@varity-labs/ui-kit'"},{"note":"Pre-built login component for UI integration.","wrong":"import { ButtonLogin } from '@varity-labs/ui-kit'","symbol":"LoginButton","correct":"import { LoginButton } from '@varity-labs/ui-kit'"}],"quickstart":{"code":"npx create-varity-app my-awesome-app\ncd my-awesome-app\nnpm install\nnpm run dev\n\n// Example of using SDK within the created app (e.g., in a React component or API route):\nimport { db } from '@varity-labs/sdk';\nimport { AuthProvider, LoginButton } from '@varity-labs/ui-kit';\n\nfunction MyAppComponent() {\n  const handleAddPost = async () => {\n    const posts = db.collection('posts');\n    const newPost = await posts.add({\n      title: 'My First Varity Post',\n      content: 'Hello, Varity world!',\n      authorId: 'user-123' // Replace with actual user ID from auth context\n    });\n    console.log('Added post:', newPost);\n  };\n\n  return (\n    <AuthProvider>\n      <div>\n        <h1>Welcome to Varity!</h1>\n        <LoginButton />\n        <button onClick={handleAddPost}>Add Example Post</button>\n      </div>\n    </AuthProvider>\n  );\n}","lang":"typescript","description":"Initializes a new Varity application, installs dependencies, starts the development server, and demonstrates basic database interaction and UI authentication components within the generated project structure."},"warnings":[{"fix":"Regularly consult the official Varity documentation and GitHub repository for updates and potential migration guides between beta releases. Pin dependencies to specific beta versions to ensure stability.","message":"The `create-varity-app` package and the underlying Varity platform are currently in a `2.0.0-beta.22` state. This indicates active development where APIs, features, and stability might change without strict adherence to semantic versioning for non-major releases, potentially leading to breaking changes between beta versions. Use in production with caution.","severity":"gotcha","affected_versions":">=2.0.0-beta.0"},{"fix":"Verify the current status of payments functionality in the latest Varity documentation before building critical payment-dependent features. Plan for alternative payment integrations if Varity's built-in solution is not yet stable or feature-complete for your needs.","message":"While Varity is advertised as an all-in-one platform including payments, the documentation explicitly states that 'Payments (coming soon)' or that the 'PaymentWidget' is for 'post-beta' availability. This means the payments functionality may not be fully implemented or production-ready despite being part of the SDK/UI kit. This could lead to unexpected roadblocks for apps requiring immediate payment processing.","severity":"gotcha","affected_versions":">=2.0.0-beta.0"},{"fix":"Be clear about which CLI tool is appropriate for each task. `create-varity-app` is for scaffolding new projects, while `varitykit` handles deployment and potentially other platform-level operations. Ensure Python and its package manager (`pip`) are correctly set up if using `varitykit`.","message":"The Varity ecosystem includes both a JavaScript `create-varity-app` (via `npx`) and a Python `varitykit` CLI (via `pip`). Mixing these CLIs or misunderstanding their respective roles could lead to confusion or environment setup issues, especially regarding deployment commands (`varitykit deploy`).","severity":"gotcha","affected_versions":">=2.0.0-beta.0"}],"env_vars":null,"last_verified":"2026-04-22T00:00:00.000Z","next_check":"2026-07-21T00:00:00.000Z","problems":[{"fix":"Always use `npx create-varity-app my-app` to execute the package, which downloads and runs the latest version without global installation.","cause":"The `create-varity-app` package is typically executed via `npx` and is not installed globally or directly in the system's PATH.","error":"command not found: create-varity-app"},{"fix":"Ensure the application is running within the Varity-generated project structure and that all necessary environment variables or configurations are in place as expected by the SDK's 'zero-config' setup. Check Varity documentation for explicit initialization steps if running outside a typical Varity app.","cause":"The Varity SDK's database client (`db`) might not be initialized correctly, or the application is running outside the Varity environment where it expects automatic configuration.","error":"TypeError: Cannot read properties of undefined (reading 'collection') when using `db`"},{"fix":"Verify that your Varity project is correctly configured on the Varity platform. Check console logs for network errors or specific authentication error messages. Ensure that the `AuthProvider` wraps your application's components as per documentation.","cause":"Authentication issues in a Varity app can stem from incorrect Varity platform configuration (e.g., app ID, API keys), network issues preventing communication with Varity auth services, or misconfiguration of social login providers.","error":"Failed to authenticate / Login fails unexpectedly with AuthProvider or LoginButton"}],"ecosystem":"npm"}