You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
docs: fix some sentences in the "Welcome to the Community" and "Introduction to Storybook" section for clarity and fix some typos. (open-sauced#130)
* Update welcome-to-the-community.md Added more context and fixed the unordered list inconsistent spacing * Update introduction-to-contributing.md Revised and clarified the "Testing" section, and provided additional details in the "Building" section. * doc: Improved the Storybook doc by fixing typos, rephrased sentences to be clear and fixed heading inconsistencies Worked on this issue. The "Introduction to Storybook" doc needs improvement open-sauced#133
Copy file name to clipboardExpand all lines: docs/community/welcome-to-the-community.md
+1-3Lines changed: 1 addition & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -24,11 +24,8 @@ At OpenSauced, we strive to create a welcoming and inclusive community for every
24
24
The OpenSauced community is a group of open-source enthusiasts who are passionate about making open-source more accessible to everyone. Here are some ways you can keep up with what we're doing:
25
25
26
26
- 🐦 Follow us on Twitter [@SaucedOpen](https://twitter.com/saucedopen) for announcements and our frequent Twitter Spaces.
27
-
28
27
- Join our [Discord](https://discord.gg/opensauced), and hang out with us in our weekly office hours.
29
-
30
28
- Subscribe to our [YouTube channel](https://www.youtube.com/@OpenSauced) for the latest updates and video content for OpenSauced.
31
-
32
29
- 📰 Subscribe to our [newsletter](https://news.opensauced.pizza/#/portal/signup) for all things OpenSauced and open source.
33
30
34
31
## How can I get involved?
@@ -40,6 +37,7 @@ You can get involved in the OpenSauced community in a few ways:
40
37
- Share what you're working on, ask questions, or mentor new contributors in our [Discord](https://discord.gg/opensauced).
41
38
42
39
## Resources on Getting Started with Open Source
40
+
Getting started with open source can be quite daunting for beginners, so we've put together some resources to help you get started.
43
41
44
42
- 📝 Check out our [Dev blog](https://dev.to/opensauced) where we provide resources for open-source contributors.
45
43
- 📖 Take our [Intro to Open Source Course](https://github.com/open-sauced/intro) to help you get started with open-source.
Copy file name to clipboardExpand all lines: docs/contributing/introduction-to-contributing.md
+3-2Lines changed: 3 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -34,19 +34,20 @@ npm ci
34
34
```
35
35
36
36
## Building
37
+
To generate a production-ready version of your code, run:
37
38
38
39
```shell
39
40
npm run build
40
41
```
41
42
42
43
## Testing
43
44
44
-
For running the test suite, use the following command. Since the tests run in watch mode by default, some users may encounter errors about too many files being open. In this case, it may be beneficial to [install watchman](https://facebook.github.io/watchman/docs/install.html).
45
-
45
+
For running the test suite, use the following command:
46
46
```shell
47
47
# the tests will run in watch mode by default
48
48
npm test
49
49
```
50
+
Since the tests run in watch mode by default, some users may encounter errors about too many files being open. In this case, it may be beneficial to [install watchman](https://facebook.github.io/watchman/docs/install.html).
50
51
51
52
For more info on testing React and JavaScript, check out this course [Testing JavaScript](https://testingjavascript.com/)
Copy file name to clipboardExpand all lines: docs/technical/introduction-to-storybook.md
+11-11Lines changed: 11 additions & 11 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@ sidebar_label: Introduction to storybook
5
5
keywords:
6
6
- Introduction to storybook
7
7
---
8
-
8
+
Storybook is an open-source tool that helps developers build, test, and document UI components in isolation.
9
9
Storybook is being leveraged to mock out visual React components. The latest version of the design system can be found at this [URL](https://sauced-components.netlify.app/).
10
10
11
11
To run storybook, use this command:
@@ -20,34 +20,34 @@ Storybook is broken into several categories:
20
20
21
21
<ul>
22
22
<li><b>Button:</b> These are the button elements that appear in the project in various forms. They primarily are the Button component in the project but can also be icons.</li>
23
-
<li><b>Cards:</b> These are the main container elements in the project. Each item represents a live component in their current form in the project.</li>
23
+
<li><b>Cards:</b> These are the main container elements in the project. Each item represents a live component in its current form in the project.</li>
24
24
<li><b>Primitives: These are the basic styling of base HTML components.</b></li>
25
-
<li><b>Nav:</b> This is the main navigation bar for the project. There are two states, when there is no user logged in and when a user is logged in.</li>
25
+
<li><b>Nav:</b> This is the main navigation bar for the project. There are two states—when there is no user logged in and when a user is logged in.</li>
26
26
<li><b>Footer:</b> This represents the various footers for the project.</li>
27
-
<li><b>Homepage:</b> This is the main component for the project homepage and shows the home page in its current form.</li>
27
+
<li><b>Homepage:</b> This is the main component of the project homepage and shows the home page in its current form.</li>
28
28
<li><b>Miscellaneous:</b> These are components that currently don't fit neatly into the above categories.</li>
29
29
</ul>
30
30
31
31
## Making changes to storybook
32
32
33
-
This section details how to make changes to Storybook, mainly creating new categories or UI elements.
34
-
35
-
## Adding a new category
33
+
This section details how to make changes to Storybook, mainly by creating new categories or UI elements.
36
34
37
-
To add a new category, a new file needs to be added to `/stories`. Please follow the naming convention of `*Previous File Number + 1*-*Name of Story Capitalized*-stories.js` when creating a new file. In the file ensure you have this code in the file:
35
+
### Adding a new category
38
36
37
+
To add a new category, a new file needs to be added to the `/stories` directory. When creating a new file, the filename should be named using the following convention: ```*Previous File Number + 1*-*Name of Story Capitalized*-stories.js```. For example, if the last file was 2-SideBar-stories.js, then the new file should be named ```3-NameOfYourFile-stories.js```.
38
+
In the file ensure you have this code:
39
39
```
40
40
export default {
41
41
title: "*Name of category*"
42
42
};
43
43
```
44
44
45
-
## Adding a new UI element
45
+
###Adding a new UI element
46
46
47
-
To add a new UI element to to an existing category, add the following code to that category's file:
47
+
To add a new UI element to an existing category, add the following code to that category's file:
0 commit comments