## Resource: About The Wix CLI ## Article: About The Wix CLI ## Article Link: https://dev.wix.com/docs/wix-cli/guides/about-the-wix-cli ## Article Content: # About the Wix CLI The Wix CLI is the command-line tool for creating, developing, and deploying both [Wix apps](https://dev.wix.com/docs/build-apps/get-started/overview/about-wix-apps) and [Wix-managed headless projects](https://dev.wix.com/docs/go-headless/get-started/choose-your-development-path). For Wix site development, see [Git Integration & Wix CLI for Sites](https://dev.wix.com/docs/develop-websites/articles/workspace-tools/developer-tools/git-integration-wix-cli-for-sites/about-git-integration-wix-cli-for-sites) instead. The CLI generates a complete project structure and handles initial setup and configuration. It also provides commands to generate extensions and manage your project throughout development. New CLI projects include [Wix skills](https://dev.wix.com/docs/api-reference/articles/ai-tools/about-wix-skills), so AI tools can perform CLI tasks for you. This lets you focus on building the unique features of your project. To get started: - [Quick Start a Wix CLI App](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/get-started/quick-start-a-wix-cli-app) - [Quick Start a Wix CLI Headless Project](https://dev.wix.com/docs/go-headless/wix-managed-headless/get-started/quick-start-with-the-wix-cli) For a walkthrough of building an app with the CLI, watch the video tutorial:
> **Note:** Headless projects created with the CLI are [Wix-managed headless](https://dev.wix.com/docs/go-headless/get-started/choose-your-development-path) projects. This is the recommended path for new headless projects. ## Project structure and Astro The CLI uses a standardized project structure based on the Astro web framework. Astro is a JavaScript-based web framework designed for building fast, content-focused websites. The CLI also supports backend development with [HTTP endpoints](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/supported-extensions/backend/http-endpoints/about-http-endpoints). ### Why Astro? The Wix CLI is built on Astro because it offers several key advantages for modern web development: - **Performance-focused architecture:** Astro focuses on making websites that load quickly and perform well, which is especially important for content-heavy sites. It uses server-side rendering by default, making it easier to build high-performing websites without the added complexity of client-side rendering. - **Flexibility and simplicity:** Astro gives you flexibility in how you build. You can use plain HTML, CSS, and vanilla JavaScript for most of your project, and only add framework components (React, Vue, Svelte) where you need them. This means you import only what you need rather than loading a full framework for the entire site. - **Partial hydration:** Astro uses partial hydration, which means it strips out unused JavaScript and sends only what the client actually needs. This results in smaller bundle sizes and faster page loads. - **Framework agnostic:** Unlike frameworks that lock you into a specific technology, Astro lets you mix and match. You can use React components in one part of your site, Vue in another, or stick with plain HTML throughout. This flexibility makes it easier to adopt new technologies or work with existing codebases. - **Simplified development model:** Astro eliminates framework-specific complexities like hooks, stale closures, and observables. This makes development more approachable, especially for developers who prefer working with standard web technologies. - **No new language to learn:** Everything in Astro is still written in HTML, CSS, and JavaScript (or TypeScript if you prefer). There's no proprietary templating language or significant learning curve. ## Development capabilities The CLI allows you to: - Generate [extensions](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/supported-extensions/about-extensions-in-the-wix-cli) to quickly add functionality to your project, such as custom dashboard pages and event handlers. - Call [Wix JavaScript SDK](https://dev.wix.com/docs/sdk) methods directly, as the CLI handles token management and authentication for you, eliminating the need to set up a [Wix Client](https://dev.wix.com/docs/sdk/articles/set-up-a-client/about-the-wix-client). - [Test projects](https://dev.wix.com/docs/wix-cli/guides/about-the-wix-cli#develop-and-test-projects) locally with hot reloading. - Create shareable [preview versions](https://dev.wix.com/docs/wix-cli/command-reference/project-commands/preview) of your project for collaboration. The CLI also provides full TypeScript support with IntelliSense, offering autocomplete suggestions and validation as you code. ## Wix skills New CLI projects include Wix skills by default. Wix skills enhance your AI workflow by providing instructions and context that supported AI tools use to develop, deploy, and validate a CLI project. ## Wix app support The CLI generates the complete project structure needed for [Wix app](https://dev.wix.com/docs/build-apps/get-started/overview/about-wix-apps) development. You can add extensions built with TypeScript, React components, and the Wix Design System, providing a native Wix look and feel. ### Development sites When developing apps, you can test your functionality using development sites. These are premium Wix sites that you can use for app testing. You can maintain up to 5 development sites simultaneously for testing different aspects of your app. ## Headless project support The CLI streamlines [Wix Headless](https://dev.wix.com/docs/go-headless/get-started/about-wix-headless) project development, so you can work directly with Wix's business solutions and dashboard, and build a custom frontend using any technology supported by Astro. When you create a headless project, the CLI generates the code for an Astro site so you can begin developing immediately. You can also open and develop projects you started with [Wix Vibe](https://dev.wix.com/docs/go-headless/wix-vibe/about-wix-vibe), the AI-driven UI for Wix-managed Headless, locally with the CLI. If you have an existing Astro project, you can [link it to Wix](https://dev.wix.com/docs/wix-cli/guides/get-started/link-an-existing-astro-project-to-wix) instead of creating a new one. ### Project's private app When you create a headless project, the CLI sets up a private app that allows you to add features to your project through [extensions](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/supported-extensions/about-extensions-in-the-wix-cli). The app also acts as the [OAuth app](https://dev.wix.com/docs/go-headless/self-managed-headless/authentication/about-authentication) that handles authentication for your project's frontend. This private app can't be shared with others, it's only for use in your headless project. ### Custom domain support You can use a [custom domain](https://www.wix.com/my-account/site-selector/?buttonText=Select%20Site&title=Select%20a%20Site&autoSelectOnSingleSite=true&actionUrl=https:%2F%2Fwww.wix.com%2Fdashboard%2F%7B%7BmetaSiteId%7D%7D%2Fadd-domain) for headless frontends to provide a branded experience for users. ## Flexible file system The CLI uses a [standardized project structure](https://dev.wix.com/docs/wix-cli/guides/project-structure/project-structure) based on Astro, while giving you the flexibility to organize your extensions into custom folders within the `src/` directory. This allows you to structure your code in a way that works best for your project. ## Environment variables The CLI provides built-in support for [environment variables](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/project-development/environment-variables/about-environment-variables-in-the-cli), allowing you to store configuration values and secrets outside of your code. You can define type-safe environment variables with different security levels, which makes your applications more secure and portable. ## Develop and test projects ::::tabs :::Apps Wix apps aren't standalone web apps. They need to be installed on a Wix site to run. When you create your CLI app, you're prompted to choose or create a development site. As you work locally with the CLI, you can use the CLI to open the different parts of your app on the development site in your browser. This allows you to see how your app will behave when installed on a real Wix site. To do so, run the [`dev`](https://dev.wix.com/docs/wix-cli/command-reference/project-commands/dev) command and select the part of your app to view. This opens a local development environment in your browser. This environment is set up for hot reloading, so any changes you make to your code are immediately reflected in the browser. Throughout the development process, you may wish to use multiple development sites to test your app in different scenarios. The `dev` command allows you to change the development site associated with an app at any time. ::: :::Headless As you work locally with the CLI, you can use the CLI to open the local version of your project's site or dashboard in your browser. To do so, run the [`dev`](https://dev.wix.com/docs/wix-cli/command-reference/project-commands/dev) command and select the part of your project to view. This opens a local development environment in your browser. This environment is set up for hot reloading, so any changes you make to your code are immediately reflected in the browser. ::: :::: ## Build, preview, and release projects After developing and testing your Wix CLI project locally, you can build it, create shareable previews, and take it to production. For more information, see [Build and Deploy a Project with the Wix CLI](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/project-development/build-and-deploy-a-project-with-the-wix-cli). ## CI/CD workflows The Wix CLI can be integrated into any CI/CD pipeline, allowing you to automate tasks such as testing your CLI projects. For example, you can create a [GitHub Actions](https://github.com/features/actions) workflow that runs on every pull request and performs unit tests for your CLI project. For more information about unit testing, see [Write Unit Tests for a Wix CLI Project](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/project-development/test-and-monitor/write-unit-tests-for-a-wix-cli-project). ## Keep the CLI up to date We're actively working on improving the CLI and adding features, which means we will be releasing new versions. It's important to keep your CLI up to date to benefit from the latest improvements and features. You can check the [changelog](https://dev.wix.com/changelog) for updates to the CLI. You can check which version of the CLI you have using the following command: ```bash npm list @wix/cli ``` You can upgrade to the latest version of the CLI using the following command: ```bash npm i --save-dev @wix/cli@latest ``` > **Note:** If the latest version of the CLI includes a new command, you'll need to [add the new command to your `package.json` file](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/about-the-wix-cli). ## Hosting and infrastructure The CLI provides a serverless hosting solution where scaling, resource allocation, and maintenance are fully managed, so you don't have to worry about infrastructure. The main features include: - **Static sites hosting:** The hosting environment is powered by a global CDN that ensures fast and reliable content delivery to users. - **Serverless architecture:** Run full-stack apps without managing servers. Scaling and resource management are handled automatically by Wix. - **Automatic SSL certificates:** SSL certificates are automatically provisioned and renewed, ensuring secure connections. - **Session management middleware:** A middleware manages session tokens and cookies for the current site visitor, allowing you to use stateful session APIs like e-commerce carts, site visitor authentication, and more. ## Use these docs with AI tools Wix developer documentation is available in machine-readable formats for use with AI coding assistants and LLMs: - **llms.txt index:** Browse a structured index of all documentation at [dev.wix.com/docs/llms.txt](https://dev.wix.com/docs/llms.txt). - **Markdown format:** Append `.md` to any documentation page URL to retrieve a Markdown version of that page. - **Page menu:** Use the "Ask Assistant" dropdown on any documentation page to copy the page as Markdown or get a direct link to the Markdown version. ## Legacy Wix CLI for Apps The Wix CLI replaces the [Legacy Wix CLI for Apps](https://dev.wix.com/docs/wix-cli/legacy-clis/legacy-wix-cli-for-apps/about-the-legacy-wix-cli-for-apps), and also supports creating [Wix-managed headless projects](https://dev.wix.com/docs/go-headless/get-started/choose-your-development-path). The Legacy Wix CLI for Apps no longer receives updates or feature additions. Use the legacy reference only if you're maintaining an existing app. ## Get started - [Quick Start an App](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-cli/get-started/quick-start-a-wix-cli-app) - [Quick Start a Headless Project](https://dev.wix.com/docs/go-headless/wix-managed-headless/get-started/quick-start-with-the-wix-cli)