A React widget for displaying a user's public book shelf

Usage no npm install needed!

<script type="module">
  import reactLibrarythingShelf from '';



build CodeQL Maintainability Rating Coverage

This React component allows you to display a user's LibraryThing books in a React application. It's a lot like the LibraryThing JavaScript widget, but allows for more customization, and React-like usage.


Storybook demo page

Example image


npm install --save react-librarything-shelf


yarn add react-librarything-shelf


import React from "react";
import { LibrarythingBookshelf } from "react-librarything-shelf";

export default function App() {
    return (
        <LibrarythingBookshelf userId="USER_ID_HERE" apiKey="API_KEY_HERE" />


You can also set some options as supported by the Goodreads API:

Option Type Description Default
sort string The order in which to sort the results returned entry_REV
max number The maximum number of books to be returned 10
showDetails boolean Show the author and title false
reviewsOnly boolean Show only books with review false
tagList string Comma-separated tags to filter by ""
width number Minimum width allowed for each book 100
details boolean Whether to show book details like book title, author, and summary false


  • yarn start to watch changes and build
  • yarn storybook to launch storybook for testing