Core v4 Style Guide

Git

Branch name/feature/short-description

mike/blogs/logo-fix

Backend Source File

Folder kebab-case

backend/main-endpoints/routes

File kebab-case

officer-manager.js

Frontend Source File

Folder kebab-case

frontend/src/pages/printing-analytics

React File PascalCase.jsx

ProfileHeader.jsx

Stylesheet PascalCase

ProfileHeader.css

ProfileHeader.scss

Others kebab-case

helper-function.js

header-image.jpg

MongoDB

Database camelCaseDB

• camelCase

• append DB to the end of the name

• singular

  ```

  myNewDB

  ```

Collection lowercasenoseparator

• lowercase

• no separators

• plural

  ```

  doorcodes

  inventoryitems

  ```

Field camelCase

accessLevel

firstName

API

Success Response Format

{

  "data": {

    "firstName": "Jane",

    "lastName": "Doe",

    "email": "example@email.com"

  }

}

Error Response Format

{

  "error": {

    "message": "Use 8 characters or more for your password"

  }

}

How to Read Response With Axios

try {

    const res = await axios.post(...);

    const { firstName, lastName, email } = res.data.data;

} catch (err) {

    const status = err.response.status;

    const { message } = err.response.data.error;

}

HTML & CSS

BEM — Block Element Modifier