Palette Docs

Docs for Palette, built on top of Gatsby.

Meta

• Docs URL: https://palette.artsy.net
• Palette Github Repo: https://github.com/artsy/palette
• Storybook: https://palette-storybook.artsy.net
• Point People: @damassi, @dzucconi

Development

yarn start

open http://localhost:8000
open http://localhost:8000/___graphql
open http://localhost:8000/admin

Deployment

Merges to main are automatically deployed to https://palette.artsy.net.

Docs Architecture

Gatsby API Details

1. gatsby-browser.js: This file is where Gatsby expects to find any usage of the Gatsby browser APIs (if any). These allow customization/extension of default Gatsby settings affecting the browser.
2. gatsby-config.js: This is the main configuration file for a Gatsby site. This is where you can specify information about your site (metadata) like the site title and description, which Gatsby plugins you’d like to include, etc. (Check out the config docs for more detail).
3. gatsby-node.js: This file is where Gatsby expects to find any usage of the Gatsby Node APIs (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
4. gatsby-ssr.js: This file is where Gatsby expects to find any usage of the Gatsby server-side rendering APIs (if any). These allow customization of default Gatsby settings affecting server-side rendering.

Docs Search

Search within the Palette docs is implemented with Algolia DocSearch. How?

1. The Palette docs are decorated with markers for Algolia's crawler. (See here, here, and here.)
2. The Palette docs site is configured to be crawled by Algolia in their algolia/docsearch-configs project.
3. The search box on the docs site sends search text through Algolia's JavaScript, to hit the index built by crawling the Palette docs. See this implementation PR.
4. The search results are styled by overriding Algolia's default styles.