Ritek

type FormState = {
	name: string;
};

function Form(props: Props) {
	async function action(_: FormState, formData: FormData): Promise<FormState> {
		const name = formData.get("name") as string;
		const surname = formData.get("surname") as string;
		console.log({ name, surname });

Ritek

React TS Patterns

Popular patterns list

• Compound Components
• Controlled vs Uncontrolled Components
• Headless Components (Logic Hooks + UI Primitives)
• Context + Hooks API Pattern
• Slot / As-Child Pattern
• Config Objects / Options API

Ritek

class DequeNode<T = any> {
  value: T;
  prev: DequeNode<T> | null;
  next: DequeNode<T> | null;

  constructor(value: T, prev: DequeNode<T> | null = null, next: DequeNode<T> | null = null) {
    this.value = value;
    this.prev = prev;
    this.next = next;
  }

Ritek

function accumulateRecursive(numbers: number[], accumulator: number = 0) {
  if (numbers.length === 0) {
    return accumulator;
  }
  const lastIndex = numbers.length - 1;

  return accumulateRecursive(numbers.slice(0, lastIndex), accumulator += numbers[lastIndex])
}

Ritek

import express from "express";
import path from "path";
import { fileURLToPath } from "url";
import { dirname } from "path";

const PORT = 8080;
const STATIC_DIR_PATH = "dist";

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);