# Create HubSpot CMS Theme

The quickest way to get started using CMS React is by using `@hubspot/create-cms-theme`. This CLI tool will generate a starter theme for you to use as a starting point with all the configuration complete and a set of example building blocks to reference or build upon. Speeding up your ability to begin local development with the HubSpot CMS.

### Prerequisites
- Node.js (version 20 or higher)
- A HubSpot CMS Developer account (or access to a HubSpot portal with CMS access)
- NPM or Yarn package manager

### To get started, run the following command:

```bash
npx @hubspot/create-cms-theme@latest
```
After running the command, you will be prompted to answer a few questions to customize your starter theme.

#### Prompts:
```
? What is the name of your theme?
```
This will be the name that appears in the HubSpot CMS UI when selecting a theme and the name of your [Project](https://developers.hubspot.com/beta-docs/guides/crm/developer-projects/create-a-project) when accessing your build/deploy information.

```
? What directory do you want to create your theme in?
```
This is the parent directory that we will create your theme in. For example if the answer to `What is the name of your theme?` is `MyCmsReactTheme` and the answer to this question is `/your-theme-directory`, then the starter theme will be created in `/your-theme-directory/MyCmsReactTheme`.

```
? Do you want to use TypeScript?
```
This will determine if we setup your theme with TypeScript. If you select `No`, we will setup your theme with JavaScript.

#### Directory Structure
Upon completion, your theme will have this structure:
```
your-theme-directory/
├── src/
│   └── theme/
│       ├── assets/
│       ├── components/
│       │   └── modules/
│       ├── styles/
│       ├── templates/
│       ├── fields.json
│       ├── theme.json
│       └── package.json
├── package.json
├── hsproject.json
```

## Local Development
After creating your theme, you can begin local development by running:
   ```bash
   npm run start
   ```

## Additional Resources
- [CMS React Documentation](https://github.hubspot.com/cms-react/)
- [Join the HubSpot developer slack channel](https://developers.hubspot.com/beta-docs/getting-started/slack/developer-slack)
- [HubSpot CMS Developer Docs](https://developers.hubspot.com/docs/)
