Deployment

How to deploy Notiq and its documentation to production.

Deployment

Deploying the Documentation

The Notiq documentation is built with Next.js and Fumadocs. It is optimized for deployment on Vercel but can be hosted on any platform that supports Next.js.

The easiest way to deploy is using the Vercel integration.

  1. Push your code to a GitHub repository.
  2. Connect the repository to Vercel.
  3. Add the required environment variables:
    • OPENAI_API_KEY: Your OpenAI key (starting with sk-).
    • NEXT_PUBLIC_BASE_URL: The production URL of your docs.

Build Command

If you are deploying elsewhere:

pnpm build

This will generate a production-ready .next folder.


Deploying the Editor (Library)

If you are using Notiq as a library in your own app, follow these steps for production safety:

Bundle Optimization

Notiq uses dynamic imports for heavy plugins (Excalidraw, Figma). Ensure your bundler (webpack/vite) is configured for code splitting.

Style Injection

Make sure to import the Notiq styles in your main entry point:

import "@collabchron/notiq/styles.css";

Server-Side Rendering (SSR)

Notiq is a client-side library. If you use it in a Next.js app, ensure you import the Editor component using next/dynamic with ssr: false:

const Editor = dynamic(() => import("@collabchron/notiq"), { ssr: false });

CI/CD Tips

  • Linting: Run pnpm lint before every deploy.
  • Type Checking: Run tsc --noEmit to ensure type safety in production.

On this page