---
sidebar_position: 1.1
sidebar_custom_props:
  section: "Setup"
  section_position: 1
---

import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";

# Installation

No installation required! Use `npx` to run the latest version:

```bash
npx @sp-days-framework/create-sp-days
```

Or install globally if you create courses frequently:

<Tabs>
  <TabItem value="npm" label="npm" default>
    ```bash
    npm install -g @sp-days-framework/create-sp-days
    ```
  </TabItem>
  <TabItem value="yarn" label="Yarn">
    ```bash
    yarn global add @sp-days-framework/create-sp-days
    ```
  </TabItem>
  <TabItem value="pnpm" label="pnpm">
    ```bash
    pnpm add -g @sp-days-framework/create-sp-days
    ```
  </TabItem>
  <TabItem value="bun" label="Bun">
    ```bash
    bun add -g @sp-days-framework/create-sp-days
    ```
  </TabItem>
</Tabs>

Then run the tool:

```bash
create-sp-days my-course
```

## Usage Examples

### Interactive Setup (Recommended)

The easiest way to get started is interactive mode:

```bash
npx @sp-days-framework/create-sp-days
```

**What you'll be asked:**

1. **Site name** - Directory name (e.g., `docs`)
2. **Project name** - Package name (defaults to site name)
3. **GitHub organization** - Your org (defaults to `helse-sorost`)
4. **Repository name** - Repo name (defaults to project name)
5. **Site title** - Display title (e.g., `Docker Fundamentals`)
6. **Tagline** - Brief description (e.g., `Master containerization`)
7. **Add Slidev?** - Enable presentations (yes/no)
8. **Add Resources?** - Enable documentation (yes/no)

:::tip[Auto-detection]
The package manager is auto-detected from your system. You can override it by selecting a different option.
:::

### Minimal Setup

Create a basic course with defaults:

```bash
npx @sp-days-framework/create-sp-days my-course
```

This creates a project with:

- Directory: `my-course`
- Title: `SP Days Template`
- Tagline: `Empowered by Docusaurus and Slidev`
- Organization: `helse-sorost`
- No addons

### Skip Dependency Installation

Create the structure without installing dependencies:

```bash
npx @sp-days-framework/create-sp-days my-course --skip-install
cd my-course
npm install
```

Useful when:

- You want to review the structure first
- You need to configure proxies or registries
- You're working offline

## Understanding Addons

### Base Template Features

Every course includes:

```json title="package.json" {3-5}
{
  "dependencies": {
    "@docusaurus/core": "3.9.2",
    "@sp-days-framework/docusaurus-plugin-interactive-tasks": "^1.0.0",
    "@sp-days-framework/docusaurus-frontpage-collection": "^1.0.0"
  }
}
```

**Pre-configured:**

- Docusaurus preset-classic
- Interactive task system
- Frontpage component library
- TypeScript support
- SASS/SCSS styling
- Mermaid diagram support

### Slidev Addon (`--addon-slidev`)

Adds presentation capabilities:

```json title="package.json" {6-7}
{
  "dependencies": {
    "@docusaurus/core": "3.9.2",
    "@sp-days-framework/docusaurus-plugin-interactive-tasks": "^1.0.0",
    "@sp-days-framework/docusaurus-frontpage-collection": "^1.0.0",
    "@sp-days-framework/docusaurus-plugin-slidev": "^1.0.0",
    "@sp-days-framework/slidev-theme-sykehuspartner": "^1.0.0"
  }
}
```

**Adds:**

- `/slidev` directory with example presentations
- Slidev plugin configuration
- `npm run slidev` script
- Presentation overview page

**When to use:**

- Course includes lectures or presentations
- You want slide-based content alongside documentation
- You need speaker notes and presenter mode

### Resources Addon (`--addon-resources`)

Adds comprehensive documentation:

**Adds:**

- `/resources` directory structure
- Component usage guides
- Setup and configuration examples
- Best practices documentation

**When to use:**

- Large courses needing separate documentation
- Multiple instructors needing reference materials
- Courses with complex component usage

### Package Documentation (`--include-package-docs`)

Adds comprehensive developer documentation:

**Adds:**

- Documentation instances for all installed plugins
- API references and developer guides
- "Plugin Docs" dropdown in navbar
- Routes like `/package-docs/interactive-tasks`

**When to use:**

- Package development and testing
- Easier access to plugin documentation
- Demoing framework capabilities

:::warning Production Considerations
Starting from version 1.1.0, all `@sp-days-framework` packages include their documentation as pre-made Docusaurus MDX files. While useful for development, this feature adds unnecessary dependencies to production builds. Consider removing it before deploying (see generated README for instructions).

**Important:** Enabling package documentation automatically installs the Slidev addon because package docs include Slidev theme documentation.
:::