<a name="readme-top"></a>

<div align="center"> </div> <!-- Open pull request using the following structure ## Project title: subtitle ### 🌟Branch features: - i - ii - iii ### [ 🚀 Branch Demo](https://ab-noori.github.io/Project-Template/) -->

Amazing Movies

| Project Veiw Screenshots| |---------------------------------------| |<div align="center"><img src="./src/assets/desktop-shot.PNG" alt="screenshot" width="auto" height="auto"/></div>| |<div align="center"><img src="./src/assets/desktop-shot2.PNG" alt="screenshot" width="auto" height="auto"/></div>|

📗 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

<!-- PROJECT DESCRIPTION -->

📖 [Amazing Movies] <a name="about-project"></a>

[Amazing Movies] is a web application based on a TVmaze API to displays data about TV series and movies. A user can comment, like, and also view information about the movie

🛠 Built With <a name="built-with"></a>

Tech Stack <a name="tech-stack"></a>

• <summary>Client</summary> <ul> <li><a href="https://reactjs.org/">HTML</a></li> <li><a href="https://reactjs.org/">SCSS</a></li> <li><a href="https://reactjs.org/">API</a></li> <li><a href="https://reactjs.org/">JavaScript</a></li> <li><a href="https://reactjs.org/">Webpack 5</a></li> <li><a href="https://reactjs.org/">Jest Testing Framework</a></li> </ul>

Key Features <a name="key-features"></a>

• [Fetch and send data to an API]
• [Save and retrieve likes, comments]
• [Dynamic data]
• [Unit testing using jest enviroment]

<p align="right">(<a href="#readme-top">back to top</a>)</p> <!-- LIVE DEMO -->

🚀 Live Demo <a name="live-demo"></a>

• Live Demo Link
• Introduction to Project

<p align="right">(<a href="#readme-top">back to top</a>)</p> <!-- GETTING STARTED -->

💻 Getting Started <a name="getting-started"></a>

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

Prerequisites

In order to run this project you need:

• A browser of you choice.
• A text editor of your choice.
• An installed node.js on your local system

Setup

Clone this repository to your desired folder:

• Use the following Commands:

  cd your-desired-folder
  git clone git@github.com:ab-noori/JavaScriptCapstone.git
  

Install

Install this project with:

• You can deploy this projec on hosting provider of your choise or you can deploy it on github pages.

Usage

• Use following commands to run on your local system:

  npm run build
  npm run dev
  

Run tests

• Run the following script and style test:

  npm test
  npx eslint .
  npx stylelint "**/*.{css,scss}"
  

Deployment

You can deploy this project using:

• Free deployment services like GitHub pages.
• Any deployment services of your choice.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

👥 Authors <a name="authors"></a>

👤 Abdul Ali Noori

• GitHub: @ab-noori
• Twitter: @AbdulAliNoori4
• LinkedIn: abdul-ali-noori

👤 Frank Mugagga

• GitHub: @githubhandle
• Twitter: @twitterhandle
• LinkedIn: LinkedIn

<p align="right">(<a href="#readme-top">back to top</a>)</p>

🔭 Future Features <a name="future-features"></a>

• [ ] [Add mobile menu]

<p align="right">(<a href="#readme-top">back to top</a>)</p>

🤝 Contributing <a name="contributing"></a>

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

⭐️ Show your support <a name="support"></a>

If you like this project, give it a star.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

🙏 Acknowledgments <a name="acknowledgements"></a>

We would like to thank Microverse and our coding partners.

<p align="right">(<a href="#readme-top">back to top</a>)</p>

❓ FAQ (OPTIONAL) <a name="faq"></a>

• How to make it mobile friendly?

  • Put a viewport tag in the header

• How to design the site?

  • Draw a mockup before start to code

<p align="right">(<a href="#readme-top">back to top</a>)</p>

📝 License <a name="license"></a>

This project is MIT licensed.

<p align="right">(<a href="#readme-top">back to top</a>)</p>