metaforecast/docs/coding-style.md
Vyacheslav Matyukhin 8d6cf48b41
docs: typo cleanup
2022-04-10 17:27:39 +03:00

1.3 KiB

TypeScript

  • avoid any; get rid of any existing any whenever you can so that we can enable "strict": true later on in tsconfig.json
  • define custom types for common data structures

Typescript and React/Next

  • use React.FC<Props> type for React components, e.g. const MyComponent: React.FC<Props> = ({ ... }) => { ... };
  • use NextPage<Props> for typing stuff in src/pages/
  • use generic versions of GetServerSideProps<Props> and GetStaticProps<Props>

React

  • create one file per one component (tiny helper components in the same file are fine)
  • name file identically to the component it describes (e.g. const DisplayForecasts: React.FC<Props> = ... in DisplayForecasts.ts)
  • use named export instead of default export for all React components
    • it's better for refactoring
    • and it plays well with React.FC typing

Styles

  • use Tailwind
  • avoid positioning styles in components, position elements from the outside (e.g. with space-* or grid/flexbox)

General notes

  • use const instead of let whenever possible
  • set up prettier to format code on save