tooling

Webpack is a module bundler that builds a dependency graph starting from entry points and bundles modules into output files. Core concepts: Entry (starting point), Output (result), Loaders (transform files), Plugins (extend functionality), and Mode (optimization level).

Configure TypeScript via tsconfig.json with compiler options like target (JS version), module (module system), strict (type checking level), and include/exclude for files. Key settings include paths for aliases, jsx for React, and lib for available types.

CI/CD automates testing and deployment. Use GitHub Actions, GitLab CI, or similar to run tests on every push, check linting, build the project, and deploy. Define workflows in YAML files that specify triggers, jobs, and steps.

Use Chrome DevTools for debugging (Sources panel, breakpoints, watch expressions), console methods beyond log (table, trace, time), debugger statement, VS Code debugger with launch configs, and React/Vue DevTools for framework-specific debugging.

Set up Jest by installing it, creating jest.config.js with settings like testEnvironment, transform for TypeScript/Babel, setupFilesAfterEnv for test utilities, and coverage configuration. Integrate with React Testing Library for component tests.