Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

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

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

css eslint javascript

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 remove books from that list.

Host: GitHub
URL: https://mmggyy66.github.io/awesome-books-solo/
Owner: MMGGYY66
Created: 2023-01-15T15:04:02.000Z (almost 2 years ago)
Default Branch: main
Last Pushed: 2023-02-02T20:31:00.000Z (almost 2 years ago)
Last Synced: 2024-11-08T15:03:45.613Z (2 months ago)
Topics: css, eslint, javascript
Language: JavaScript
Homepage: https://mmggyy66.github.io/awesome-books-solo/
Size: 364 KB
Stars: 5
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # my-awesome-books-solo

My Microverse my-awesome-books-solo 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 

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

(back to top)


## 👁 Presentation 

- [Loom presentation Link]()

# creating my-awesome-books:

Re-create my Awesome books app following the rules:

    Use ES6 syntax.

    Divide my code into modules. Save each module in a separate file in the modules dir. Import modules in the index.js file. For this exercise

    Keep all funcionalities of the app without errors.

    Refactor my methods and functions to arrow functions.

    Use let and const in a correct way.

## 🛠 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-solo: ](https://mmggyy66.github.io/awesome-books-solo/)

## - 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

- IDE to edit and run the code (We use Visual Studio Code 🔥).

- Git to versionning your work.

### Install

- first install package.json and node_modules run: 

npm init -y

- npm install --save-dev hint

- npm install --save-dev [email protected] [email protected] [email protected] [email protected]

- npm install --save-dev stylelint stylelint-scss stylelint-config-standard stylelint-csstree-validator

- npm install --save-dev [email protected] [email protected] [email protected] [email protected]

- npm 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

- to test and check the html file/s is error-free run: 

npx hint . 

- to fix errors run:

npx hint . -f

- to test and check the css file/s is error-free run: 

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

- to fix errors run:

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

- to test and check the js file/s is error-free run: 

npx eslint .

- to fix errors run:

npx eslint . --fix

### 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/)

  

  
(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/).

## 📝 License 

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

(back to top)