cs-muvee's Introduction

Project 1 - Muvee

Muvee is a movies app using the The Movie Database API.

Time spent: 8 hours spent in total

Demo

Online Demo

User Stories

The following required functionality is completed:

User can view a list of movies currently playing in theaters.
User can show/hide details about each movie.
User sees loading state while waiting for the API.
User sees an error message when there is a network error.
User can refresh the movie list.
User can search/filter the movie results via a search bar.
User can use the page on both desktop and mobile viewport sizes.

The following optional features are implemented:

Toggle between Now Playing and Top Rated movies.
Sort Movies by rating, popularity, release date.
Animations on open/close details.
Infinite Scrolling.
Movie Poster Lightbox on click
Multiple Layout Options

Video Walkthrough

Here's a walkthrough of implemented user stories:

GIF created with LiceCap.

Notes

Describe any challenges encountered while building the app.

Race condition when perform search in local then try to access online resource

cs-muvee's People

Contributors

Watchers

cs-muvee's Issues

Thanks!

Hello! Thank you for submitting the first homework for CoderSchool React Class 🎉! The main focus of this assignment was to introduce you to working with an API, rendering items in a collection, and dealing with state and props.

Thanks for creating a nice README.md with the checkboxes. It makes it a lot easier to understand the functionality of your app.

Good job fetching the data in App.js within componentDidMount callback.
Good job when you have separated constants definitions in an other file.
It's totally fine to do string concatenation like "API.root_url + 'movie/top_rated?api_key=' + API.token" but using templated strings would be preferred. (Reference here)[https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#Tagged_template_strings)
Cool job using semantic ui library. It's nice to use a CSS Framework because you can build off base styles easily and quickly.
You did a good job splitting up into MovieList and MovieItem, keeping the code clean and simple.

Recommend Projects