You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: website/src/pages/index.mdx
+7-7Lines changed: 7 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -493,7 +493,7 @@ import type { MyClass } from 'some-library';
493
493
494
494
Documentation becomes outdated the moment it's written, and worse than no documentation is wrong documentation. The same applies to types when describing the modules your app interacts with, such as APIs, messaging systems, databases etc.
495
495
496
-
For external API services, such as REST, GraphQL etc. it's crucial to generate types from their contracts, whether they use Swagger, schemas, or other sources (e.g. [openapi-ts](https://github.com/drwpow/openapi-typescript), [graphql-config](https://github.com/kamilkisiela/graphql-config)...). Avoid manually declaring and maintaining types, as they can easily fall out of sync.
496
+
For external API services, such as REST, GraphQL etc. it's crucial to generate types from their contracts, whether they use Swagger, schemas, or other sources (e.g. [openapi-ts](https://github.com/drwpow/openapi-typescript), [graphql-config](https://github.com/kamilkisiela/graphql-config) etc.). Avoid manually declaring and maintaining types, as they can easily fall out of sync.
497
497
498
498
As an exception manually declare types only when there is truly no documentation provided by external service.
499
499
@@ -610,7 +610,7 @@ Strive to use const assertion `as const`:
610
610
611
611
Const assertion must be used over enum.
612
612
613
-
While enums can still cover use cases as const assertion would, we tend to avoid it. Some of the reasonings as mentioned in TypeScript documentation - [Const enum pitfalls](https://www.typescriptlang.org/docs/handbook/enums.html#const-enum-pitfalls), [Objects vs Enums](https://www.typescriptlang.org/docs/handbook/enums.html#objects-vs-enums), [Reverse mappings](https://www.typescriptlang.org/docs/handbook/enums.html#reverse-mappings)...
613
+
While enums can still cover use cases as const assertion would, we tend to avoid it. Some of the reasonings as mentioned in TypeScript documentation - [Const enum pitfalls](https://www.typescriptlang.org/docs/handbook/enums.html#const-enum-pitfalls), [Objects vs Enums](https://www.typescriptlang.org/docs/handbook/enums.html#objects-vs-enums), [Reverse mappings](https://www.typescriptlang.org/docs/handbook/enums.html#reverse-mappings) etc.
614
614
615
615
```ts
616
616
// .eslintrc.js
@@ -678,7 +678,7 @@ In TypeScript types `null` and `undefined` many times can be used interchangeabl
678
678
Strive to:
679
679
680
680
- Use `null` to explicitly state it has no value - assignment, return function type etc.
681
-
- Use `undefined` assignment when the value doesn't exist. E.g. exclude fields in form, request payload, database query ([Prisma differentiation](https://www.prisma.io/docs/concepts/components/prisma-client/null-and-undefined))...
681
+
- Use `undefined` assignment when the value doesn't exist. E.g. exclude fields in form, request payload, database query ([Prisma differentiation](https://www.prisma.io/docs/concepts/components/prisma-client/null-and-undefined)) etc.
682
682
683
683
## Naming
684
684
@@ -687,7 +687,7 @@ Strive to keep naming conventions consistent and readable, with important contex
687
687
### Named Export
688
688
689
689
Named exports must be used to ensure that all imports follow a uniform pattern <Rule href='https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/no-default-export.md' />.
690
-
This keeps variables, functions... names consistent across the entire codebase.
690
+
This keeps variables, functions etc. names consistent across the entire codebase.
691
691
Named exports have the benefit of erroring when import statements try to import something that hasn't been declared.
692
692
693
693
In case of exceptions e.g. Next.js pages, disable rule:
@@ -941,7 +941,7 @@ To make import statements more readable and easier to understand:
941
941
942
942
- **Relative** imports `./sortItems` must be used when importing files within the same feature, that are 'close' to each other, which also allows moving feature around the codebase without introducing changes in these imports.
943
943
- **Absolute** imports `@common/utils` must be used in all other cases.
944
-
- **All** imports must be auto sorted by tooling e.g. [prettier-plugin-sort-imports](https://github.com/trivago/prettier-plugin-sort-imports), [eslint-plugin-import](https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/order.md)...
944
+
- **All** imports must be auto sorted by tooling e.g. [prettier-plugin-sort-imports](https://github.com/trivago/prettier-plugin-sort-imports), [eslint-plugin-import](https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/order.md) etc.
React components are no different, where prop drilling should not become an issue.
1239
1239
If with app scaling prop drilling truly becomes an issue, try to refactor render method, local states in parent components, using composition etc.
1240
1240
- Data fetching is only allowed in container components.
1241
-
- Use of server-state library is encouraged ([react-query](https://github.com/tanstack/query), [apollo client](https://github.com/apollographql/apollo-client)...).
1241
+
- Use of server-state library is encouraged ([react-query](https://github.com/tanstack/query), [apollo client](https://github.com/apollographql/apollo-client) etc.).
1242
1242
- Use of client-state library for global state is discouraged.
1243
1243
Reconsider if something should be truly global across application, e.g. `themeMode`, `Permissions` or even that can be put in server-state (e.g. user settings - `/me` endpoint). If still global state is truly needed use [Zustand](https://github.com/pmndrs/zustand) or [Context](https://react.dev/reference/react/createContext).
0 commit comments