Styleguide

Top 23 Styleguide Open-Source Projects

  • javascript

    JavaScript Style Guide

  • Project mention: Mastering Code Quality: Setting Up ESLint with Standard JS in TypeScript Projects | dev.to | 2024-05-05

    You may be torn between those famous code styles, struggling to choose one between Airbnb JavaScript Style, Google JavaScript Style Guide, JavaScript Standard Style, or XO, among others.

  • nodebestpractices

    :white_check_mark: The Node.js best practices list (February 2024)

  • Project mention: 10 GitHub Repos for Mastering JavaScript | dev.to | 2024-04-19

    Repository: goldbergyoni/nodebestpractices

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • storybook

    Storybook is a frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.

  • Project mention: Modern React testing, part 5: Playwright | dev.to | 2024-05-06

    As a development server, we can use an actual development server of our app, like Create React App (that we use for the examples) or Vite, or another tool like React Styleguidist or Storybook, to test isolated components.

  • styleguide

    Style guides for Google-originated open-source projects

  • ruff

    An extremely fast Python linter and code formatter, written in Rust.

  • Project mention: Ruff: The Extensible Python Linter | dev.to | 2024-05-07

    Ruff is an open-source Python linter created by Astral Sh that stands out for its impressive speed, adaptability, and wide-ranging features.

  • api-guidelines

    Microsoft REST API Guidelines

  • Project mention: 5 Things I wanted to know about REST API when I was starting | dev.to | 2024-05-05

    AZURE API Guidelines

  • Primer

    The CSS design system that powers GitHub

  • Project mention: Tremor – The React library to build dashboards fast | news.ycombinator.com | 2023-07-28

    If you are looking for a dashboard system that is written in vanilla JS, I will be open sourcing my DevBoard in the next month or two. You can see it in action at https://devboard.gitsense.com/microsoft/vscode and learn more about the widget system at https://devboard.gitsense.com/microsoft/vscode?board=gitsens... Note the repo that is mentioned in the intro page hasn't been pushed to GitHub yet, but will be soon.

    The server is a very simple node/express app and the front end is written in vanilla javascript. I also use GitHub's primer css (https://github.com/primer/css) and a heavily stripped down version of tabler's css (https://github.com/tabler/tabler)

    Note, DevBoard is more geared towards hackers, so Tremor's is probably a much better fit if you are looking for an out of the box solution.

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • react-styleguidist

    Isolated React component development environment with a living style guide

  • Project mention: Modern React testing, part 5: Playwright | dev.to | 2024-05-06

    As a development server, we can use an actual development server of our app, like Create React App (that we use for the examples) or Vite, or another tool like React Styleguidist or Storybook, to test isolated components.

  • Rails style guide

    A community-driven Ruby on Rails style guide

  • state-of-the-art-shitcode

    💩State-of-the-art shitcode principles your project should follow to call it a proper shitcode

  • Project mention: State-of-the-Art Shitcode Principles | news.ycombinator.com | 2023-09-24
  • pycodestyle

    Simple Python style checker in one Python file

  • Project mention: Enhance Your Project Quality with These Top Python Libraries | dev.to | 2024-03-18

    PEP8 (pycodestyle): Named after Python’s PEP 8 style guide, this tool checks your Python code against some of the style conventions in PEP 8.

  • ue5-style-guide

    An attempt to make Unreal Engine 4 projects more consistent

  • Project mention: Why does the documentation say to use naming conventions like SKEL, SK, PHYS for Skeleton, Skeletal Mesh, Physics Asset, but all the start content use other abbreviations like SK, SKM and PA instead? | /r/unrealengine | 2023-12-11

    Doesn’t matter what you use, as long as it’s consistant. Epic changed their recommendations for skeletal meshes and skeletons between UE 4 and 5, hence the inconsistency. Michael Allar’s UE style guide is a common, long standing one. Personally I use whatever Epic’s current standard is, or what my team is using. It’s also fine to not prefix stuff, but it helps for consistency and searchability. It’s honestly more important to name things well, with cascading specificity: assetprefix_assettype_assetsubtype00 e.g. SM_Rock_Desert01, SM_Foliage_Bush_Dry_Small01 etc.

  • elixir_style_guide

    A community driven style guide for Elixir

  • clojure-style-guide

    A community coding style guide for the Clojure programming language

  • Project mention: XML is better than YAML | news.ycombinator.com | 2023-09-20

    Fixed link to that style guide entry: https://guide.clojure.style/#opt-commas-in-map-literals

    Per that style guide, the above map would be formatted like this (on HN, just indent by two spaces):

      {:a 1

  • openmoji

    Open source emojis for designers, developers and everyone else!

  • Project mention: OpenMoji: Open-source emojis for designers and developers | news.ycombinator.com | 2024-02-05
  • style-dictionary

    A build system for creating cross-platform styles.

  • Project mention: Syncing Figma Variables and StyleDictionary with GitHub Actions | dev.to | 2023-08-03

    function getStyleDictionaryConfig(brand) { return { source: [`tokens/brands/${brand}/*.json`, 'tokens/globals/**/*.json'], platforms: { /** * Available platforms: https://amzn.github.io/style-dictionary/#/config?id=platform */ web: { transformGroup: 'web', buildPath: `build/web/${brand}/`, files: [ { destination: 'tokens.scss', format: 'scss/variables', }, ], }, }, } } /** * Build the tokens for each brand. * {@see - Example based on https://github.com/amzn/style-dictionary/tree/main/examples/advanced/multi-brand-multi-platform} */ ['microsoft', 'xbox'].map(function (brand) { ['web'].map(function (platform) { const StyleDictionary = StyleDictionaryPackage.extend( getStyleDictionaryConfig(brand), ) StyleDictionary.buildPlatform(platform) }) })

  • Flake8

    flake8 is a python tool that glues together pycodestyle, pyflakes, mccabe, and third-party plugins to check the style and quality of some python code.

  • Project mention: Dagger.io : La nouvelle ère du CI/CD dans le monde DevOps | dev.to | 2024-05-14
  • ladle

    🥄 Develop, test and document your React story components faster.

  • Project mention: PSA: Storybook sends telemetry data, opt-in by default | news.ycombinator.com | 2023-09-21
  • vue-styleguidist

    Created from react styleguidist for Vue Components with a living style guide

  • wemake-python-styleguide

    The strictest and most opinionated python linter ever!

  • swift

    Airbnb's Swift Style Guide (by airbnb)

  • pytorch-styleguide

    An unofficial styleguide and best practices summary for PyTorch

  • go-styleguide

    🏆 Opinionated Styleguide for the Go language

  • SaaSHub

    SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

    SaaSHub logo
NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020).

Styleguide related posts

  • Modern React testing, part 5: Playwright

    5 projects | dev.to | 6 May 2024
  • 5 Things I wanted to know about REST API when I was starting

    1 project | dev.to | 5 May 2024
  • How to use NextJS pathname in Storybook 8

    1 project | dev.to | 29 Apr 2024
  • Storybook not picking up tailwindcss

    1 project | dev.to | 17 Apr 2024
  • Add Cypress, Playwright, and Storybook to Nx Expo Apps

    1 project | dev.to | 19 Feb 2024
  • OpenMoji: Open-source emojis for designers and developers

    1 project | news.ycombinator.com | 5 Feb 2024
  • Mastering API Design: 26 Resources for Software Engineers

    2 projects | dev.to | 20 Dec 2023
  • A note from our sponsor - SurveyJS
    surveyjs.io | 14 May 2024
    With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js. Learn more →

Index

What are some of the best open-source Styleguide projects? This list will help you:

Project Stars
1 javascript 142,083
2 nodebestpractices 96,529
3 storybook 82,947
4 styleguide 36,614
5 ruff 26,896
6 api-guidelines 22,411
7 Primer 12,465
8 react-styleguidist 10,797
9 Rails style guide 6,451
10 state-of-the-art-shitcode 5,374
11 pycodestyle 4,987
12 ue5-style-guide 4,903
13 elixir_style_guide 4,303
14 clojure-style-guide 3,978
15 openmoji 3,772
16 style-dictionary 3,668
17 Flake8 3,276
18 ladle 2,471
19 vue-styleguidist 2,444
20 wemake-python-styleguide 2,431
21 swift 2,267
22 pytorch-styleguide 1,826
23 go-styleguide 1,468

Sponsored
SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives
www.saashub.com