react-kindle-clippings

A react component to parse and display kindle notes

Usage no npm install needed!

<script type="module">
  import reactKindleClippings from 'https://cdn.skypack.dev/react-kindle-clippings';
</script>

README

react-kindle-clippings

A react component to parse and display kindle notes

NPM JavaScript Style Guide

Install

npm install --save react-kindle-clippings

Using the component in your React App

To use the KindleClippings React component in your own React app/web page, follow the steps below

import React, { Component } from 'react'

import KindleClippings from 'react-kindle-clippings'

class Example extends Component {
  render() {
    return <KindleClippings url="[URL to fetch kindleclippings.txt from]" />
  }
}

How to find and save your Kindle highlights file

You can find your Kindle notes and highlights when you connect your kindle to your computer. Your highlights are saved in a file named "My Clippings.txt" in the root folder of the mounted path of your kindle.

Copy this file, and save it as "KindleClippings.txt" to a public URL which you will pass into this React component as a property

To publish to NPM

I followed the instructions here [[https://dev.to/ramonak/how-to-publish-a-custom-react-component-to-npm-using-create-react-library-4bhi]] and used the following to bootstrap the project:

npx create-react-library [my project name]

This sets up everything needed to publish to NPM, and all I had to in the end was to simply run

npm publish

License

MIT © thisisrajiraj