MazTV
📗 Table of Contents
📖 MazTV: web page that have diferent series obteins from a API
MazTV is a project that displays a list of TV series and allows users to interact with them through likes and comments. The goal is to build interfaces for the home page and a comments popup.
🛠️ Built With
Tech Stack
Key Features
- Dynamic Home Page: The web application displays a list of TV series retrieved from a selected API, along with their respective like counts using the Involvement API.
- Like Interaction: Users can interact with the series by clicking the "Like" button. The likes are recorded in the Involvement API, and the screen updates in real-time to reflect the changes.
- Comments Popup: A comments popup allows users to view and post comments for each TV series. The comments are fetched from the selected API, and users can submit new comments, which are then recorded in the Involvement API.
- Counters: Counters are implemented to display the number of series and comments in real-time on the home page and the comments popup, respectively.
(back to top)
💻 Getting Started
To get a local copy up and running, follow these steps.
Prerequisites
In order to run this project you need the following tools:
- A modern web browser (Chrome, Firefox, Safari, Edge).
- An IDE (e.g.: Vscode, Sublime Text,...).
- A terminal (Git Bash).
Setup
Clone this repository to your desired folder by running the following commands in your terminal:
cd your-prefered-folder-name
git clone git@github.com:lerfast/Capstone-module2-Javacript.git
Install
- Install this project with:
cd Capstone-module2-Javacript
npm init -y
npm install --save-dev hint@7.x
npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x
npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x
Usage
To run the project, execute the following command:
Open the project in live server (VS Code) or Open the index.html file on your browser.
Run Linters tests
To run tests, run the following command:
npx hint . --fix
npx stylelint "**/*.{css,scss}" --fix
npx eslint . --fix
🚀 Live Demo
(back to top)
👥 Authors
👤 Luis Emilio Rojas
👤 Javier Aybar
(back to top)
🔭 Future Features
- Improve the UI/UX with more visually appealing styles and animations.
- Implement search and filtering functionality for easier navigation of the series collection.
(back to top)
🤝 Contributing
All contributions, issues, and feature requests are welcome!
Feel free to check the issues page.
(back to top)
⭐ Show your support
If you like this project, please support me with a like or a star.
(back to top)
🙏 Acknowledgments
Thanks to my learning partners and the staff at Microverse.
(back to top)
📝 License
This project is MIT licensed.