tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-06-29 07:59:31 +02:00
Code Issues Projects Releases Wiki Activity
74e5a94b32
silverstripe-framework/docs/en/05_Contributing/12_JavaScript_Coding_Conventions.md
Aaron Carlino 6888901468
NEW: Update docs to be compliant with Gatsby site (#9314) 
* First cut

* Temporarily disable composer.json for netlify build

* POC

* New recursive directory query, various refinements

* Fix flexbox

* new styled components plugin

* Apply frontmatter delimiters

* Mobile styles, animation

* Search

* Redesign, clean up

* Nuke the cache, try again

* fix file casing

* Remove production env file

* ID headers

* Move app to new repo

* Add frontmatter universally

* Hide children changelogs

* Add how to title

* New callout tags

* Revert inline code block change

* Replace note callouts

* Fix icons

* Repalce images

* Fix icon

* Fix image links

* Use proper SQL icon
2019-11-18 17:58:33 +13:00

2.9 KiB
Raw Blame History

title summary iconBrand
Javascript coding conventions The Javascript style guidelines we follow in our open source software js

JavaScript Coding Conventions

Overview

This document provides guidelines for code formatting to developers contributing to SilverStripe. It applies to all JavaScript files in the framework/ and cms/ modules.

In 2016, SilverStripe started a rewrite of its CMS interface in ES6 and ReactJS. Code written prior to this rewrite might not follow these conventions, and is placed in a legacy/ folder structure.

NPM Packages

SilverStripe authored npm dependencies are posted under the silverstripe npm organisation.

Browser support

Check our requirements documentation.

Conventions

We follow the AirBnB JavaScript Conventions, as well as the AirBnB React Conventions. A lot of their rules can be validated via ESLint, and can be checked locally via yarn run lint.

Spelling

All symbols and documentation should use UK-English spelling (e.g. "behaviour" instead of "behavior"), except when necessitated by third party conventions (e.g using "color" for CSS styles).

File and Folder Naming

  • All frontend files (CSS, JavaScript, images) should be placed in a client/ folder on the top level of the module
  • Frontend files relating to the framework CMS UI should be placed in admin/client
  • File names should follow the AirBnB Naming Conventions
  • The client/src/components folder should contain only React presentational components. These components should be self-contained, and shouldn't know about Redux state.
  • The client/src/containers folder should contain only React container components
  • React classes in client/src/components and client/src/containers should have one folder per component, alongside a README.md and SCSS files where applicable.
  • The client/src/state folder should contain Redux actions, action types and reducers. Each set of these should be kept in a folder named the same as its reducer state key.
  • JavaScript tests should be named after the module/class they're testing, with their file name suffixed with -tests.js.
  • JavaScript tests should be placed in a tests/ subfolder alongside the module code.

Related