Skip to content

A small Library app, created with HTML, CSS and JS. Data is stored in localStorage.

Notifications You must be signed in to change notification settings

mooniiDev/library

Repository files navigation

The Odin Project JavaScript

Project: Library

A small Library app, created with HTML, CSS and JavaScript. The data is stored in localStorage. The project is from The Odin Project curriculum.

🔗 Live preview of the project is here.

Overview

Features:

  • Data is saved in localStorage
  • You can add a book
  • Before adding a book, you can mark if it's already read or not
  • You can change book status after addition
  • You can delete a particular book
  • You can delete all books at once
  • There is a modal to confirm or cancel complete books removal
  • There is a mini tooltip with information about the project

Tools:

  • Visual Studio Code
  • Linux terminal
  • Git and GitHub
  • ESLint + Airbnb JavaScript Style Guide

Third party code:

Outcome:

  • Used HTML5 semantic elements for better structure and readability
  • Used CSS Flexbox module to create layout
  • Adapted fancy style for input placeholders
  • Learned how to create a custom checkbox
  • Learned how to create a tooltip
  • Learned how to create a modal
  • Learned how to save data to localStorage
  • First time used fonts from local resource
  • First time added color palette to CSS :root
  • Deepened knowledge of DOM manipulation, HTML structure, CSS styling subtleties and JS functionality in general
  • Had lots of fun with styling! 🎨