Skip to content

Installation

Learn how to launch your directory website with Mkdirs.

Installation Guide

  1. Create your own repository

    Click on Use this template button on the top right corner of Mkdirs Template to create your own repository, set the name of the repository and make sure to set it to private.

  2. Clone the Github repository

    Terminal window
    git clone https://github.com/your-username/your-repository-name.git
  3. Install the dependencies

    Make sure to install the dependencies (PNPM recommended).

    Terminal window
    cd your-repository-name
    pnpm install
  4. Copy the .env.example file to .env

    Terminal window
    cp .env.example .env
  5. Configure the environment variables

    Update the environment variables with your own values, learn more about configuring the environment variables here.

    .env
    # "http://localhost:3000" or "https://mkdirs.com"
    NEXT_PUBLIC_APP_URL=
    # -----------------------------------------------------------------------------
    # Dataset & Storage (Sanity)
    # -----------------------------------------------------------------------------
    NEXT_PUBLIC_SANITY_DATASET=
    NEXT_PUBLIC_SANITY_PROJECT_ID=
    SANITY_API_TOKEN=
    # -----------------------------------------------------------------------------
    # Email (Resend)
    # -----------------------------------------------------------------------------
    RESEND_API_KEY=
    RESEND_EMAIL_FROM=
    RESEND_EMAIL_ADMIN=
    RESEND_AUDIENCE_ID=
    # -----------------------------------------------------------------------------
    # Analytics (OpenPanel & Google Analytics)
    # -----------------------------------------------------------------------------
    NEXT_PUBLIC_OPENPANEL_CLIENT_ID=
    NEXT_PUBLIC_GOOGLE_ANALYTICS_ID=
    # -----------------------------------------------------------------------------
    # Payment (Stripe)
    # -----------------------------------------------------------------------------
    STRIPE_API_KEY=
    STRIPE_WEBHOOK_SECRET=
    NEXT_PUBLIC_STRIPE_PRO_PRICE_ID=
    # -----------------------------------------------------------------------------
    # Authentication (NextAuth)
    # -----------------------------------------------------------------------------
    AUTH_SECRET=
    AUTH_GOOGLE_ID=
    AUTH_GOOGLE_SECRET=
    AUTH_GITHUB_ID=
    AUTH_GITHUB_SECRET=
  6. Start the development server

    Start the development server and open it in your browser at http://localhost:3000

    Terminal window
    pnpm dev
  7. Build for production

    Build the application to generate code for production.

    Terminal window
    pnpm build
  8. Deploy

    Follow the deployment guides to deploy your application on your favorite platform.

Video tutorial

What’s next?

Once you have deployed your application, it’s recommended to set up a process to sync the source code from @Mkdirs/mkdirs-template to your own repository if some updates are available, for example, new features or bug fixes.

Learn more about how to sync the source code in the Develop section.

Further reading