Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://mmggyy66.github.io/my-awesome-books/

"Awesome books" is a simple website that displays a list of books and allows you to add and remove books from that list.
https://mmggyy66.github.io/my-awesome-books/

css css3 html javascript scss

Last synced: about 2 months ago
JSON representation

"Awesome books" is a simple website that displays a list of books and allows you to add and remove books from that list.

Awesome Lists containing this project

README

        

# my-awesome-books

My Microverse my-awesome-books project (Module two)

# πŸ“— Table of Contents

- [my-awesome-books](#my-awesome-books)
- [πŸ“— Table of Contents](#-table-of-contents)
- [πŸ“– \[🎯 my-awesome-books ](#--my-awesome-books-)
- [πŸ›  Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [πŸš€ Live Demo ](#-live-demo-)
- [πŸ‘ Presentation ](#-presentation-)
- [creating my-awesome-books:](#creating-my-awesome-books)
- [πŸ›  Built With ](#-built-with--1)
- [Deploy my website with github pages":](#deploy-my-website-with-github-pages)
- [- Loom video link:](#--loom-video-link)
- [πŸ’» Getting Started ](#-getting-started-)
- [Prerequisites](#prerequisites)
- [Prerequisites](#prerequisites-1)
- [Install](#install)
- [Requirements](#requirements)
- [Run tests](#run-tests)
- [Deployment](#deployment)
- [πŸ‘₯ Authors ](#-authors-)
- [🀝 Contributing ](#-contributing-)
- [πŸ‘‹ Show your support ](#-show-your-support-)
- [πŸ”­Acknowledgments ](#acknowledgments-)
- [πŸ“ License ](#-license-)

# πŸ“– [🎯 my-awesome-books

> "**Awesome books**" is a simple website that displays a list of books and allows you to add and remove books from that list. By building this application, you will learn how to manage data using JavaScript. Thanks to that your website will be more interactive. You will also use a medium-fidelity wireframe to build the UI.is a simple website that displays a list of books and allows you to add and remove books from that list. By building this application, you will learn how to manage data using JavaScript. Thanks to that your website will be more interactive. You will also use a medium-fidelity wireframe to build the UI.

## πŸ›  Built With

### Tech Stack

## πŸš€ Live Demo

- [Live Demo Link](https://mmggyy66.github.io/my-awesome-books/)

(back to top)

## πŸ‘ Presentation

- [Loom presentation Link]()

# creating my-awesome-books:

- I will set up a new repository and prepare it for development using best practices (e.g. linters).
- for the first project, I will Manage books collection (plain JS with objects).
How to build the "Awesome books" website
- I will start by building the core functionalities and ignoring how my website looks. Note that it is plain HTML with no styling, but it will allow you to add and remove books from the list!

## πŸ›  Built With

Technology


  • HTML

  • CSS (**medium-fidelity** wireframe)

  • Javascript

  • Linters (Lighthouse, Webhint, Stylelint, Eslint)

  • Git/GitHub work-flow

(back to top)

## Deploy my website with github pages":

[link to my-awesome-books: ](https://mmggyy66.github.io/my-awesome-books/)

## - Loom video link:

[Loom walking through for my-awesome-books: ]()

## πŸ’» Getting Started

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

### Prerequisites

### Prerequisites

- IDE to edit and run the code (We use Visual Studio Code πŸ”₯).
- Git to versionning your work.

### Install

- npm install --save-dev [email protected]
- npm install --save-dev [email protected] [email protected] [email protected] [email protected]
- pm install --save-dev eslint eslint-config-airbnb-base eslint-plugin-import babel-eslint

## Requirements

- Linters configuration.
- Part 1: Manage books collection (plain JS with objects).
- Part 2: Manage books collection (plain JS with classes) and add basic CSS.
- Part 3: Create a complete website with navigation.

Clone the repository to get start with project, then make sure to install dependencies in the linters file located in the [linter](https://github.com/Bateyjosue/linters-html-css/blob/main/.github/workflows/linters.yml) file

(back to top)

### Run tests

- run: npx hint .
- run: npx stylelint "\*_/_.{css,scss}"
- run: npx eslint .

### Deployment

Check for the tests when you generate a pull request and fix the errors if any.
For stylelint error run:sudo npx stylelint "\*_/_.{css,scss}" --fix and it will the fix style issues automatically.

## πŸ‘₯ Authors

πŸ‘€ **Mohamed Gamil Eldimardash**

- GitHub: [@github](https://github.com/MMGGYY66)
- LinkedIn: [LinkedIn](https://www.linkedin.com/in/mohamed-eldimardash-0023a3b5/)
- Twitter: [twitter](https://twitter.com/MOHAMEDELDIMARd)
- Facebook: [facebook](https://www.facebook.com/MOHAMED.ELDIMARDASH/)

πŸ‘₯ Henschel Nketchogue M.

- GitHub: [miltonHenschel](https://github.com/miltonHenschel)
- LinkedIn: [henschelnketchoguem](https://www.linkedin.com/in/henschelnketchoguem/)
- Twitter: [nketchogue](https://twitter.com/nketchogue)
- Instagram: [mpatchiehenschel](https://www.instagram.com/mpatchiehenschel/)


(back to top)

## 🀝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page

## πŸ‘‹ Show your support

Give a ⭐️ if you like this project!

(back to top)

## πŸ”­Acknowledgments

- [Microverse Team](https://www.microverse.org/).
- Spacial thank to [Cindy Shin](https://www.behance.net/gallery/29845175/CC-Global-Summit-2015) for his beautiful design.
- Images uses in this project are from [figma](https://www.figma.com/file/V0vg37EZhAbP9nUPOeCy6p/HTML%2FCSS-%26-JavaScript-capstone-project---Conference-page?node-id=0%3A1&t=od5hoeaQE2tKg92Y-0).

## πŸ“ License

This project is [MIT](https://github.com/microverseinc/readme-template/blob/master/MIT.md) licensed.

(back to top)