> ## Documentation Index
> Fetch the complete documentation index at: https://docs.shardcloud.app/llms.txt
> Use this file to discover all available pages before exploring further.

# How to Host Next.js Applications

> Learn how to deploy Next.js applications on Shard Cloud.

## Introduction

This guide covers deploying Next.js applications on Shard Cloud. Next.js is a React framework for production-grade applications with server-side rendering and static site generation.

## Creating Your Project

Ensure you have **Node.js** and **npm** installed.

### Creating a New Next.js Project

```bash theme={null}
npx create-next-app@latest my-next-app
cd my-next-app
```

### Configuring Port 80

Update `package.json` to use port 80:

```json package.json theme={null}
{
  "name": "my-next-app",
  "version": "0.1.0",
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start -p 80",
    "lint": "next lint"
  },
  "dependencies": {
    "next": "14.0.0",
    "react": "^18",
    "react-dom": "^18"
  }
}
```

## Building Your Project

Build the production output:

```bash theme={null}
npm run build
```

This creates the `.next` folder with optimized production files.

## Shard Cloud Configuration

Create a `.shardcloud` file:

```systemd .shardcloud theme={null}
DISPLAY_NAME=Next.js Website
DESCRIPTION=React-based Next.js Application
MAIN=package.json
MEMORY=1024
VERSION=recommended
SUBDOMAIN=my-nextjs-site
CUSTOM_COMMAND=npm run build && npm run start
```

<Note>
  Next.js applications typically require at least 512MB-1024MB of memory for the build process.
</Note>

## Deploying

<Steps>
  <Step title="Build Locally (Optional)">
    Run `npm run build` to verify your build works.
  </Step>

  <Step title="Prepare Your Files">
    Ensure you have:

    * All source files (`pages/`, `app/`, `components/`, etc.)
    * `package.json`
    * `.shardcloud`
    * `next.config.js` (if applicable)
  </Step>

  <Step title="Exclude Unnecessary Files">
    Remove:

    * `node_modules/`
    * `.next/cache/`
    * `package-lock.json`
  </Step>

  <Step title="Create ZIP Archive">
    Compress your project folder.
  </Step>

  <Step title="Upload to Shard Cloud">
    Go to [Shard Cloud Dashboard](https://shardcloud.app/dash/applications) and upload.
  </Step>
</Steps>

## Additional Resources

Visit the [official Next.js documentation](https://nextjs.org/docs) for more information.

## Troubleshooting

<AccordionGroup>
  <Accordion title="Build fails with memory errors">
    Increase `MEMORY` in your `.shardcloud` configuration to at least 1024MB.
  </Accordion>

  <Accordion title="Page not found (404) errors">
    * Verify your pages are in the correct directory (`pages/` or `app/`)
    * Check that dynamic routes are properly configured
  </Accordion>

  <Accordion title="API routes not working">
    Ensure API routes are in `pages/api/` or `app/api/` directory.
  </Accordion>
</AccordionGroup>
