VA-Movies-capstone2

📗 Table of Contents

• 📖 About the Project
• 📖 Learning objectives
  • 🛠 Built With
    • Key Features
  • 🚀 Live Demo
• 💻 Getting Started
  • Setup
  • Prerequisites
  • Usage
  • Run tests
  • Deployment
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• 📝 License

📖 [VA-Movies-capstone2]

[VA-Movies-capstone2] Is about building your own web application based on an external API. All data is preserved thanks to the external https://api.tvmaze.com API service.

Learning objectives

• Use JavaScript to make websites dynamic and build basic single page apps.
• Use ES6 syntax.
• Use ES6 modules.
• Use callbacks and promises.
• Use webpack.
• Apply JavaScript best practices and language style guides in code.
• Use AAA pattern for unit tests.
• Write units tests for a JavaScript app.
• Follow Gitflow.
• Solve simple git conflicts.
• Send and receive data from an API.
• Use API documentation.
• Understand and use JSON.
• Make JavaScript code asynchronous.
• Perform a code review for a team member.

🛠 Built With

• Javascript
• APIs
• Webpack
• Jest

Key Features

APIs

APIs used:

• TVmaze API: data about TV series and movies.

Interfaces:

• The home page.
• The comments popup.

Home page

Remember that your page should make only 2 requests: One to the base API. And one to the Involvement API. When the user clicks on the Like button of an item, the interaction is recorded in the Involvement API and the screen is updated. When the user clicks on the "Comments" button, the Comments popup appears. Home page header and navigation similar to the given mockup. Home page footer similar to the given mockup.

Comments popup

When the popup loads, the webapp retrieves data from: The selected API and shows details about the selected item. The Involvement API to show the item comments. When the user clicks on the "Comment" button, the data is recorded in the Involvement API and the screen is updated. When the popup loads, the webapp retrieves data from: The selected API and shows details about the selected item. The Involvement API to show the item reservations. When the user clicks on the "Reserve" button, the data is recorded in the Involvement API and the screen is updated. Counters We have counters in all the interfaces that show:

• The number of items (home).
• The number of comments (comments popup).

🚀 Live Demo and video

https://amazinggracee.github.io/VA-Movies-capstone2/dist

https://www.loom.com/share/a91e3546fb7246e38e305f832778026c

• Click Here

💻 Getting Started

You can have a copy of this repo run on your local machine by just directly cloning it.

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

1. Download the Zip or (git clone)[https://github.com/Amazinggracee/VA-Movies-capstone2.git]
2. cd Leaderboard
3. Then open in your browser by using live server

Test

For tracking linter errors locally you need to follow these steps:

• After cloning the project you need to run this command

  npm install This command will download all the dependencies of the project

• For tracking the linter errors in HTML file run:

  npx hint .

• For tracking the linter errors in CSS file run:

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

  • And For tracking the linter errors in JavaScript file run:

  npx eslint .

Prerequisites

• Basic knowledge of HTML, CSS, and Javascript
• Basic knowledge of Git and Github
• Basic knowledge of Webpack
• Basic knowledge of Jest
• Basic knowledge of APIs

To get the output of our project make sure you have google Chrome, Mozila or any other browser installed.

Install

In order to install this project please go through the following steps:

• Clone the repository
• Run npm install
• Run npm start to start the server
• Run npm run build to build the project
• Run npm run test to run the tests

👥 Authors

👤 Amarachi Dimkpa

• GitHub: @amazinggacee
• Twitter: @amazinggaceu
• LinkedIn: Amarachi Dimkpa

👤 Victor Kanyi

• GitHub: @jkanyi-web
• Twitter: @jkanyi757
• LinkedIn: Victor-kanyi

🔭 Future Features

🤝 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!

🙏 Acknowledgments

• Hat tip to Microvers and all the staff
• Thanks to My coding Partners
• Thanks to My Morning-session-group and Standup-team Partners and
• Thanks to Code Reviewers

📝 License

This project is MIT licensed.