1
0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00
unleash.unleash/website/static
Thomas Heartman 0e3e725a17
docs: add "The Anatomy of Unleash" (#2138)
## What

This PR

1. adds a new topic document, "The Anatomy of Unleash", which explains
how Unleash is built up as a system.
2. It also moves the "topic guides" sidebar entry from position 4 to
position 2.
3. Finally, it introduces a new `Figure` component for the
documentation, to be used with images that should be shown with
captions.

## Why

Referring to the same numbers as mentioned above, here's some background
for these changes:

1. We have gotten requests from enterprise users for a way to help new
Unleash users understand the system. Together with customer success and
customer journey, we agreed that an explanatory guide would be suitable.
It aims to give the reader an introduction into what pieces constitute
the Unleash system.
2. As part of a discussion, it was suggested to move topic guides higher
up to make them more visible. There's a few reasons for this:
1. New users of Unleash should be able to keep reading about Unleash
after the basic introductory material. When left at the bottom, topic
guides are often overlooked
2. As a justification, it was proposed that reference docs are often the
last thing you look for, so it makes sense to put that last.
3. Thinking about a new user's flow, it also makes some sense: first
read introductory material, then dive deeper into what Unleash is and
what you can use it for, then look for how-to guides if you're stuck,
and finally consult the reference material for later.
3. These diagrams aren't necessarily very self-explanatory, so adding a
caption makes a lot of sense. We didn't have a component from this
previously, so I added one.

Co-authored-by: NicolaeUnleash <103567375+NicolaeUnleash@users.noreply.github.com>
Co-authored-by: Simon Hornby <liquidwicked64@gmail.com>

## Commits

* docs: add raw export of anatomy document

* docs: move the topic guides section to near top of sidebar

* docs: add inter-doc links, some reformatting

* docs: fix broken links

* docs: add a Figure element for figures with captions

* docs: add more styling to figures

* docs: align on styles

* Fix: add fuller figure caption

* docs: rephrase heading

* Docs(test): try new way of importing images

* Docs(test): images take 3

* docs: Convert all images to using the figure component

* docs: add projects to list of top-level resources

* docs: add captions for all figures.

* docs: reorder images

* Docs(fix): typo: extra brackets

* Docs(style): remove box shadows and border on fig caption images

* Docs(chore): remove commented-out css

* Docs(refactor): use css variable for small font size.

To facilitate reusability and convey meaning.

* docs: rename anatomy doc

* docs: add note about strategies vs constraints

* Updating the images

* Apply suggestions from code review

Co-authored-by: Simon Hornby <liquidwicked64@gmail.com>

* Update website/docs/topics/the-anatomy-of-unleash.mdx

* Docs(fix): remove redundant comma

* docs: add link to node js sdk

* docs: mention that a toggle must be active in an env to be enabled

* docs: add note about environments and api keys

* Docs(reword): swap dev and prod in example

* docs: fix typo in the image

* docs: make figures in text full-width

* docs: move environments and API keys call-out to after figure

* docs: add borders to figures

* docs: add image float css idea

* Revert "docs: add image float css idea"

This reverts commit 69f27d304b.

Co-authored-by: NicolaeUnleash <103567375+NicolaeUnleash@users.noreply.github.com>
Co-authored-by: Simon Hornby <liquidwicked64@gmail.com>
2022-10-19 13:14:49 +02:00
..
img docs: add "The Anatomy of Unleash" (#2138) 2022-10-19 13:14:49 +02:00
.nojekyll fix: rename websitev2 to website 2021-10-26 11:25:19 +02:00
CNAME fix: rename websitev2 to website 2021-10-26 11:25:19 +02:00
README.md chore(workflows): update with new branch names 2021-12-23 14:12:19 +01:00

The Unleash website was created with Docusaurus. The source code lives as part of the main Unleash repo on GitHub and is built and deployed on all merges to main. This makes it easy to keep the documentation in sync with the latest version of Unleash.

It's hosted on https://docs.getunleash.io

What's In This Document

Get Started in 5 Minutes

  1. Make sure all the dependencies for the website are installed:
# Install dependencies
$ npm install
  1. Run your dev server:
# Start the site
$ npm run start

Directory Structure

Your project file structure should look something like this

unleash/
  website/
    /docs
        doc-1.md
        doc-2.md
        doc-3.md
    static/
      css/
      img/
    package.json
    sidebar.json
    docusaurus.config.js

Editing Content

Editing an existing docs page

Edit docs by navigating to docs/ and editing the corresponding document:

docs/doc-to-be-edited.md

---
id: page-needs-edit
title: This Doc Needs To Be Edited
---

Edit me...

For more information about docs, click here

Adding Content

Adding a new docs page to an existing sidebar

  1. Create the doc as a new markdown file in /docs, example docs/newly-created-doc.md:
---
id: newly-created-doc
title: This Doc Needs To Be Edited
---

My new content here..
  1. Refer to that doc's ID in an existing sidebar in website/sidebars.json:
// Add newly-created-doc to the Getting Started category of docs
{
  "docs": {
    "Getting Started": [
      "quick-start",
      "newly-created-doc" // new doc here
    ],
    ...
  },
  ...
}

For more information about adding new docs, click here

Adding items to your site's top navigation bar

  1. Add links to docs, custom pages or external links by editing the headerLinks field of website/siteConfig.js:

website/siteConfig.js

{
  headerLinks: [
    ...
    /* you can add docs */
    { doc: 'my-examples', label: 'Examples' },
    /* you can add custom pages */
    { page: 'help', label: 'Help' },
    /* you can add external links */
    { href: 'https://github.com/facebook/Docusaurus', label: 'GitHub' },
    ...
  ],
  ...
}

For more information about the navigation bar, click here

Full Documentation

Full documentation can be found on the website.