This source plugin for Gatsby fetches personal statistics from and optionally enhances them with metadata from TMDB. This can be used to display a list of watched movies and series with their respective posters.

gatsby-source-trakt-tmdb is compatible with gatsby-image so you can easily optimize posters and backdrop images during build time.

Sample Query

query {
    limit: 6
    sort: { fields: last_watched_at, order: DESC }
  ) {
    edges {
      node {
        movie {
          ids {
        tmdb_metadata {
          poster {
            localFile {
              childImageSharp {
                fluid(maxWidth: 300, maxHeight: 450, quality: 90) {

If a movie or show doesn’t have a TMDb id yet, which could be the case when a show or movie is new, tmdb_metadata will be null, so make sure to check it before using it.


To use this plugin, you have to obtain API keys for and TMDB:

  resolve: `gatsby-source-trakt-tmdb`,
  options: {
    traktApiKey: "TRAKT_API_KEY",
    username: "YOUR_TRAKT_USERNAME",
    tmdbApiKey: "TMDB_API_KEY", // optional, to fetch metadata
    language: "en-US" // optional, language for metadata (e.g. titles)
    limit: 10 // optional, number of items to fetch per category

Try to keep the limit below or at 10 items per category (40 items in total) to avoid rate-limits by TMDb. Limit can also be an object providing individual limits for each Trakt category:

  limit: {
    watchedMovies: 6,
    watchedShows: 6,
    watchlistMovies: 6,
    watchlistShows: 6,


As this is my first source plugin for Gatsby, I think it has room for improvement. If you’re interested in contributing, please feel free to open a pull request.