diff --git a/README.md b/README.md
index 665428a..7d34421 100644
--- a/README.md
+++ b/README.md
@@ -482,19 +482,35 @@ Note: This tutorial was updated on macOS 11.6.2.
     end
     ```
 
-22. add route for mounting the GraphiQL browser endpoint:
+22. add routes for our GraphQL API and GraphiQL browser endpoints:
 
     `lib/zero_phoenix_web/router.ex`:
 
+    replace
+
     ```elixir
-    scope "/graphiql" do
+    scope "/api", ZeroPhoenixWeb do
       pipe_through :api
+    end
+    ```
+
+    with
+
+    ```
+    scope "/" do
+      pipe_through :api
+
+      if Mix.env() in [:dev, :test] do
+        forward "/graphiql",
+          Absinthe.Plug.GraphiQL,
+          schema: ZeroPhoenixWeb.Graphql.Schema,
+          json_codec: Jason,
+          interface: :playground
+      end
 
-      forward "/",
-              Absinthe.Plug.GraphiQL,
-              schema: ZeroPhoenixWeb.Graphql.Schema,
-              json_codec: Jason,
-              interface: :playground
+      forward "/graphql",
+        Absinthe.Plug,
+        schema: ZeroPhoenixWeb.Graphql.Schema
     end
     ```
 
diff --git a/lib/zero_phoenix_web/router.ex b/lib/zero_phoenix_web/router.ex
index 092ca19..c37be6b 100644
--- a/lib/zero_phoenix_web/router.ex
+++ b/lib/zero_phoenix_web/router.ex
@@ -8,15 +8,17 @@ defmodule ZeroPhoenixWeb.Router do
   scope "/" do
     pipe_through :api
 
+    if Mix.env() in [:dev, :test] do
+      forward "/graphiql",
+        Absinthe.Plug.GraphiQL,
+        schema: ZeroPhoenixWeb.Graphql.Schema,
+        json_codec: Jason,
+        interface: :playground
+    end
+
     forward "/graphql",
-            Absinthe.Plug,
-            schema: ZeroPhoenixWeb.Graphql.Schema
-
-    forward "/graphiql",
-            Absinthe.Plug.GraphiQL,
-            schema: ZeroPhoenixWeb.Graphql.Schema,
-            json_codec: Jason,
-            interface: :playground
+      Absinthe.Plug,
+      schema: ZeroPhoenixWeb.Graphql.Schema
   end
 
   # Enables LiveDashboard only for development