SHELF is an ebook library repository that displays all of my ebooks from a server with a friendly graphical user interface (GUI). 

This is my first attempt at the MERN stack: MongoDB, Express.js, ReactJS, and NodeJS. Basically, the front-end would be ReactJS while the backend composes of NodeJS using the Express.JS framework to make it a REST API application, and the main database is a NoSQL, Document-based MongoDB. With this project, for the front-end, I did not use any front-end library (see Bootstrap, Bulma, Chakra, etc...) and all of the components are all custom made. 

When someone navigates around the web application it is broken down into three sections: the breadcrumbs, the directories, and the books. Each section can be displayed in different formats by the choosing of the user: links (breadcrumb only), list view, and tiles. Tiles gives off the most graphical representations as it shows the book covers (right now for just PDF ebooks). List view does show some icons, but to give it the best look I would recommend tiles.

The back-end did bring in an opportunity to use a testing framework, so I decided to use Mocha with Chai. This allowed me to make sure the REST API will give the desired results when scanning through the filesystem, on the server, and to check if the books may already exist in the MongoDB database otherwise just ignore it.

I did had to use a PDF library, thanks to Mozilla, to retrieve the cover of the ebook (normally the first page). This one proved to be one of the most challenging aspects to the program. Sadly, I have not gone far into retrieving the cover image from epub files.

Canvas

CORS

.env

PDFJS by Mozilla

Chai As Promise

Chai HTTP

Chai String

MongoDB Memory Server

SHELF is an eBook library repository that displays all of my ebooks from a server with a friendly graphical user interface (GUI). 

Hypertext Markup Language (HTML 5)

Cascading Style Sheets (CSS 3)

ECMAScript (JavaScript)

React JS

TypeScript

Logo of SASS or Syntactically Awesome Stylesheets

Syntactically Awesome Style Sheets (SASS)

Font Awesome

Logo of NodeJS. Please refer to the guidelines when using this image.

https://nodejs.org/en/about/resources/

NodeJS

Express JS

Logo of MongoDB. Please refer to the guidelines when using this logo.

https://www.mongodb.com/brand-resources

Jeremy Trpka

"I type stuff and magic happens."

SHELF