diff --git a/app/src/components/bookcard.js b/app/src/components/bookcard.js
deleted file mode 100644
index fe9dad1c..00000000
--- a/app/src/components/bookcard.js
+++ /dev/null
@@ -1,95 +0,0 @@
-import PropTypes from 'prop-types';
-import React, { useState } from 'react';
-import StarRatings from 'react-star-ratings';
-import { Card, Row, Col } from 'react-bootstrap';
-
-import AmazonURL from '../components/amazonurl';
-import Bookmark from '../components/bookmark';
-import GoodReadsImage from '../components/goodreadsimage';
-
-const truncateContent = (content) => {
-	if (!content) {
-		return '';
-	}
-	return content.length > 350 ? content.substring(0, 350) + '...' : content;
-};
-
-const showFullText = (content) => {
-	if (!content) {
-		return '';
-	}
-	return content;
-};
-
-const BookCard = ({ book }) => {
-	const [ show, toggleShow ] = useState(false);
-	return (
-		<Card style={{ marginBottom: '15px' }}>
-			<Row>
-				<Col xs={6} sm={6} md={4} xl={2}>
-					<Card.Img
-						style={{
-							paddingLeft: '15px',
-							paddingRight: '15px',
-							paddingTop: '30px'
-						}}
-						src={book.image_url}
-						alt={book.title}
-					/>
-				</Col>
-				<Col xs={12} sm={6} md={8} xl={10}>
-					<Card.Body>
-						<Card.Title>{book.title}</Card.Title>
-						<Card.Subtitle className="text-muted">
-							<Card.Text style={{ paddingTop: '2px' }}>
-								{book.author} <b>{book.year ? book.year : null}</b>
-							</Card.Text>
-							<StarRatings
-								rating={parseFloat(book.rating)}
-								numberOfStars={5}
-								starDimension="18px"
-								starSpacing="1px"
-								starRatedColor="#fa604a"
-							/>
-							<div style={{ display: 'flex', alignItems: 'center', paddingTop: '.75rem' }}>
-								<div style={{ width: '30px', height: '30px', marginRight: '5px' }}>
-									{book.amazon_url ? <AmazonURL book={book} /> : null}
-								</div>
-								<div style={{ width: '30px', height: '30px' }}>
-									<a href={book.url} target="_blank">
-										<GoodReadsImage />
-									</a>
-								</div>
-								<Bookmark book={book} />
-							</div>
-						</Card.Subtitle>
-						<p style={{ color: 'gray', fontSize: '0.8rem', paddingTop: '1rem' }}>
-							{!show && truncateContent(book.description)}
-							{show && showFullText(book.description)}
-						</p>
-						{!show && book.description.length>350 &&(
-							<button className="btn btn-sm btn-primary " onClick={() => toggleShow(true)}>
-								Show More
-							</button>
-						)}
-						{show && (
-							<button className="btn btn-sm btn-primary " onClick={() => toggleShow(false)}>
-								Show Less
-							</button>
-						)}
-					</Card.Body>
-				</Col>
-			</Row>
-		</Card>
-	);
-};
-
-BookCard.propTypes = {
-	siteTitle: PropTypes.object
-};
-
-BookCard.defaultProps = {
-	book: {}
-};
-
-export default BookCard;
diff --git a/app/src/components/bookcard.jsx b/app/src/components/bookcard.jsx
new file mode 100644
index 00000000..b232e393
--- /dev/null
+++ b/app/src/components/bookcard.jsx
@@ -0,0 +1,178 @@
+import PropTypes from "prop-types"
+import React, { useState } from "react"
+import StarRatings from "react-star-ratings"
+import { Card, Row, Col } from "react-bootstrap"
+
+import AmazonURL from "./amazonurl"
+import Bookmark from "./bookmark"
+import GoodReadsImage from "./goodreadsimage"
+
+const truncateContent = content => {
+  if (!content) {
+    return ""
+  }
+  return content.length > 350 ? content.substring(0, 350) + "..." : content
+}
+
+const showFullText = content => {
+  if (!content) {
+    return ""
+  }
+  return content
+}
+
+const BookCard = ({ book }) => {
+  const [show, toggleShow] = useState(false)
+
+  const bookJsonLd = {
+    "@context": "https://schema.org",
+    "@type": "Book",
+    name: book.title,
+    author: {
+      "@type": "Person",
+      name: book.author,
+    },
+    datePublished: book.year ? String(book.year) : undefined,
+    image: book.image_url,
+    description: book.description,
+    aggregateRating: book.rating
+      ? {
+          "@type": "AggregateRating",
+          ratingValue: String(book.rating),
+          bestRating: "5",
+          worstRating: "1",
+          ratingCount: book.ratingCount ? Number(book.ratingCount) : 1,
+          reviewCount: book.reviewCount ? Number(book.reviewCount) : 1,
+        }
+      : undefined,
+    sameAs: book.url,
+    offers: book.amazon_url
+      ? {
+          "@type": "Offer",
+          url: book.amazon_url,
+          availability: "https://schema.org/InStock",
+        }
+      : undefined,
+  }
+
+  return (
+    <>
+      <Card style={{ marginBottom: "15px" }}>
+        <Row>
+          <Col xs={6} sm={6} md={4} xl={2}>
+            <Card.Img
+              style={{
+                paddingLeft: "15px",
+                paddingRight: "15px",
+                paddingTop: "30px",
+              }}
+              src={book.image_url}
+              alt={book.title}
+            />
+          </Col>
+          <Col xs={12} sm={6} md={8} xl={10}>
+            <Card.Body>
+              <Card.Title>{book.title}</Card.Title>
+              <Card.Subtitle className="text-muted">
+                <Card.Text style={{ paddingTop: "2px" }}>
+                  {book.author} <b>{book.year ? book.year : null}</b>
+                </Card.Text>
+                <StarRatings
+                  rating={parseFloat(book.rating)}
+                  numberOfStars={5}
+                  starDimension="18px"
+                  starSpacing="1px"
+                  starRatedColor="#fa604a"
+                />
+                <div
+                  style={{
+                    display: "flex",
+                    alignItems: "center",
+                    paddingTop: ".75rem",
+                  }}
+                >
+                  <div
+                    style={{
+                      width: "30px",
+                      height: "30px",
+                      marginRight: "5px",
+                    }}
+                  >
+                    {book.amazon_url ? <AmazonURL book={book} /> : null}
+                  </div>
+                  <div style={{ width: "30px", height: "30px" }}>
+                    <a href={book.url} target="_blank" rel="noreferrer">
+                      <GoodReadsImage />
+                    </a>
+                  </div>
+                  <Bookmark book={book} />
+                </div>
+              </Card.Subtitle>
+              <p
+                style={{
+                  color: "gray",
+                  fontSize: "0.8rem",
+                  paddingTop: "1rem",
+                }}
+              >
+                {!show && truncateContent(book.description)}
+                {show && showFullText(book.description)}
+              </p>
+              {!show && book.description.length > 350 && (
+                <button
+                  type="button"
+                  className="btn btn-sm btn-primary"
+                  onClick={() => toggleShow(true)}
+                >
+                  Show More
+                </button>
+              )}
+              {show && (
+                <button
+                  type="button"
+                  className="btn btn-sm btn-primary"
+                  onClick={() => toggleShow(false)}
+                >
+                  Show Less
+                </button>
+              )}
+            </Card.Body>
+          </Col>
+        </Row>
+      </Card>
+      {/* eslint-disable-next-line react/no-danger */}
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{ __html: JSON.stringify(bookJsonLd) }}
+      />
+    </>
+  )
+}
+
+BookCard.propTypes = {
+  book: PropTypes.shape({
+    title: PropTypes.string.isRequired,
+    author: PropTypes.string,
+    year: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    image_url: PropTypes.string,
+    description: PropTypes.string,
+    rating: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    url: PropTypes.string,
+    amazon_url: PropTypes.string,
+  }),
+}
+
+BookCard.defaultProps = {
+  book: {
+    title: "",
+    author: "",
+    year: "",
+    image_url: "",
+    description: "",
+    rating: 0,
+    url: "",
+    amazon_url: "",
+  },
+}
+
+export default BookCard
diff --git a/app/src/components/feed.js b/app/src/components/feed.js
deleted file mode 100644
index e93c8cb9..00000000
--- a/app/src/components/feed.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import React from 'react';
-import '../styles/sidebar.css';
-import BookCard from './bookcard';
-import SortByDropdown, { FIELDS_TO_SORT_BY, compareFunctions } from './sortByDropdown';
-
-export default ({ data, limit }) => {
-  const [sortBy, setSortBy] = React.useState(FIELDS_TO_SORT_BY[0]);
-
-  const sortedBooks = React.useMemo(() => [...data.allBooksJson.edges]
-    .sort(compareFunctions[sortBy.value]),
-  [sortBy]);
-
-  return (
-    <>
-      <SortByDropdown sortBy={sortBy.label} onSortByItemClick={setSortBy} />
-      {sortedBooks.map((x, index) => {
-        const book = x.node;
-        if (!limit || index < limit) {
-          if (!book.description || book.description.length < 10) {
-            return null;
-          }
-          return <BookCard book={book} key={book.id} />;
-        }
-        return null;
-      })}
-    </>
-  );
-};
diff --git a/app/src/components/feed.jsx b/app/src/components/feed.jsx
new file mode 100644
index 00000000..deffef8f
--- /dev/null
+++ b/app/src/components/feed.jsx
@@ -0,0 +1,62 @@
+import React from "react"
+import PropTypes from "prop-types"
+import "../styles/sidebar.css"
+import BookCard from "./bookcard"
+import SortByDropdown, {
+  FIELDS_TO_SORT_BY,
+  compareFunctions,
+} from "./sortByDropdown"
+
+const Feed = ({ data, limit }) => {
+  const [sortBy, setSortBy] = React.useState(FIELDS_TO_SORT_BY[0])
+
+  const sortedBooks = React.useMemo(
+    () => [...data.allBooksJson.edges].sort(compareFunctions[sortBy.value]),
+    [data, sortBy]
+  )
+
+  return (
+    <>
+      <SortByDropdown sortBy={sortBy.label} onSortByItemClick={setSortBy} />
+      {sortedBooks.map((x, index) => {
+        const book = x.node
+        if (!limit || index < limit) {
+          if (!book.description || book.description.length < 10) {
+            return null
+          }
+          return <BookCard book={book} key={book.id} />
+        }
+        return null
+      })}
+    </>
+  )
+}
+
+Feed.propTypes = {
+  data: PropTypes.shape({
+    allBooksJson: PropTypes.shape({
+      edges: PropTypes.arrayOf(
+        PropTypes.shape({
+          node: PropTypes.shape({
+            id: PropTypes.string.isRequired,
+            title: PropTypes.string,
+            author: PropTypes.string,
+            year: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+            image_url: PropTypes.string,
+            description: PropTypes.string,
+            rating: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+            url: PropTypes.string,
+            amazon_url: PropTypes.string,
+          }),
+        })
+      ),
+    }),
+  }).isRequired,
+  limit: PropTypes.number,
+}
+
+Feed.defaultProps = {
+  limit: null,
+}
+
+export default Feed
diff --git a/app/yarn.lock b/app/yarn.lock
index e5e65376..42aad773 100644
--- a/app/yarn.lock
+++ b/app/yarn.lock
@@ -3145,13 +3145,6 @@ binary-extensions@^2.0.0:
   resolved "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz"
   integrity sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==
 
-bindings@^1.5.0:
-  version "1.5.0"
-  resolved "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz"
-  integrity sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==
-  dependencies:
-    file-uri-to-path "1.0.0"
-
 bl@^1.0.0:
   version "1.2.3"
   resolved "https://registry.npmjs.org/bl/-/bl-1.2.3.tgz"
@@ -6927,19 +6920,6 @@ fs.realpath@^1.0.0:
   resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
   integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
-fsevents@^1.2.7:
-  version "1.2.13"
-  resolved "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz"
-  integrity sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==
-  dependencies:
-    bindings "^1.5.0"
-    nan "^2.12.1"
-
-fsevents@~2.3.2:
-  version "2.3.3"
-  resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz"
-  integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
-
 function-bind@^1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz"
@@ -10769,11 +10749,6 @@ name-all-modules-plugin@^1.0.1:
   resolved "https://registry.npmjs.org/name-all-modules-plugin/-/name-all-modules-plugin-1.0.1.tgz"
   integrity sha512-dCLoG4mKFY8B4keR+51CkKGIDptOzlyAMXtnwnVE8F5vUrSGB7AbgrWp5RR8ZKFQAj9QxVpecJ01p4eE9GMxdQ==
 
-nan@^2.12.1:
-  version "2.22.0"
-  resolved "https://registry.npmjs.org/nan/-/nan-2.22.0.tgz"
-  integrity sha512-nbajikzWTMwsW+eSsNm3QwlOs7het9gGJU5dDZzRTQGk03vyBOauxgI4VakDzE0PtsGTmXPsXTbbjVhRwR5mpw==
-
 nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz"
diff --git a/netlify.toml b/netlify.toml
new file mode 100644
index 00000000..b93e1d17
--- /dev/null
+++ b/netlify.toml
@@ -0,0 +1,2 @@
+[build.environment]
+  NODE_VERSION = "18"
diff --git a/package-lock.json b/package-lock.json
index 48e341a0..c5164f5d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,3 +1,6 @@
 {
-  "lockfileVersion": 1
+  "name": "Mind-Expanding-Books",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
 }