Skip to content

Instantly share code, notes, and snippets.

@stopdropandrew
Last active October 26, 2020 19:01
Show Gist options
  • Save stopdropandrew/5fbe17ba9233f7d0309cc0a38c8e1eb2 to your computer and use it in GitHub Desktop.
Save stopdropandrew/5fbe17ba9233f7d0309cc0a38c8e1eb2 to your computer and use it in GitHub Desktop.
Bash Front-End Engineering Take-Home Challenge

Bash's Front-End Challenge

Your mission

Hi Front-End developer. Welcome. Your mission, should you choose to accept it, is to carve out 2-4 hours and create a styled single page React app (SPA) simulating Bash's video interface.

This is important! It is not our expectation that you'll finish everything here. If you can finish faster -- great! If not, limit yourself and please don't spend much longer than 4 hours MAX.

Core Goals

  • View the image below, that's the wireframe we want you to recreate.
  • Create a component hierarchy necessary for showing streaming video and room rosters.
  • Don't worry about using real videos, image placeholders or other visual elements are fine. We recommend randomuser.me for grabbing stock photos.
  • Add +/- buttons that allow adding/removing video elements, videos should be as large as possible while fitting in the space available. Room sizes can be 1-16 users.
  • Since this is a low fidelity mockup we aren't expecting detailed CSS, but we do want rounded user images and things laid out properly. User images can either be scaled or fixed size and scrolling.

Tips

  • We are looking for component hierachy and state management first and foremost.
  • We use functional components and hooks and would prefer you avoid class based components, but if that's what you know than you can stick with it.
  • Use any additional tools or libraries you want. Pick what you're comfortable with.
  • Stub out any data you need and make it clear what are stubs. Imagine another dev may be plugging real data into these components eventually.
  • We use Prettier for formatting and highly recommend it.
  • While we are big fans of testing/linting/CI, this is a prototype so don't sweat it.

Getting started

  • We recommend using create-react-app, it's straightforward and you'll be up and running quickly.
  • You'll need Node >= 8.10 and npm >= 5.6, and then run
npx create-react-app my-app
cd my-app
npm start

How to submit

  • Create a github repo (preferred) or send in a zipped .git folder - please don't send us your entire node_modules directory
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment