Significa is an Oporto based digital studio founded in late 2013. Despite being specialised in Interaction Design and Brand Development, we believe that good design thinking can answer almost any question and solve most problems. We aim to provide meaningful design solutions to achieve the best user engagement possible in any situation.

About the challenge

This is a pretty simple test, in which you should be able to write a React app, using the provided screens as reference. You’ll need to make requests to an API to get some JSON content, filter the data and print it on view.

You can use any boilerplate/approach you prefer, but try to keep it simple. We encourage you to use your favourite tools and packages to build a solid React application.

The app should be a movie search with two pages:

• Home page: search field and a list with the results;

  Think about empty state, loading state and movie not found

• Movie page: movie details page;

  Think about loading state and movie not found

The purpose of this challenge is to evaluate your HTML, CSS, Javascript and React API skills and overall approach while composing a simple web app given a set of screens and an API feed. We will also assess the HTML, CSS, and JS output.

Getting Started

1. Fork this repository to your personal account;
2. Create a branch with your name;
3. Solve the challenge in the best way you can;

Send us your code in one of two ways.

1. Send us a PR;
2. Send us an email with your code in a zip to: [email protected]

Tips

• Write a good README with basic information (e.g.: how to start the project and how to build it);
• There's no screens designed for the mobile version, but if you build a responsive app it's a big plus. We would love to see your design skills as well!
• Feel free to work and improve on the available designs. Think of them as guidelines.
• There's a "like" button on the details page. It would be great if this information is persistent!
• Prefer to use a css methodology, such as BEM, ITCSS, etc;
• Asking questions is good. We will not penalize you for asking questions;
• The API server is sometimes slow, so think about loading and empty states throughout your application;
• We're looking for signs you understand concepts such as events, promises, and reactivity, and how those concepts are implemented in Javascript;
• Unit testing will be greatly valued;
• The git history will be evaluated;
• Your code will be evaluated by: semantics, structure, legibility, size, elegance (among other factors);

Necessary information

API:

We suggest using OMDb API, although you can use any other API you prefer

Screens / Assets / Styleguide:

Take a look at the /layout folder, there you will find everything you need.

Invision Prototype
Styleguide

Contact or doubts

Use the issues or send us an email: [email protected]

Break a leg!