### Install and Run Example Action Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/example-action-plugin/Readme.md

Clone the repository, navigate to the plugin directory, install dependencies, and start the development server. Then, configure Builder to load the plugin from localhost.

```bash
git clone git@github.com:BuilderIO/builder.git
cd builder/plugins/example-action-plugin/
npm install
npm run start
```

--------------------------------

### Clone and Run React Example

Source: https://github.com/builderio/builder/blob/main/examples/react/README.md

Clone the Builder.io repository, navigate to the React example directory, install dependencies, and start the development server.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/react
npm install
npm start
```

--------------------------------

### Install Example App Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/example-app-campaign-builder/README.md

Clone the repository and install dependencies for the example simple app plugin.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/example-simple-app
npm install
```

--------------------------------

### Install Example Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/rich-text/README.md

Commands to clone the example plugin, copy it for your own use, and install its dependencies.

```bash
git clone https://github.com/BuilderIO/builder.git
cp -r plugins/rich-text plugins/your-plugin-name
cd plugins/your-plugin-name
npm install
```

--------------------------------

### Install and Run Site

Source: https://github.com/builderio/builder/blob/main/examples/embed-starter-kit/Readme.md

Navigate to the site directory, install dependencies, and start the development server.

```bash
cd site
npm install
npm run dev
```

--------------------------------

### Clone and Run Builder.io Vanilla JS Example

Source: https://github.com/builderio/builder/blob/main/examples/plain-js/README.md

Clone the repository, navigate to the example directory, install dependencies, and start the development server to run the vanilla JavaScript example locally.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/plain-js
npm install
npm start
```

--------------------------------

### Clone and Run Node.js Express Example

Source: https://github.com/builderio/builder/blob/main/examples/node-express/README.md

Clone the repository, navigate to the example directory, install dependencies, and start the Express server.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/node-express
npm install
npm start
```

--------------------------------

### Install and Run Plugin

Source: https://github.com/builderio/builder/blob/main/examples/embed-starter-kit/Readme.md

Navigate to the plugin directory, install dependencies, and start the plugin development server. This should run in parallel with the site.

```bash
cd plugin
npm install
npm run start
```

--------------------------------

### Clone and Install React Native Example

Source: https://github.com/builderio/builder/blob/main/examples/react-native/README.md

Clone the Builder.io repository, navigate to the react-native example directory, install dependencies, and run the web version.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/react-native
npm install
npm run web
```

--------------------------------

### Install Dependencies and Run Project

Source: https://github.com/builderio/builder/blob/main/examples/vue/vue-storefront-2/README.md

Use these commands to install project dependencies and start the development server. For production, build and launch the server, or generate a static project.

```bash
$ yarn install

$ yarn dev

$ yarn build
$ yarn start

$ yarn generate
```

--------------------------------

### Install Dependencies and Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/svelte/sveltekit/README.md

Install project dependencies and start the development server with hot reloading. Use the --open flag to automatically open the application in a new browser tab.

```bash
npm install

# serve with hot reload at localhost:3000
$ npm run dev
# or start the server and open the app in a new browser tab
$ npm run dev -- --open
```

--------------------------------

### Install Dependencies and Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/svelte/localized-sveltekit/README.md

Use these commands to install project dependencies and start the development server with hot reloading. The `--open` flag will automatically open the application in your browser.

```bash
npm install

$ npm run dev
# or start the server and open the app in a new browser tab
$ npm run dev -- --open
```

--------------------------------

### Initialize Builder.io Project (Interactive)

Source: https://github.com/builderio/builder/blob/main/packages/create-builder.io/README.md

Use this command to start a new Builder.io project in interactive mode, which guides you through the setup process.

```bash
npm init builder.io@latest
```

--------------------------------

### Install Dependencies and Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/next-js-amp/README.md

Install project dependencies using npm and start the development server to view the integrated Next.js and Builder.io application.

```bash
npm install
npm run dev
```

--------------------------------

### Upgrade All Examples

Source: https://github.com/builderio/builder/blob/main/packages/sdks/PUBLISHING.md

Run this command to update all example projects to use the latest released versions of the SDKs. This ensures examples remain synchronized with the SDK.

```bash
yarn upgrade-example:all
```

--------------------------------

### Start Development Server

Source: https://github.com/builderio/builder/blob/main/packages/sdks/snippets/sveltekit/README.md

Run this command after installing dependencies to start the development server. The `-- --open` flag will automatically open your app in a new browser tab.

```bash
npm run dev

```

```bash
npm run dev -- --open

```

--------------------------------

### Install Dependencies and Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/svelte/svelte-vite/README.md

Use these commands to install project dependencies and start the development server with hot reloading. The `--open` flag will automatically open the application in a new browser tab.

```bash
npm install
```

```bash
npm run dev
```

```bash
npm run dev -- --open
```

--------------------------------

### Install and Run Gatsby Demo

Source: https://github.com/builderio/builder/blob/main/examples/gatsby-minimal-starter/README.md

Clone the demo, install dependencies, and start the development server. Ensure your Builder.io preview URL is set to http://localhost:8000.

```bash
git clone git@github.com:BuilderIO/builder.git
cd builder/examples/gatsby
npm install
npm run start
```

--------------------------------

### Clone and Install Dependencies

Source: https://github.com/builderio/builder/blob/main/examples/svelte-design-system/README.md

Clone the Builder.io Svelte design system example and install its dependencies using npm.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/svelte-design-system
npm install
```

--------------------------------

### Start Development Server

Source: https://github.com/builderio/builder/blob/main/plugins/async-dropdown/README.md

Run `npm start` in the plugin directory to start the development server for the dynamic dropdown plugin.

```bash
npm start

```

--------------------------------

### Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/react-design-system/README.md

Start the development server for the React design system example. This will launch a local server at `http://localhost:3000`.

```bash
npm run start
```

--------------------------------

### Example Markdown README Structure (Markdown)

Source: https://github.com/builderio/builder/blob/main/examples/CONTRIBUTING.md

A recommended structure for a README.md file for a Builder.io example, including a title, brief description, and a 'Get Started' section.

```markdown
# Builder.io example with SvelteKit

This is an example of using Builder with SvelteKit. See (pages/index.svelte)[pages/index.svelte] to see the example integration point in detail

## Get Started
...
```

--------------------------------

### Clone and Install Dependencies

Source: https://github.com/builderio/builder/blob/main/examples/react-design-system/README.md

Clone the Builder.io React design system example and install project dependencies using npm.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/react-design-system
npm install
```

--------------------------------

### Start Development Server

Source: https://github.com/builderio/builder/blob/main/examples/embed-starter-kit/plugin/README.md

Use this command to start the local development server for the plugin.

```bash
npm start
```

--------------------------------

### Install Dependencies and Run Dev Server

Source: https://github.com/builderio/builder/blob/main/examples/react-v2/README.md

Install project dependencies and start the development server with hot reload. The `--open` flag can be used to automatically open the application in a new browser tab.

```bash
# install dependencies
$ npm install
```

```bash
# serve with hot reload at localhost:3000
$ npm run dev
# or start the server and open the app in a new browser tab
$ npm run dev -- --open
```

--------------------------------

### Clone Builder.io Next.js Example

Source: https://github.com/builderio/builder/blob/main/examples/next-js-sdk-gen-2-experimental-app-directory/README.md

Clone the Builder.io repository to your local machine to use this example. Navigate into the specific example directory for the experimental app directory setup.

```shell
git clone https://github.com/BuilderIO/builder.git
```

```shell
cd builder/examples/next-js-sdk-gen-2-experimental-app-directory
```

--------------------------------

### Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/next-js-app-router/README.md

Use npm, yarn, or pnpm to start the Next.js development server. Ensure you have the project dependencies installed.

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
```

--------------------------------

### Clone Repository and Install Dependencies

Source: https://github.com/builderio/builder/blob/main/packages/plugin-tools/CONTRIBUTING.md

Clone the starter project and install necessary npm packages. Note that running `npm install` resets the git repository.

```bash
git clone https://github.com/YOUR-USERNAME/typescript-library-starter
npm install
```

--------------------------------

### Navigate to React Example Directory

Source: https://github.com/builderio/builder/blob/main/examples/react-js/README.md

Change your current directory to the React example within the cloned Builder.io repository.

```shell
cd builder/examples/react-js
```

--------------------------------

### Navigate to Example Directory

Source: https://github.com/builderio/builder/blob/main/examples/next-js-on-demand-isr/README.md

Change into the specific example application directory for Next.js on-demand ISR.

```shell
cd builder/examples/next-js-on-demand-isr
```

--------------------------------

### Install Plugin Dependencies

Source: https://github.com/builderio/builder/blob/main/plugins/async-dropdown/README.md

Navigate to the plugin directory and run `npm install` to install the necessary dependencies for local development.

```bash
cd plugins/dynamic-dropdown
npm install

```

--------------------------------

### Navigate to Example Directory

Source: https://github.com/builderio/builder/blob/main/examples/next-js-localized/README.md

Change your current directory to the specific Next.js localized example within the cloned repository.

```shell
cd builder/examples/next-js-localized
```

--------------------------------

### Install Dependencies

Source: https://github.com/builderio/builder/blob/main/examples/astro-solidjs/README.md

Run this command in your project directory to install all necessary dependencies.

```bash
npm install
```

--------------------------------

### Example Component and Page Structure (Bash)

Source: https://github.com/builderio/builder/blob/main/examples/CONTRIBUTING.md

This bash snippet shows a recommended simple file structure for an example, including a component and a page.

```bash
src/
  components/
    example-component.jsx # example component
  pages/
    [...page].jsx # example page
```

--------------------------------

### Install Localization Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/localized-preview/README.md

Clone the repository, navigate to the plugins/localization directory, and install dependencies.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/localization
npm install
```

--------------------------------

### Install Builder.io Admin SDK

Source: https://github.com/builderio/builder/blob/main/packages/admin-sdk/README.md

Install the SDK using npm. Ensure you have Node.js and npm or yarn available.

```bash
npm install @builder.io/admin-sdk
```

--------------------------------

### Install Range Input Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/range-input/README.md

Clone the repository and install dependencies to begin plugin development.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/range-input
npm install
```

--------------------------------

### Install BigCommerce Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/bigcommerce/README.md

Clone the repository, navigate to the plugin directory, and install dependencies to begin development.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/bigcommerce
npm install
```

--------------------------------

### Navigate to Next.js Example Directory

Source: https://github.com/builderio/builder/blob/main/examples/next-js-simple/README.md

After cloning the repository, change into the specific Next.js example directory using this command.

```shell
cd builder/examples/next-js-simple
```

--------------------------------

### Install Plugin Dependencies

Source: https://github.com/builderio/builder/blob/main/plugins/multi-cloudinary/README.md

Clone the repository, navigate to the plugin directory, and install its dependencies using npm.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/multi-cloudinary
npm install
```

--------------------------------

### Install Bynder Plugin

Source: https://github.com/builderio/builder/blob/main/plugins/bynder-example/README.md

Clone the Builder.io repository and navigate to the bynder-example plugin directory to install its dependencies.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/bynder-example
npm install
```

--------------------------------

### Install Builder.io Angular SDK

Source: https://github.com/builderio/builder/blob/main/packages/sdks/output/angular/README.md

Install the SDK using npm. This command adds the necessary package to your project.

```bash
npm install @builder.io/sdk-angular
```

--------------------------------

### Start Development Server

Source: https://github.com/builderio/builder/blob/main/examples/angular-gen2/README.md

Run this command to start a local development server. The application will automatically reload on source file changes.

```bash
ng serve
```

--------------------------------

### Install Commerce Layer Plugin Locally

Source: https://github.com/builderio/builder/blob/main/plugins/commercelayer/README.md

Clone the repository, navigate to the plugin directory, and install dependencies to set up the plugin for local development.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/commercelayer
npm install

```

--------------------------------

### Install Builder.io CLI

Source: https://github.com/builderio/builder/blob/main/examples/next-js-cms-blog/README.md

Installs the Builder.io command-line interface globally. This tool is used for managing Builder.io spaces and content.

```bash
npm install @builder.io/cli -g
```

--------------------------------

### Install Vtex Plugin Locally

Source: https://github.com/builderio/builder/blob/main/plugins/vtex/README.md

Commands to clone the Builder.io repository, navigate to the Vtex plugin directory, and install its dependencies using npm.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/Vtex
npm install
```

--------------------------------

### Install Builder.io Vue SDK

Source: https://github.com/builderio/builder/blob/main/packages/sdks/output/vue/README.md

Use npm to install the Builder.io Vue SDK. This is the first step for integrating Builder.io into your Vue project.

```bash
npm install @builder.io/sdk-vue
```

--------------------------------

### Example: Initialize Builder.io Project with Next.js

Source: https://github.com/builderio/builder/blob/main/packages/create-builder.io/README.md

An example of using command mode to initialize a Builder.io project with the 'nextjs' starter and naming the project 'my-site'.

```bash
npm init builder.io@latest nextjs my-site
```

--------------------------------

### Navigate to Remix Starter Directory

Source: https://github.com/builderio/builder/blob/main/examples/remix-minimal-starter/README.md

After cloning the repository, change into the specific example application directory using the cd command.

```shell
cd builder/examples/remix-minimal-starter
```

--------------------------------

### Install Plugin Dependencies

Source: https://github.com/builderio/builder/blob/main/plugins/elasticpath/README.md

Install the necessary dependencies for the Elasticpath plugin locally. This is part of the development setup process.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/elasticpath
npm install
```

--------------------------------

### Initialize Builder.io Project (Command Mode)

Source: https://github.com/builderio/builder/blob/main/packages/create-builder.io/README.md

Create a new Builder.io project with a specified starter template and project name using command mode.

```bash
npm init builder.io@latest <starter> <projectName>
```

--------------------------------

### Install Dependencies and Run Next.js Dev Server

Source: https://github.com/builderio/builder/blob/main/examples/next-js-cms-blog/README.md

Installs project dependencies using yarn and starts the Next.js development server. This command is used to run the blog locally for development.

```bash
yarn install
yarn dev
```

--------------------------------

### Install Builder.io Qwik SDK

Source: https://github.com/builderio/builder/blob/main/packages/sdks/output/qwik/README.md

Use npm to install the Builder.io Qwik SDK. This command is typically run in your project's root directory.

```bash
npm install @builder.io/sdk-qwik
```

--------------------------------

### Get Static Props with Comments (TypeScript)

Source: https://github.com/builderio/builder/blob/main/examples/CONTRIBUTING.md

An example of `getStaticProps` function in Next.js, fetching content from Builder.io with inline comments explaining each step. This approach is suitable for Server-Side Rendering (SSR) or Static Site Generation (SSG).

```tsx
export async function getStaticProps() {
  // Get the page from Builder.io's API
  const page = await getContent({
    // Provide your model name
    model: 'page',
    // Provide the current URL
    url: '/'
    // You can add other options here: https://github.com/BuilderIO/builder/blob/main/packages/core/docs/interfaces/GetContentOptions.md
  })

  if (!page) {
    // If no page exists, show a 404
    return { notFound: true }
  }
  return { props: { page } }
}
```

--------------------------------

### Clone and Initialize Builder.io Space

Source: https://github.com/builderio/builder/blob/main/examples/next-js-amp/README.md

Clone the starter project, install the Builder.io CLI, and create a new Builder.io space using your private key. This also publishes starter content.

```bash
git clone https://github.com/BuilderIO/builder
cd builder/examples/next-js-amp

npm install --global "@builder.io/cli"

builder create --key "<private-key>" --name "<space-name>" --debug
```

--------------------------------

### Install Project Dependencies with Yarn

Source: https://github.com/builderio/builder/blob/main/packages/sdks/snippets/vue/README.md

Run this command to install all the necessary dependencies for the project. Ensure you have Yarn installed.

```sh
yarn
```

--------------------------------

### Install Shopify Plugin Dependencies

Source: https://github.com/builderio/builder/blob/main/plugins/shopify/README.md

Install the necessary dependencies for the Shopify plugin by cloning the repository and running npm install.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/shopify
npm install
```

--------------------------------

### Run Development Server

Source: https://github.com/builderio/builder/blob/main/examples/astro-solidjs/README.md

Starts the local development server for real-time previewing of changes.

```bash
npm run dev
```

--------------------------------

### Install Emporix Plugin Dependencies

Source: https://github.com/builderio/builder/blob/main/plugins/emporix/README.md

Install the necessary dependencies for the Emporix plugin by cloning the repository and running npm install.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/emporix
npm install
```

--------------------------------

### Initialize and Use Builder SDK

Source: https://github.com/builderio/builder/blob/main/packages/core/README.md

Initialize the SDK with your key, set user attributes for targeting, and fetch content using `builder.get` or `builder.getAll`. Ensure you replace placeholders like YOUR_KEY and YOUR_MODEL_NAME.

```javascript
import { builder } from '@builder.io/sdk';

builder.init(YOUR_KEY);

// Optional custom targeting
builder.setUserAttributes({
  userIsLoggedIn: true,
  whateverKey: 'whatever value',
});

builder
  .get(YOUR_MODEL_NAME, {
    // Optional custom query
    query: {
      'data.customField.$gt': 100,
    },
  })
  .promise()
  .then(({ data }) => {
    // Do something with the data
  });

// The options that you can send to builder.get and builder.getAll
// are defined here: https://forum.builder.io/t/what-are-the-options-for-the-methods-builder-get-and-builder-getall/1036
builder
  .getAll(YOUR_MODEL_NAME, {
    limit: 10,
  })
  .then(results => {
    // Do something with the results
  });

// Turn of cookies/tracking
builder.canTrack = false;
```

--------------------------------

### Install Commerce.js Plugin Dependencies

Source: https://github.com/builderio/builder/blob/main/plugins/commercejs/README.md

Install the necessary dependencies for the Commerce.js plugin by cloning the repository and running npm install.

```bash
git clone https://github.com/BuilderIO/builder.git
cd plugins/commercejs
npm install
```

--------------------------------

### Install Builder.io React-Native SDK

Source: https://github.com/builderio/builder/blob/main/packages/sdks/output/react-native/README.md

Use npm to install the Builder.io React-Native SDK. This command installs the development version.

```bash
npm install @builder.io/sdk-react-native@dev
```

--------------------------------

### Initialize Builder.io Space with CLI

Source: https://github.com/builderio/builder/blob/main/examples/react-multipage-funnel/README.md

Install the Builder.io CLI globally, then use it to create a new Builder.io space. Replace `<private-key>` with your actual private key and `<space-name>` with your desired space name. This command also publishes starter content.

```bash
git clone https://github.com/BuilderIO/builder
cd builder/examples/react-multipage-funnel

npm install --global "@builder.io/cli"

builder create --key "<private-key>" --name "<space-name>" --debug
```

--------------------------------

### Clone Repository and Install Dependencies

Source: https://github.com/builderio/builder/blob/main/packages/react/CONTRIBUTING.md

Clone the builder-react repository and install project dependencies using yarn. Note that after running 'yarn install', the git repo is reset.

```bash
git clone https://github.com/YOUR-USERNAME/builder-react
yarn install
```

--------------------------------

### Install Personalization Utils

Source: https://github.com/builderio/builder/blob/main/packages/personalization-utils/README.md

Install the personalization utils package using npm.

```bash
npm install @builder.io/personalization-utils
```

--------------------------------

### Install Builder Widgets Package

Source: https://github.com/builderio/builder/blob/main/packages/widgets/README.md

Install the Builder.io widgets package using npm.

```bash
npm install @builder.io/widgets
```

--------------------------------

### Install App Context Package

Source: https://github.com/builderio/builder/blob/main/plugins/contributing.md

Install the @builder.io/app-context package as a development dependency using npm.

```bash
npm install --save-dev @builder.io/app-context
```

--------------------------------

### Install Dependencies for Nuxt 3

Source: https://github.com/builderio/builder/blob/main/examples/vue/nuxt-3/README.md

Install project dependencies using yarn, npm, or pnpm.

```bash
yarn install
```

```bash
npm install
```

```bash
pnpm install
```

--------------------------------

### Serve Built Project

Source: https://github.com/builderio/builder/blob/main/examples/angular-universal/README.md

After building, use this command to serve the production build. Access the running project at http://localhost:4000/.

```bash
npm run serve:ssr
```

--------------------------------

### Initialize Builder.io Space with CLI

Source: https://github.com/builderio/builder/blob/main/examples/next-js-theme-ui/README.md

Use the Builder.io CLI to create a new space for your project. Ensure you replace `<private-key>` with your actual private key and `<space-name>` with your desired space name. This command also publishes starter content.

```bash
git clone https://github.com/BuilderIO/builder.git
cd examples/next-js-theme-ui

npm install --global "@builder.io/cli"

builder create --key "<private-key>" --name "<space-name>" --debug
```