Other deployment options

Updated on

At the moment, the Shipixen app only supports 1-click deployments to Vercel.

However, since the result is a static Next.js app, it can potentially be deployed to any static hosting service.

It is possible to download the generated boilerplate as a zip file and deploy it to other hosting services.

Here are some examples of how to deploy the app to other hosting services:

Netlify

Netlify’s Next.js runtime configures enables key Next.js functionality on your website without the need for additional configurations. Netlify generates serverless functions that will handle Next.js functionalities such as server-side rendered (SSR) pages, incremental static regeneration (ISR), next/images, etc.

See Next.js on Netlify for suggested configuration values and more details.

Static hosting services / GitHub Pages / S3 / Firebase etc.

  1. Add output: 'export' in next.config.js. See static exports documentation for more information.

  2. Comment out headers() from next.config.js.

  3. Change components/Image.tsx to use a standard <img> tag instead of next/image:

    /* eslint-disable jsx-a11y/alt-text */
    /* eslint-disable @next/next/no-img-element */
    import NextImage, { ImageProps } from 'next/image'
    
    // @ts-ignore
    const Image = ({ ...rest }: ImageProps) => <img {...rest} />
    
    export default Image
    

    Alternatively, to continue using next/image, you can use an alternative image optimization provider such as Imgix, Cloudinary or Akamai. See image optimization documentation for more details.

  4. Remove api folder and components which call the server-side function such as the Newsletter component. Not technically required and the site will build successfully, but the APIs cannot be used as they are server-side functions.

  5. Run yarn build. The generated static content is in the out folder.

  6. Deploy the out folder to your hosting service of choice or run npx serve out to view the website locally.