Skip to content

developers-pio/remoteLockApp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Frontend Engineer Code Exercise

Terminology

  • Device: A WiFi-enabled lock, connected to the Internet, which can be viewed and controlled via the app UI.
  • Access User: A person who can permanently access doors which are protected with a smart lock. Each user has their own PIN which can be entered via the lock's keypad to unlock it.
  • Access Guest: A person who can access doors protected with a smart lock for a certain date and time range.
  • Access Person: An access user or guest.

Exercise

Develop a mobile-first mini web app using React with 2 pages, similar to these mockups:

Devices

Users

API

The app should fetch the data from an static API served by a local HTTP server.

Run the server with the command: node api_server.js

This server will expose two endpoints:

What's Important

The goal of this challenge is to show familiarity with frontend development concepts and ecosystem as well as good general programming patterns. As such, we feel the following are important:

  • Clean, readable, maintainable and well-organized code

  • Responsive, mobile-first pages. The web app should adapt to mobile and desktop screen sizes.

  • The toggle in the device tile should work and maintain the state and cause other details in the tile to update.

  • Code should use React to render the UI

    Use React Native only if you want and are profficient on it, in which case it doesn't need to be responsive to support desktop view.

What's Not Important

  • Pixel-perfect design. Remember, these are just mock-ups. Feel free to customize the look and feel to your own taste.
  • Choice of CSS methodology, library or framework. You can use whatever you are familiar with. CSS Modules, Sass or any CSS-in-JS library are accepted.
  • Feel free to reach to any UI component or utility library to get the job done. No need to re-invent the wheel. Although for trivial stuff, you should feel comfortable writing the code yourself.
  • Typed vs untyped JS (Flow, TypeScript and plain JS are all accepted)

Deliverable

  • Create a branch to push the commits of your solution
  • Create a Pull Request
  • When your Pull Request is ready for review, respond to our last email thread with the link to your Pull Request.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published