# Other Essential Presets — Babel & SWC

Source: https://www.geekswithgeeks.com/en/babel-swc/bs-babel-presets

> Learn about preset-react, preset-typescript, and more specialized presets.

## @babel/preset-react for JSX

@babel/preset-react handles JSX syntax, converting `<Component />` into `React.createElement(...)` calls. Essential for React projects.

## @babel/preset-typescript

Strip TypeScript type annotations without type-checking. Babel removes `: string`, `<T>`, etc., leaving valid JavaScript.

```json
{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react",
    "@babel/preset-typescript"
  ]
}
```

## Presets are ordered

Babel applies presets in reverse order. Put `@babel/preset-typescript` last so type stripping happens first, then other transformations.