Skip to content

Codeinwp/front-end-internship-test

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 

Repository files navigation

2022 ThemeIsle front-end internship test

ThemeIsle front-end internship Use React Use JS Use CSS Use GitHub

Instructions:

  • You will build a simple React application that will fetch data from an API and display it using the attached design;
  • We need to see that you know your way around CSS and JS, so this must be built without using existing React component libraries or CSS frameworks. You can, however, use any scaffolding tool (like create-react-app), or other NPM packages that might be useful;
  • The React part of the application must be built using Function Components and Hooks (not classes);
  • You can write your stylesheet in either plain CSS, or SCSS - bonus points for using SCSS;
  • You should make sure the interface is responsive and works fine on mobile screens;
  • We know we don't provide measurable references, so we don't expect this to be pixel perfect, but making it as close to the reference images as possible constitutes a big bonus;
  • In this repository you will find two attached images that will be used as a reference to create your application;
  • You can get creative with transitions, loading state and interactions;

Design:

  • As a starting reference, the container width for this application will be 1200px wide.
  • The font family used across the whole design is Lato and you can request it from Google Fonts;
  • The first image represents the main view of the app. Here you will display the data fetched from the API endpoint.
  • The last card represents the card hover state;
  • When clicking the Learn More button or the title, the modal from the second image should pop up;

posts

posts with modal


Resources:


Submitting:

  • Create your own repository and add your code there;
  • When you are done, send us a link to the repository where you added your solution, so we can check it out;
  • If you get stuck at some point, send what you did up to that point, and we will look at it;

Good luck!

About

ThemeIsle front-end internship test.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published