Skip to main content
Version: 3.x

Before going to production

Before going into production, you should ensure that everything has been customized to provide the best possible experience to your users. Some features are not critical enough to block your development and you may have forgotten them during the project. This page contains a checklist to help you before the go-live!

To make sure you're ready, go through this checklist:

  • Style your Offline page
info

This page is accessible when you disable your network while browsing your shop. If you have FRONT_COMMERCE_ENV !== "production", this page will also be available at /__front-commerce/offline. You can then override the theme/pages/Offline component to make sure that this page suits your brand.

  • Style your Maintenance page
info

This page is accessible when your backend is in maintenance mode (HTTP 503). If you have FRONT_COMMERCE_ENV !== "production", this page will also be available at /__front-commerce/maintenance. You can then override the theme/pages/Maintenance component to make sure that this page suits your brand.

And take the opportunity to learn more about maintenance mode with our guide.

  • Ensure your server can serve the application in HTTPS mode.
info

Front-Commerce is aimed at being exposed in HTTPS when in production mode (NODE_ENV === "production"). It will redirect users to an HTTPS URL if they try to access a page using HTTP. Cookies are also set with secure mode.

  • Ensure that your PWA is set up.
info

It allows users to install your store as a native application on their device. See the PWA Setup guide.

  • Override robots.txt if necessary.
info

By default, your robots.txt is generated and looks something like this:

User-agent: *
Allow: /
(Disallow: / in development)
Sitemap: https://shopURL.com/sitemap.xml

You can see how it is generated here. If you need to customize your robots.txt, override robots[.txt].tsx :

app/routes/robots[.txt].tsx
import type { LoaderFunctionArgs } from "@remix-run/node";
import { generateRobotsTxt } from "@front-commerce/remix/seo";
import { FrontCommerceApp } from "@front-commerce/remix";

const ONE_HOUR = 60 * 60;
const ONE_DAY = 24 * ONE_HOUR;

export function loader({ context }: LoaderFunctionArgs) {
  const app = new FrontCommerceApp(context.frontCommerce);

  app.services.CacheControl.setCacheable({
    sMaxAge: ONE_HOUR,
    staleWhileRevalidate: ONE_DAY,
  });

  return generateRobotsTxt(
    [
      {
        type: "sitemap",
        value: new URL("/sitemap.xml", app.config.shop.url).toString(),
      },
    ],
    {
      allowCrawling: true,
    }
  );
}