AWSOME BOOKS 2023

📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
  • 🚀 Live Demo
• 💻 Getting Started
  • Setup
  • Prerequisites
  • Install
  • Usage
  • Run tests
  • Deployment
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• ❓ FAQ (OPTIONAL)
• 📝 License

📖 [Awsome Books']

**[Awsome Books]**The project is a simple book list application designed using HTML, CSS, and JavaScript. It allows users to add, edit, and remove books from a list. The user interface is clean and user-friendly, featuring a form where users can enter the title and author of a book. When the user clicks the "Add Book" button, the book is added to the list below. Each book entry includes the title and author information, along with a "Delete" button. Clicking the "Delete" button removes the corresponding book from the list and the local storage. The application is built using a modular JavaScript approach, with functions to handle adding books, displaying the list, removing books, editing and saveing books. The book data is stored in an array, allowing for easy manipulation and updating of the list. The user interface is styled with CSS to ensure a visually appealing and responsive layout.

Overall, this book list application provides a straightforward and intuitive way for users to manage their reading list. It can be easily customized and expanded upon to include additional features, such as editing book details or persisting the data using local storage.

🛠 Built With

This project was built using: HTML, CSS and JAVASCRIPT

Tech Stack

HTML

CSS

Javascript

Git

Client

• HTML

Styles

• CSS

Language

• CSS

Database

• GIT

Key Features

• [HTML & CSS Best practices]
• [Add Books]
• [Display Books]
• [Remove Books ]
• [Modular JavaScript]
• [Data Persistence]
• [Data Persistence]
• [Edit Book Details ]
• [CI and CD Deployment with Netlify]

This code implements a simple book management system using JavaScript. It allows users to add, edit, and delete books, and displays them in a table format.

###Features Add Book: Users can enter the book name and author in a form and add the book to the table by submitting the form.

##Edit Book: Each book entry in the table has an "Edit" button that allows users to modify the book's name and author. Clicking the "Edit" button replaces the text cells with input fields for editing. Users can save the changes or cancel the edit.

##Delete Book: Each book entry in the table has a "Delete" button that removes the book from the table when clicked.

##Persistent Storage: The application stores the book data in the browser's localStorage API. This allows the books to persist even after the page is refreshed or closed. The book data is stored as a JSON string.

(back to top)

🚀 Live Demo

• Live Demo Link

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

Prerequisites

To run this project you need the following tools:

• [VS Code ]
• [Git and GitHub ]
• [CI CD Netlify Bot Instalation]
• [Nodejs ]

Setup

Clone this repository to your desired folder:

 cd awsome-books-2023
 git git@github.com:alyconr/awsome-books-2023.git

Setup

 cd awsome-books-2023
 git git@github.com:alyconr/awsome-books-2023.git

Install

Install this project with:

Lighthouse run

    npm install -g @lhci/cli@0.7.x

Webhint:

     npm install --save-dev hint@7.x

Stylelint:

     npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x

Eslint

     npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x

Usage

Usage To add a book, fill in the book name and author in the provided form and click the "Add Book" button.

To edit a book, click the "Edit" button next to the book entry in the table. Modify the book's name and author in the input fields and click the "Save" button to save the changes. Click the "Cancel" button to discard the changes.

To delete a book, click the "Delete" button next to the book entry in the table. The book will be removed from the table.

Run tests

To run tests, run the following command:

To test the Stylelint linter:

    npx stylelint "**/*.{css,scss}"

To test the Webhint:

    npx hint .

To test the ESLint linter:

    npx eslint .

Deployment

You can deploy this project using your local enviroment or use Netlify bot to deploy it online.

(back to top)

👥 Authors

JEYSSON CONTRERAS

👤 Author1

• GitHub: @alyconr
• LinkedIn: LinkedIn

(back to top)

🔭 Future Features

• [Display Books]
• [Remove Books]
• [Modular JavaScript]
• [Data Persistence]
• [Edit Book Details]

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

Write a message to encourage readers to support your project

If you like this project please give one start.

(back to top)

🙏 Acknowledgments

I would like to thank God for giving me the strength to carry out this project.

(back to top)

(back to top)

📝 License

This project is MIT licensed.

(back to top)