diff --git a/package.json b/package.json
index 2ad9c36521..c74c688e4e 100644
--- a/package.json
+++ b/package.json
@@ -75,7 +75,8 @@
       "git add"
     ],
     "*.md": [
-      "yarn prettier-docs"
+      "yarn prettier-docs",
+      "git add"
     ]
   },
   "husky": {
diff --git a/website/docs/creating-pages.md b/website/docs/creating-pages.md
index 0afcfdb9c5..e8dbc01d25 100644
--- a/website/docs/creating-pages.md
+++ b/website/docs/creating-pages.md
@@ -45,10 +45,10 @@ Each page doesn't come with any styling. You will need to import the `Layout` co
 
 If you are familiar with other static site generators like Jekyll and Next, this routing approach will feel familiar to you. Any JavaScript file you create under `/src/pages/` directory will be automatically converted to a website page, following the `/src/pages/` directory hierarchy. For example:
 
-- `/src/pages/index.js` → `<baseUrl>/`
-- `/src/pages/test.js` → `<baseUrl>/test`
+- `/src/pages/index.js` → `<baseUrl>`
+- `/src/pages/foo.js` → `<baseUrl>/foo`
 - `/src/pages/foo/test.js` → `<baseUrl>/foo/test`
-- `/src/pages/foo/index.js` → `<baseUrl>/foo`
+- `/src/pages/foo/index.js` → `<baseUrl>/foo/`
 
 In this component-based development era, it is encouraged to co-locate your styling, markup and behavior together into components. Each page is a component, and if you need to customize your page design with your own styles, we recommend co-locating your styles with the page component in its own directory. For example, to create a "Support" page, you could do one of the following: