coding-patterns | Skill Performance & Reviews | TopRankSkills

TopRank Skills

Home / Skills / tools / coding-patterns

coding-patterns

maintained by ssalka

star 0 account_tree 0 verified_user MIT License
bolt View GitHub

name: coding-patterns description: Use any time you are writing TypeScript code.

Coding Patterns

General

is and assert

Use the @sindresorhus/is library for simple runtime type checks & assertions.

The is utility contains methods that return true if the given input matches the indicated type, and false otherwise:

const unknownValue: unknown = 'hello world';

// Correct
is.truthy(unknownValue); // true
is.string(unknownValue); // true
is.number(unknownValue); // false
is.boolean(unknownValue); // false
is.nullOrUndefined(unknownValue); // false
is.nonEmptyStringAndNotWhitespace(unknownValue); // true

// Incorrect
Boolean(unknownValue);
!!unknownValue;
typeof unknownValue === 'string';

The assert utility contains all the same methods as is, however instead of returning a boolean value, it throws an error if the expectation fails. Use this instead of type assertions, and instead of conditionals that check the truthiness of a value:

const unknownValue: unknown = true;

// Correct
assert.truthy(unknownValue); // TS knows `unknownValue` is truthy now

// Incorrect
if (!unknownValue) {
  throw new Error('Expected unknown value to be truthy');
}

Lodash

Use named imports from the lodash/es module for functional patterns.

Generally, the following lodash utilities are recommended to be used instead of manually implementing them with loops or array map/reduce methods:

  • groupBy
  • keyBy
  • countBy
  • partition
  • compact

When possible, use the shorthand syntax:

// Correct
const objectsById = groupBy(objects, '_id');
const [valid, invalid] = partition(results, 'isValid');

// Incorrect
const objectsById = groupBy(objects, o => o._id);
const [valid, invalid] = partition(results, result => result.isValid);

Frontend Patterns

React

Do not use useCallback or useMemo. Instead, functions and computed values in a component can be directly assigned to local variables. This project uses the React Compiler with React 19, so memoization of local variables is automatic.

TanStack Router

Client-side routes are managed by TanStack Router, and are defined in packages/client/src/routes.

chat Comments (0)

chat_bubble_outline

No comments yet. Be the first to share your thoughts!

Skill Details

GitHub Stars 0
GitHub Forks 0
Created Mar 2026
Last Updated il y a 3 mois
tools tools ide plugins

Related Skills

writing-skills
chevron_right
codex
chevron_right
smart-illustrator
chevron_right
collaborating-with-codex
chevron_right
code-review-router
chevron_right

Build your own?

Join 12,000+ developers contributing to the Claude ecosystem.