# CLI

Getting started with Tipe using the CLI is fast and easy.

## Install the CLI

With NPM

```bash
npmi @tipe/cli -g
```

With YARN

```bash
yarnglobaladd @tipe/cli
```

## Initialize Tipe

Be sure to change directories into your project where you'd like to install tipe. Next, just run the `init` command from the root of your project's directory.

```bash
tipe init
```

After the `init` command has finished, you will have the following:

1. An account on Tipe
2. A Tipe project
3. An environment for your project
4. Some seeded content in your environment
5. A seeded schema in your app directory that matches the seeded content in tipe.
6. The Tipe editor installed into your app and ready to be used.

## Query your content

Now Let's fetch some content from tipe and use it in your pages. Go to your index page or any page where you want to use some tipe content. Don't worry, at this point, you'll be using seeded content that we created for you, you'll have the chance to change your schema and create new content.

In your page you'll need to import a few things.

```js
import { getStaticContent, EditButton } from '@tipe/next'
```

To fetch the content, you can use `getStaticContent`.

```js
export const getStaticProps = getStaticContent({ query: { type: 'homePage', limit: 1 } })
```

We will then use the props that `getStaticContent` provides our page component with to render our content and setup our button to edit the page.

```jsx
const MyHomePage = ({ documents, editUrl }) => {
    return (
        <div>
            <h1>{documents[0].fields.title}</h1>
            <EditButton editUrl={editUrl} />
        </div>
    )
}

export default MyHomePage
export const getStaticProps = getStaticContent({ query: { type: 'homePage', limit: 1 } })
```

You should now be able to see some content from tipe in your `h1` on your page. You will also see an edit button on the bottom right 🎉