Skip to content

Commit

Permalink
Merge pull request #26490 from storybookjs/fix-get-started-2-latest
Browse files Browse the repository at this point in the history
Docs: Fix get started 2 (latest)
  • Loading branch information
kylegach authored Mar 13, 2024
2 parents f7b00e0 + 7e9d314 commit 607d59b
Show file tree
Hide file tree
Showing 3 changed files with 11 additions and 11 deletions.
18 changes: 9 additions & 9 deletions docs/get-started/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,22 +115,22 @@ Want to know more about installing Storybook? Check out the [installation guide]
Storybook is a powerful tool that can help you with many aspects of your UI development workflow. Here are some of the main concepts to get you started.

<div class="sb-grid two-up">
<a href="../writing-stories/index.md" class="card card-large concept">
<a href="../writing-stories/" class="card card-large concept">
<img src="/images/icons/icon-story.svg" alt="" width="20" height="20" class="img" />
<h3>Stories</h3>
<p>A story captures the rendered state of a UI component. Each component can have multiple stories, where each story describes a different component state.</p>
</a>
<a href="../writing-docs/index.md" class="card card-large concept">
<a href="../writing-docs/" class="card card-large concept">
<img src="/images/icons/icon-docs.svg" alt="" width="20" height="20" class="img" />
<h3>Docs</h3>
<p>Storybook can analyze your components to automatically create documentation alongside your stories. This automatic documentation makes it easier for you to create UI library usage guidelines, design system sites, and more.</p>
</a>
<a href="../writing-tests/index.md" class="card card-large concept">
<a href="../writing-tests/" class="card card-large concept">
<img src="/images/icons/icon-testing.svg" alt="" width="20" height="20" class="img" />
<h3>Testing</h3>
<p>Stories are a pragmatic starting point for your UI testing strategy. You already write stories as a natural part of UI development, so testing those stories is a low-effort way to prevent UI bugs over time.</p>
</a>
<a href="../sharing/index.md" class="card card-large concept">
<a href="../sharing/" class="card card-large concept">
<img src="/images/icons/icon-sharing.svg" alt="" width="20" height="20" class="img" />
<h3>Sharing</h3>
<p>Publishing your Storybook allows you to share your work with others. You can also embed your stories in places like Notion or Figma.</p>
Expand All @@ -142,7 +142,7 @@ Storybook is a powerful tool that can help you with many aspects of your UI deve
Once you've learned the basics, explore these other ways to get the most out of Storybook.

<div class="sb-grid three-up">
<a href="../essentials/index.md" class="resource">
<a href="../essentials/" class="resource">
<img src="/images/icons/icon-more.svg" width="28" height="28" alt="" class="img" />
Essential addons
</a>
Expand All @@ -154,19 +154,19 @@ Once you've learned the basics, explore these other ways to get the most out of
<img src="/images/icons/icon-more.svg" width="28" height="28" alt="" class="img" />
Recipes
</a>
<a href="../builders/index.md" class="resource">
<a href="../builders/" class="resource">
<img src="/images/icons/icon-more.svg" width="28" height="28" alt="" class="img" />
Builders
</a>
<a href="../contribute/index.md" class="resource">
<a href="../contribute/" class="resource">
<img src="/images/icons/icon-more.svg" width="28" height="28" alt="" class="img" />
How to contribute
</a>
<a href="../migration-guide/index.md" class="resource">
<a href="../migration-guide/" class="resource">
<img src="/images/icons/icon-more.svg" width="28" height="28" alt="" class="img" />
Migrate to 8.0
</a>
<a href="../faq.md" class="resource">
<a href="../faq" class="resource">
<img src="/images/icons/icon-more.svg" width="28" height="28" alt="" class="img" />
FAQ
</a>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```shell
# Builds Storybook with Angular's custom builder
# See https://storybook.js.org/docs/get-started/install
# See https://storybook.js.org/docs/get-started/angular
# to learn how to create the custom builder
ng run my-project:build-storybook
```
2 changes: 1 addition & 1 deletion docs/writing-docs/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ Storybook gives you tools to expand this essential documentation with prose and

![Docs page](./docs-completed.png)

If you're including Storybook in your project for the [first time](../get-started/install.md), we provide you with a [documentation page](./autodocs.md) ("Autodocs" for short), positioned near your stories. It's a baseline template automatically generated, listing your existing stories and relevant metadata.
If you're including Storybook in your project for the [first time](../get-started/index.md), we provide you with a [documentation page](./autodocs.md) ("Autodocs" for short), positioned near your stories. It's a baseline template automatically generated, listing your existing stories and relevant metadata.

Additionally, you can customize this template if needed or create free-form pages for each component using [MDX](./mdx.md). In both cases, you’ll use Doc Blocks as the building blocks to create full-featured documentation.

Expand Down

0 comments on commit 607d59b

Please sign in to comment.