Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Edit suggestions #6586

Merged
merged 5 commits into from
Sep 23, 2021
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ import { InlineCode } from '../../../components/primitives/Code';

# Getting started

[`create-keystone-app`](https://github.com/keystonejs/create-keystone-app) is a CLI app that makes it easier for you to get started with Keystone.
It will generate a couple of files for you and install all the dependencies you need to run the Admin UI and start using the GraphQL API.
[`create-keystone-app`](https://github.com/keystonejs/create-keystone-app) is a CLI app that makes it easier for you initiate a Keystone project.
It generates some files for you and installs all the dependencies you need to run the Admin UI and start using the [GraphQL API](/docs/apis/graphql).

## Quick Start

Expand All @@ -18,9 +18,9 @@ cd my-app
yarn dev
```

## Installing your own Keystone instance
## Installing a Keystone instance

Open your preferred shell and make sure you are in the folder you would like to create your new project in.
Open your preferred shell and make sure you’re in the folder you want to create your new project in.
`create-keystone-app` will generate a new folder with your new Keystone files in it.

### Yarn
Expand Down Expand Up @@ -56,72 +56,56 @@ npx create-keystone-app

## Naming your app

The CLI will ask you to name your new Keystone app and will create a new SQLite database for you.
The CLI will ask you to name your app. Once named, it will create a new SQLite database.

?> You can switch to another database such as PostgreSQL once your project is created, check out the docs on [Database Setup](https://keystonejs.com/docs/apis/config#db).

## Opening your shiny new Admin UI

![The AdminUI of Keystone showing the two lists: User and Posts](/assets/walkthroughs/getting-started/adminui.png)

After running `create-keystone-app` you can now `cd` into the folder that was created for you and start Keystone.
You can now `cd` into the folder that was created for you and start Keystone:

```sh
cd my-app
yarn dev
```

This will generate the Admin UI pages via [Next.js](https://nextjs.org/) on [http://localhost:3000](http://localhost:3000).
This will generate the Admin UI pages via [Next.js](https://nextjs.org/) on [http://localhost:3000](http://localhost:3000). When you visit the Admin UI for the first time you will be presented with a handy screen that asks you to create a user:

![The welcome screen giving you the ability the create a new user to log into the AdminUI](/assets/walkthroughs/getting-started/welcome-screen.png)

When you visit the Admin UI for the first time you will be presented with a handy screen that asks you to create a user.
Go ahead and create your first user.
The email address and password will be used as the login details when you next need to login to the Admin UI.
Go ahead and create your first user. The email address and password will be used to login to Keystone’s Admin UI. Once you've created your user, you’ll be logged in to a new Keystone Admin UI that comes with two [lists](/docs/apis/config#lists).
From here you can explore and interact with the data in your system, and understand how Keystone’s schema relates to your GraphQL API which you can explore at [http://localhost:3000/api/graphql](http://localhost:3000/api/graphql).

Once you've created the user you can see your new Keystone Admin UI that comes with two visible lists.
You can use the Admin UI to explore and interact with the data in your system.
![The AdminUI of Keystone showing the two lists: User and Posts](/assets/walkthroughs/getting-started/adminui.png)

## Output

We now have some files in the newly generated folder. The two most important once you want to get into are `keystone.ts` and `schema.ts`.
Keytone creates the following files in your newly generated folder. The most important ones are [`keystone.ts`](/docs/apis/config) and [`schema.ts`](/docs/apis/Schema).

```sh
.
├── auth.ts # Authentication configuration for Keystone
├── keystone.ts # The main entry file for Keystone
├── keystone.ts # The main entry file for configuring Keystone
├── node_modules # Your dependencies
├── package.json # Your package.json with four scripts prepared for you
├── README.md # Additional information to help you get started
├── schema.graphql # GraphQL schema automatically generated by Keystone
├── schema.prisma # Prisma confiruation automatically generated by Keystone
├── schema.ts # The schema of your data
├── README.md # Additional info to help you get started
├── schema.graphql # GraphQL schema (automatically generated by Keystone)
├── schema.prisma # Prisma configuration (automatically generated by Keystone)
├── schema.ts # Where you design your data schema
├── tsconfig.json # Your typescript config
└── yarn.lock # And finally your yarn lock file
└── yarn.lock # Your yarn lock file
```

## Scripts

The files come with three npm scripts you can run locally.

`dev`

- The `dev` script will run Keystone in development mode.
Jump over to [http://localhost:3000](http://localhost:3000) to see your Admin UI.

`start`

- The `start` script will run Keystone in production mode.

`build`

- The `build` script will build the project and is required to be run before `start`.

`postinstall`
`package.json` includes the following npm scripts you can run locally:

- The `postinstall` script ensures files that Keystone generates exist and are kept up to date.
- [`dev`](/docs/guides/cli#dev) runs Keystone in **development** mode at [http://localhost:3000](http://localhost:3000).
- [`start`](/docs/guides/cli#start) runs Keystone in **production** mode.
- [`build`](/docs/guides/cli#build) will build the project and is required to be run before `start`.
- [`postinstall`](/docs/guides/cli#postinstall) ensures files that Keystone generates exist and are kept up to date.

Read more about the cli in our [command line guides](/guides/cli).
!> Read more about the CLI in our [command line guides](/guides/cli).

## Where to next?

Expand Down