refactor(storybook): completely remove storybook (nodejs#2636)

.eslintrc.js

@@ -1,9 +1,5 @@
 module.exports = {
-  extends: [
-    'airbnb',
-    'plugin:prettier/recommended',
-    'plugin:storybook/recommended',
-  ],
+  extends: ['airbnb', 'plugin:prettier/recommended'],
   env: {
     browser: true,
     node: true,

.github/PULL_REQUEST_TEMPLATE.md

@@ -13,7 +13,7 @@ Please follow this check list to ensure that you've followed all items before op
 - [ ] I have run `npm run lint:js -- --fix` and/or `npm run lint:md -- --fix` for my JavaScript and/or Markdown changes.
   - This is important as most of the cases your code changes might not be correctly linted
 - [ ] I have run `npm run test` to check if all tests are passing, and/or `npm run test -- -u` to update snapshots if I created and/or updated React Components.
-- [ ] I have checked that the build works locally and that `npm run build` and `npm run build-storybook` work fine.
+- [ ] I have checked that the build works locally and that `npm run build` work fine.
 - [ ] I've covered new added functionality with unit tests if necessary.
 
 ## Description

.github/workflows/gatsby.yml

@@ -20,6 +20,3 @@ jobs:
 
       - name: Run Gatsby Build
         run: npm run build-ci
-
-      - name: Run Storybook Build
-        run: npm run build-storybook

.github/workflows/generate-preview.yml

@@ -47,11 +47,6 @@ jobs:
         env:
           PATH_PREFIX: ${{ github.event.pull_request.number }}/
 
-      - name: Run Storybook Build
-        run: npm run build-storybook
-        env:
-          PATH_PREFIX: ${{ github.event.pull_request.number }}/
-
       - name: Upload to GCS
         run: gsutil -m rsync -R public gs://staging.nodejs.dev/${{ github.event.pull_request.number }}/
 

CONTRIBUTING.md

@@ -94,14 +94,6 @@ In the case of an objection being raised in a pull request by another collaborat
 * Pull Request must remain open for 72 hours without any objections
 * Once the requirements are met and approved, the pull request can be merged and a member of @nodejs/community-committee will add the new member to the [@nodejs/nodejs-dev team](https://github.com/orgs/nodejs/teams/nodejs-dev)
 
-## 📕 Storybook
-
-This project uses [Storybook][], a tool which provides a sandbox environment for developing UI components. To generate the Storybook locally:
-
-* Run `npm run storybook`
-* Navigate to `localhost:6006`
-
-The production Storybook can be viewed at <https://nodejs.dev/storybook>
 
 ## 🐛 Debugging Failing Checks
 
@@ -135,7 +127,6 @@ By making a contribution to this project, I certify that:
   including my sign-off) is maintained indefinitely and may be redistributed consistent
   with this project or the open source license(s) involved.
 
-[Storybook]: https://storybook.js.org/
 [`squash`]: https://help.github.com/en/articles/about-pull-request-merges#squash-and-merge-your-pull-request-commits
 [conventional commits]: https://www.conventionalcommits.org/
 [nodejs.dev repo]: https://github.com/nodejs/nodejs.dev

cloudbuild-deploy.yaml

@@ -19,9 +19,6 @@ steps:
   - name: 'node:16'
     entrypoint: npm
     args: ['run', 'build']
-  - name: 'node:16'
-    entrypoint: npm
-    args: ['run', 'build-storybook']
   - name: 'gcr.io/$PROJECT_ID/firebase'
     args: ['deploy', '--project', '$PROJECT_ID', '--only', 'hosting']
 timeout: 900s

docs/project-overview.md

@@ -4,81 +4,24 @@
 
 A quick look at some of the top-level files and directories found in this project.
 
-```console
-.
-├── .github
-├── .storybook
-├── meetings
-├── node_modules
-├── src
-├── stories
-├── style-guide
-├── test
-├── util-node
-├── .editorconfig
-├── .eslintignore
-├── .eslintrc.js
-├── .firebaserc
-├── .gitignore
-├── .nvmrc
-├── .prettierignore
-├── .prettierrc
-├── .remarkrc
-├── cloudbuild-deploy.yaml
-├── CODE_OF_CONDUCT.md
-├── CONTRIBUTING.md
-├── empty.env
-├── firebase.json
-├── gatsby-browser.js
-├── gatsby-config.js
-├── gatsby-node.js
-├── LICENSE
-├── ModerationPolicy.md
-├── OKR.md
-├── package-lock.json
-├── package.json
-├── README.md
-├── test-preprocessor.js
-├── test-setup.js
-└── tsconfig.json
-
-```
-
-1. **`.storybook`**: This directory contains configuration files so the [storybook](https://storybook.js.org/) package works as it should. Storybook is used to build the individual UI components in this project.
-
-2. **`/node_modules`**: The directory where all of the modules of code that your project depends on (npm packages) are automatically installed.
-
-3. **`/src`**: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser), like your site header, or a page template. "Src" is a convention for "source code."
-
-4. **`/stories`**: This directory contains stories for UI components used in this project. You can find out what a story is [here](https://storybook.js.org/docs/react/get-started/whats-a-story). Also, you can run them locally using `npm run storybook`. Our public story link can be found [here](https://nodejs.dev/storybook).
-
-5. **`/test`**: Tests for this projects are stored in this directory. This project uses [Jest](https://jestjs.io/) as it's testing framework.
-
-6. **`/util-node`**: Custom utility functions that require nodeJs to run can be stored in files inside this directory. An example is the create-slug function in the createSlug.js file that generates unique slugs for articles.
-
-7. **`.gitignore`**: This file tells git which files it should not track/not maintain a version history.
-
-8. **`.nvmrc`**: nvm configuration so packages work as they should
-
-9. **`.prettierrc`**: This is a configuration file for a tool called [Prettier](https://prettier.io/), which is a tool to help keep the formatting of your code consistent.
-
-10. **`empty.env`**: Rename to **`.env`** and set your Contentful API key
-
-11. **`gatsby-browser.js`**: This file is where Gatsby expects to find any usage of the [Gatsby browser APIs](https://www.gatsbyjs.com/docs/browser-apis/) (if any). These allow customization/extension of default Gatsby settings affecting the browser.
-
-12. **`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](https://www.gatsbyjs.com/docs/reference/config-files/gatsby-config/) for more detail).
-
-13. **`gatsby-node.js`**: This file is where Gatsby expects to find any usage of the [Gatsby node APIs](https://www.gatsbyjs.com/docs/reference/config-files/gatsby-node/) (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
-
-14. **`LICENSE`**: Gatsby is licensed under the MIT license.
-
-15. **`package-lock.json`** (See `package.json` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. (You won't change this file directly).
-
-16. **`package.json`**: A manifest file for Node.js projects, which includes things like metadata (the project's name, author, etc.). This manifest is how npm knows which packages to install for your project.
-
-17. **`README.md`**: A text file containing useful reference information about your project.
-
-18. **`tsconfig.json`**: Config file for TypeScript
+1. **`/node_modules`**: The directory where all of the modules of code that your project depends on (npm packages) are automatically installed.
+1. **`/src`**: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser), like your site header, or a page template. "Src" is a convention for "source code."
+1. **`/content`**: This directory contains all the contents of (pages, blog posts, doc pages) of the website. They're all done in Markdown and MDX.
+1. **`/test`**: Tests for this projects are stored in this directory. This project uses [Jest](https://jestjs.io/) as it's testing framework.
+1. **`/util-node`**: Custom utility functions that require nodeJs to run can be stored in files inside this directory. An example is the create-slug function in the createSlug.js file that generates unique slugs for articles.
+1. **`.gitignore`**: This file tells git which files it should not track/not maintain a version history.
+1. **`.nvmrc`**: nvm configuration so packages work as they should
+1. **`.prettierrc`**: This is a configuration file for a tool called [Prettier](https://prettier.io/), which is a tool to help keep the formatting of your code consistent.
+1. **`empty.env`**: Rename to **`.env`** and set your Contentful API key
+1. **`gatsby-browser.js`**: This file is where Gatsby expects to find any usage of the [Gatsby browser APIs](https://www.gatsbyjs.com/docs/browser-apis/) (if any). These allow customization/extension of default Gatsby settings affecting the browser.
+1. **`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](https://www.gatsbyjs.com/docs/reference/config-files/gatsby-config/) for more detail).
+1. **`gatsby-node.js`**: This file is where Gatsby expects to find any usage of the [Gatsby node APIs](https://www.gatsbyjs.com/docs/reference/config-files/gatsby-node/) (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
+1. **`LICENSE`**: Gatsby is licensed under the MIT license.
+1. **`package-lock.json`** (See `package.json` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. (You won't change this file directly)
+1. **`package.json`**: A manifest file for Node.js projects, which includes things like metadata (the project's name, author, etc.). This manifest is how npm knows which packages to install for your project.
+1. **`README.md`**: A text file containing useful reference information about your project.
+1. **`TRANSLATING.md`**: A text file containing useful reference about how to contribute with translations.
+1. **`tsconfig.json`**: Config file for TypeScript
 
 ## 📝 Data Sources
 
@@ -92,6 +35,5 @@ The content folder is responsible for aggregating all the content of the Website
 
 Looking for more guidance? Full documentation for Gatsby lives [on the website](https://www.gatsbyjs.com/). Here are some places to start:
 
-* **For most developers, we recommend starting with our [in-depth tutorial for creating a site with Gatsby](https://www.gatsbyjs.com/docs/tutorial/).** It starts with zero assumptions about your level of ability and walks through every step of the process.
-
-* **To dive straight into code samples head [to our documentation](https://www.gatsbyjs.com/docs/).** In particular, check out the "Guides", API reference, and "Advanced Tutorials" sections in the sidebar.
+- **For most developers, we recommend starting with our [in-depth tutorial for creating a site with Gatsby](https://www.gatsbyjs.com/docs/tutorial/).** It starts with zero assumptions about your level of ability and walks through every step of the process.
+- **To dive straight into code samples head [to our documentation](https://www.gatsbyjs.com/docs/).** In particular, check out the "Guides", API reference, and "Advanced Tutorials" sections in the sidebar.

package.json

@@ -82,22 +82,13 @@
     "lint:scss": "stylelint --config ./.stylelintrc.json \"./src/**/*.{css,sass,scss}\"",
     "lint:fix": "npm run lint -- --fix",
     "serve": "npm run build && clear && gatsby serve",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build -o ./public/storybook",
     "a11y": "./node_modules/pa11y/bin/pa11y.js localhost:8000",
     "type-check": "tsc --noEmit",
     "postinstall": "patch-package"
   },
   "devDependencies": {
     "@babel/core": "^7.18.10",
     "@babel/preset-typescript": "^7.18.6",
-    "@storybook/addon-actions": "~7.0.0-alpha.18",
-    "@storybook/addon-links": "~7.0.0-alpha.18",
-    "@storybook/addons": "~7.0.0-alpha.18",
-    "@storybook/builder-webpack5": "~7.0.0-alpha.18",
-    "@storybook/manager-webpack5": "~7.0.0-alpha.10",
-    "@storybook/react": "~7.0.0-alpha.18",
-    "@storybook/react-webpack5": "^7.0.0-alpha.0",
     "@testing-library/dom": "^8.16.0",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.3.0",
@@ -128,7 +119,6 @@
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.30.1",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-storybook": "^0.6.2",
     "eslint-plugin-testing-library": "^5.6.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^28.1.3",
@@ -142,8 +132,6 @@
     "remark-preset-lint-node": "^3.3.1",
     "sass": "^1.54.1",
     "sass-loader": "^13.0.2",
-    "storybook": "future",
-    "storybook-addon-gatsby": "^0.0.5",
     "stylelint": "^14.9.1",
     "stylelint-config-prettier": "^9.0.3",
     "stylelint-config-recommended-scss": "^7.0.0",