# next-s3

> A CLI tool to deploy any next.js app on S3

Latest version **0.0.17** (published 2023-01-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install next-s3
pnpm add next-s3
yarn add next-s3
bun add next-s3
```

Provides the command `next-s3`.

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.0.17 |
| Published | 2023-01-15 |
| First published | 2022-09-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 10 |
| Unpacked size | 8.9 MB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Balázs Szalay |
| Maintainers | szalaybalazs |
| Keywords | next, aws, s3, deploy, cloudfront |

## Links

- npm: https://www.npmjs.com/package/next-s3
- Repository: https://github.com/szalaybalazs/next-s3
- Homepage: https://github.com/szalaybalazs/next-s3#readme
- Issues: https://github.com/szalaybalazs/next-s3/issues
- npm.io page: https://npm.io/package/next-s3

## Dependencies (10)

- [chalk](https://npm.io/package/chalk.md) ^4.1.0
- [dotenv](https://npm.io/package/dotenv.md) ^16.0.2
- [aws-sdk](https://npm.io/package/aws-sdk.md) ^2.1209.0
- [p-limit](https://npm.io/package/p-limit.md) ^4.0.0
- [shelljs](https://npm.io/package/shelljs.md) ^0.8.5
- [commander](https://npm.io/package/commander.md) ^9.4.0
- [mime-types](https://npm.io/package/mime-types.md) ^2.1.35
- [ansi-colors](https://npm.io/package/ansi-colors.md) ^4.1.3
- [cli-progress](https://npm.io/package/cli-progress.md) ^3.11.2
- [@aws-sdk/client-s3](https://npm.io/package/@aws-sdk/client-s3.md) ^3.165.0

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 0.0.17 (latest) — 2023-01-15
- 0.0.16 — 2023-01-15
- 0.0.15 — 2022-09-16
- 0.0.14 — 2022-09-10
- 0.0.13 — 2022-09-08
- 0.0.12 — 2022-09-08
- 0.0.11 — 2022-09-08
- 0.0.10 — 2022-09-08
- 0.0.9 — 2022-09-05
- 0.0.8 — 2022-09-05
- 0.0.7 — 2022-09-05
- 0.0.6 — 2022-09-05
- 0.0.5 — 2022-09-05
- 0.0.4 — 2022-09-05
- 0.0.3 — 2022-09-04
- … 2 more at https://npm.io/package/next-s3/versions

## README

<a id="readme-top" name="readme-top"></a>

<!-- PROJECT LOGO -->
<br />
<div align="center">
  <h3 align="center">Next-S3</h3>

  <p align="center">
    Deploy your static Next.js sites in one command
    <br />
    <a href="#getting-started"><strong>Explore the docs »</strong></a>
    <br />
    <br />
    <a href="https://github.com/szalaybalazs/next-s3/issues">Report Bug</a>
    ·
    <a href="https://github.com/szalaybalazs/next-s3/issues">Request Feature</a>
  </p>
</div>

<!-- TABLE OF CONTENTS -->
<details>
  <summary>Table of Contents</summary>
  <ol>
    <li>
      <a href="#about-the-project">About The Project</a>
    </li>
    <li>
      <a href="#getting-started">Getting Started</a>
      <ul>
        <!-- <li><a href="#prerequisites">Prerequisites</a></li> -->
        <li><a href="#installation">Installation</a></li>
      </ul>
    </li>
    <li>
    <a href="#usage">Usage</a>
      <ul>
        <li><a href="#parameters">Parameters</a></li>
        <li><a href="#examples">Examples</a></li>
      </ul>
    </li>
    <li><a href="#roadmap">Roadmap</a></li>
    <li><a href="#contributing">Contributing</a></li>
    <li><a href="#license">License</a></li>
    <li><a href="#contact">Contact</a></li>
  </ol>
</details>

<!-- ABOUT THE PROJECT -->

## About The Project

![Product Name Screen Shot](/assets/banner.png)

A tiny CLI tool to host any of your static next.js sites on AWS S3 and Cloudfront.

There are many great ways to host a Next.js app, especially vercel but there are times, when they are simply just overkill - and can even result in slower load times than a regular static site.

With that said, there are some pros and cons against hosting on S3;

**Pros:**

- There is no need for a server, your files will be hosted statically, which is simply faster.
- You can utilize Cloudfront's built-in GZipping, which will reduce your load times even more

**Cons:**

- Only static sites can be hosted on S3, with absolutely no SSR or ISG.
- You can not use any of Next's built-in API or middle-ware logic.
- A 3rd party image optimizer has to be used - or none at all.

I know there are other web frameworks, created for such type of hosting but let's be honest; working on a next.js project can't be compared DX-wise to any other production framework.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

<!-- GETTING STARTED -->

## Getting Started

### Installation

Using NPM

```shell
npm install --save-dev next-s3
```

or using yarn

```shell
yarn add -D next-s3
```

**Note:** It is recommended to install the page as a dev dependency.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

<!-- USAGE EXAMPLES -->

## Usage

Run the following command from inside your Next.js project:

```bash
next-s3 deploy --bucket <bucket-name> --distribution <cloudfront distribution id>
```

**Note:** I assume the package has been installed globally.

### Parameters

All the parameters available to use:

| Option             | Dotenv key           | Required | Description                                          | Default |
| ------------------ | -------------------- | :------: | ---------------------------------------------------- | :-----: |
| -p, --profile      | NEXT_S3_PROFILE      |    No    | Name of the local AWS profile which will be used     |    -    |
| --publicKey        | NEXT_S3_PUBLIC_KEY   |    No    | Public access key which will be used during upload   |    -    |
| --secretKey        | NEXT_S3_PRIVATE_KEY  |    No    | Secret key generated for the public key              |    -    |
| -b, --bucket       | NEXT_S3_BUCKET       |   Yes    | The name of the S3 bucket to be used.                |    -    |
| -d, --distribution | NEXT_S3_DISTRIBUTION |    No    | Cloudformation ID to be invaidated after deployment. |    -    |
| -p, --basepath     | NEXT_S3_BASEPATH     |    No    | Base path the site will be available under.          |   '/'   |
| --manager          | -                    |    No    | Package manager to be used to run commands.          | 'yarn'  |
| -v, --verbose      | -                    |    No    | Enable verbose logging                               |  false  |

<p align="right">(<a href="#readme-top">back to top</a>)</p>

### Examples

Upload a site to an S3 bucket and Cloudfront:

```bash
next-s3 deploy --bucket <bucket-name> --distribution <cloudfront distribution id>
```

Upload a site to an S3 bucket and Cloudfront using a different profile:

```bash
next-s3 deploy --bucket <bucket-name> --distribution <cloudfront distribution id> --profile <profile>
```

Upload a site to an S3 bucket and Cloudfront using and host under the `/production` basepath:

```bash
next-s3 deploy --bucket <bucket-name> --distribution <cloudfront distribution id> --basepath "/production"
```

<p align="right">(<a href="#readme-top">back to top</a>)</p>

<!-- ROADMAP -->

## Roadmap

- [x] Create initial version
- [ ] Add `dotenv^ support
- [ ] Add custom config options
- [ ] Create additional commands
  - [ ] Project scaffolding
- [ ] Create github action

See the [open issues](https://github.com/szalaybalazs/next-s3/issues) for a full list of proposed features (and known issues).

<p align="right">(<a href="#readme-top">back to top</a>)</p>

<!-- CONTRIBUTING -->

## Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request

<p align="right">(<a href="#readme-top">back to top</a>)</p>

## License

Distributed under the MIT License. See `LICENSE.txt` for more information.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

<!-- CONTACT -->

## Contact

Balazs Szalay - [@szalayme](https://twitter.com/szalayme) - balazs@szalay.me

<p align="right">(<a href="#readme-top">back to top</a>)</p>

---
_Source: https://npm.io/package/next-s3 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
