### Create Axii Project with npx

Source: https://github.com/axiijs/axii/blob/main/README-zh_CN.md

This command initializes a new Axii project with a pre-configured setup and example code. It requires Node.js and npm/npx to be installed.

```bash
npx create-axii-app myapp
cd myapp
npm run dev
```

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

### Axii Quick Start Example - Reactive Data Binding

Source: https://github.com/axiijs/axii/blob/main/README.md

Demonstrates basic reactive data binding in Axii. It uses the `atom` function to create mutable reactive data and binds it to an input element and a heading. Changes in the input automatically update the heading due to the reactive nature of `atom`.

```jsx
/* @jsx createElement */
import { createRoot, atom } from 'axii'
function App({}, {createElement}) {
  const title = atom('Hello, Reactive World!')
  return (
    <div>
      <input
        value={title}
        onInput={(e) => title(e.target.value)}
      />
      <h1>{() => title()}</h1>
    </div>
  )
}

const root = document.getElementById('root')
createRoot(root).render(<App />)
```

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

### Basic Reactive Data Binding in Axii

Source: https://github.com/axiijs/axii/blob/main/README-zh_CN.md

Demonstrates how to use `atom` for reactive data and bind it to DOM elements. Changes to the `title` atom automatically update the input field and the heading. This example uses JSX and requires the `axii` library.

```jsx
/ @jsx createElement /
import { createRoot, atom } from 'axii'

function App({}, {createElement}) {
  const title = atom('Hello, Reactive World!')
  return (
    <div>
      <input
        value={title}
        onInput={(e) => title(e.target.value)}
      />
      <h1>{() => title()}</h1>
    </div>
  )
}

const root = document.getElementById('root')
createRoot(root).render(<App />)
```

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

### Axii Reactive Collections Example - RxList

Source: https://github.com/axiijs/axii/blob/main/README.md

Illustrates the use of `RxList` in Axii for managing lists with efficient DOM updates. Adding items to the `RxList` triggers incremental updates to the displayed list without re-rendering the entire component.

```jsx
/* @jsx createElement */
import { createRoot, RxList } from 'axii'

function ListApp({}, {createElement}) {
  const items = new RxList([ 'Apple', 'Banana', 'Cherry' ])
  function addItem() {
    items.push(`Random-${Math.random().toFixed(2)}`)
  }
  return (
    <div>
      <ul>
       {items.map(item => <li>{item}</li>)}
      </ul>
      <button onClick={addItem}>Add Random</button>
    </div>
  )
}

createRoot(document.getElementById('root')).render(<ListApp />)
```

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

### Reactive List Operations in Axii

Source: https://github.com/axiijs/axii/blob/main/README-zh_CN.md

Shows how to use `RxList` for reactive management of array-like data. Adding items to the `items` RxList triggers incremental updates to the DOM list without re-rendering the entire list. This example also uses JSX and the `axii` library.

```jsx
/ @jsx createElement /
import { createRoot, RxList } from 'axii'

function ListApp({}, {createElement}) {
  const items = new RxList([ 'Apple', 'Banana', 'Cherry' ])
  function addItem() {
    items.push(`Random-${Math.random().toFixed(2)}`)
  }
  return (
    <div>
      <ul>
       {items.map(item => <li>{item}</li>)}
      </ul>
      <button onClick={addItem}>Add Random</button>
    </div>
  )
}

createRoot(document.getElementById('root')).render(<ListApp />)
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.