tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-10-22 14:05:37 +02:00
Code Issues Projects Releases Wiki Activity
e7274b0ee4
silverstripe-framework/docs/en/05_Contributing/12_JavaScript_Coding_Conventions.md
Damian Mooyman 3e0b7bde9c
DOCS Add link to silverstripe npm account
2017-06-29 13:37:17 +12:00

2.8 KiB
Raw Blame History

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