Skip to content

Latest commit

 

History

History
148 lines (99 loc) · 4.6 KB

conventions.md

File metadata and controls

148 lines (99 loc) · 4.6 KB
Raw

Conventions

Contents

Naming

We follow the airbnb style for naming.

Testing

Unit Tests

Please always test new and changed code using Jest. For unit testing of React components use the Testing Library and follow its guiding principles.

Run tests:

yarn test

E2E Tests

Refer to the corresponding documentation. You can use Browserstack for testing cross-platform compatibility.

Code Quality

TypeScript

We use TypeScript.

Show TypeScript errors:

yarn ts:check

Formatting

We use prettier to format code.

Apply prettier code formatting:

yarn prettier:write

Linting

We use typescript-eslint for TypeScript and stylelint for CSS.

Show linting errors and warnings:

yarn lint

Show only linting errors:

yarn lint --quiet

IntelliJ Code Snippets

For gaining a more convenient code styling and a smoother development experience you can use our React TypeScript code snippets which support you by developing proper React, React Native components and also support our Testing-Library and StyledComponents.

  • find them here: /.idea/templates/React.xml
  • copy to your template directory
  • You can check for all the shortcuts here: IntelliJ -> preferences -> search for "live templates"

Some Shortcuts:

Shortcut Description
rfc React Functional Component
rnfc React Native Functional Component
rccc React class component with constructor
rtc Standard Component test with react testing-library
rntc Standard Component test with react native testing-library
scnv styled view native component

Commit Messages and Pull Request

See this guide for a general reference on how to write good commit messages. Commit messages should have the following schema: <Issue key>: Your commit message, e.g. 1234: Add commit message documentation

The same applies for PR names.

Reviews

We use an emoji code for reviewing.

Versioning

Versions consist of a version name and a version code.

Version name

The following schema versioning is used for versioning. PATCH is a counter for the number of releases in the corresponding month starting with 0.

Examples:

  • First versions of 2020: 2020.1.0, 2020.1.1, 2020.1.2.
  • First version of February 2020: 2020.2.0.

Version code

An additional consecutive version code is used for unique identification in the app stores. The version code is incremented for every build uploaded to the stores. The first version code was 100000.

Folder Structure

The src folders are structured according to its technical character, for example into assets, hooks, components and routes. File naming should be PascalCase, inside the routes folder file names should be prefixed by the route name. Router entry points should have Page as a suffix.

src
└───routes
│   └───someRoute
│       │   SomeRoutePage.tsx
│       └───component
│       │   │ SomeRouteItem.tsx
│       │   │ SomeRouteList.tsx
│       └───service
│           │ SomeRouteSpecificService.ts
└───components
│   │   Button.tsx
│   │   Icon.tsx
└───hooks
└───context
└───utils
    │   DatabaseConnector.ts
    │   LanguageDetector.ts
    |   indext.ts

Assets and Icons

We place our build-config and platform independent assets and icons in the assets in the root directory. See more information in the corresponding README.