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

https://github.com/krisbobo/js-capstone

Micro Cinema is a Single Page Application(SPA) based on an external API tvmaze. The web app is composed of the home page and a popup window. It was built using JavaScript and a test driven development approach using the AAA pattern.
https://github.com/krisbobo/js-capstone

es6 javascript jest unittest webpack

Last synced: about 2 months ago
JSON representation

Micro Cinema is a Single Page Application(SPA) based on an external API tvmaze. The web app is composed of the home page and a popup window. It was built using JavaScript and a test driven development approach using the AAA pattern.

Awesome Lists containing this project

README

          

logo

# 📗 Table of Contents

- [📗 Table of Contents](#-table-of-contents)
- [📖 \[Micro Cinema\] ](#-micro-cinema-)
- [🛠 Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [Key Features ](#key-features-)
- [🚀 Live Demo and other links ](#-live-demo-and-other-links-)
- [💻 Getting Started ](#-getting-started-)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [👥 Authors ](#-authors-)
- [🤝 Contributing ](#-contributing-)
- [⭐️ Show your support ](#️-show-your-support-)
- [🙏 Acknowledgments ](#-acknowledgments-)
- [❓ FAQ ](#-faq-)
- [📝 License ](#-license-)

# 📖 [Micro Cinema]

> Micro Cinema is a Single Page Application(SPA) based on an external API [tvmaze](https://www.tvmaze.com/api). The API provides data on movies, including TV shows and various other movies and series. The web app is composed of two interfaces, the home page and the comments popup window that shows more data about a particular item. The API allows us to get a list of items with a unique id(or generate it), and for a given item, get detailed information about it. We used Microverse's Involvement API to record user interactions(likes and comments).

## 🛠 Built With

The major tools and languages used are:

- HTML
- CSS
- JS
- Jest
- Webpack

### Tech Stack

> The following tech stack were used

Base API

### Key Features

> The web app has the following key features:

- **[Home Page]**
- **[Popup Window]**

[Back to Top]

## 🚀 Live Demo and other links

> Here, we will paste links as per the submission instructions.

- [Live Demo Link](https://krisbobo.github.io/js-capstone/)

- Check the Authors section of this README for an overview of the authors.

- [Kanban Board Link](https://github.com/krisbobo/js-capstone/projects/1)

- [Christian's Code Review Link](https://github.com/krisbobo/js-capstone/pull/22)

- [Kibrewossen's Code Review Link](https://github.com/krisbobo/js-capstone/pull/27)

[Back to Top]

## 💻 Getting Started

> In order to run this project you need:

- Node js installed on your computer
- Npm Node package manager
- Terminal

### Setup

Clone this repository to your desired folder:

> https://github.com/krisbobo/js-capstone.git

### Install

Install this project with:

```sh
cd my-project
npm install or npm i
```
-

### Usage

To run the project, execute the following command:

```sh
npm run build
```

### Run tests

To run tests, run the following command:

```sh
npm test or jest test
```

[Back to Top]

## 👥 Authors

👤 **Kiyong Bohbo**

- GitHub: [krisbobo](https://github.com/krisbobo)
- Twitter: [ChrisboboSys](https://twitter.com/ChrisboboSys)
- LinkedIn: [kiyong-christian](https://linkedin.com/in/kiyong-christian)

👤 **Kibrewossen Yitbarek**

- GitHub: [akos](https://github.com/akos29)
- Twitter: [kbson49](https://twitter.com/Kbson49)
- LinkedIn: [Kibrewossen](https://www.linkedin.com/in/kibrewossen-yitbarek-bb587a18/)

[Back to Top]

## 🤝 Contributing

Contributions, issues, and feature requests are welcome.

Feel free to check the [issues page](../../issues/).

[Back to Top]

## ⭐️ Show your support

If you like this project, don't forget give a ⭐️ or buy me a coffee ☕️

[Back to Top]

## 🙏 Acknowledgments

I would like to thank all my collaborators on this project and the Microverse student community.

[Back to Top]

## ❓ FAQ

> Two possible questions new developers would ask when they decide to use this project.

- **[Why not use inline styling?]**

- [This is because it gets more difficult to edit styles when it is inline. Also, CSS best practices warrants for an external stylesheet to be used.]

- **[Why did you include the workflow and linters?]**

- [This is to ensure that the codebase remains consistent at all times(wrt spacings and other general rules set)]

[Back to Top]

## 📝 License

This project is [MIT](./LICENSE) licensed.

[Back to Top]