TypeScript and Gatsby

Introductory paragraph

TypeScript is a JavaScript superset which extends the language to include type definitions allowing codebases to be statically checked for soundness. Gatsby provides an integrated experience out of the box, similar to an IDE. If you are new to TypeScript, adoption can and should be incremental. Since Gatsby natively supports JavaScript and TypeScript, you can change files from .js to .tsx at any point to start adding types and gaining the benefits of a type system.

Example

The example above uses the power of TypeScript, in combination with exported types from Gatsby (PageProps) to tell this code what props is. This can greatly improve your developer experience by letting your IDE show you what properties are injected by Gatsby. To see all of the types available look at our TypeScript definition file.

Other resources

TypeScript integration is supported through automatically including gatsby-plugin-typescript. Visit that link to see configuration options and limitations of this setup.

If you are new to TypeScript, check out these other resources to learn more:

Edit this page on GitHub