Web Developer Practical Exam

Web Developer Practical Exam


Overview This exam primarily assesses your skills in HTML, Javascript/jQuery, and CSS as you will have to style menus, tables, input fields and sub sections. Creating a semantic HTML should be highest priority. Matching the mockup with less than 5-pixel discrepancy is a plus. Problem Design and develop a web app that manages auto paint jobs. The UI has to follow the mockup design linked HERE as accurate as humanly possible. (no need to worry about responsiveness — so a fixed width design is desired) Below is a rundown of the use case for the web app:
  1. User adds a new paint job to the queue
  2. Web app will move a queued paint job to the list of active paint jobs if a slot is open
  3. User marks a paint job as done and it will be removed from display
Constraints
  • There are only 3 auto colors to choose from: red, green, and blue
  • The web app can only handle 5 simultaneous tasks and the rest of the paint jobs are queued until a free slot is open
  • User has to manually mark a paint job as completed
  • Queued paint jobs should be processed on a first-in-first-out (FIFO) basis
Instructions per page New Paint Job new-paint-job-page
  • Unhide the “New Paint Job Page” layer group in Photoshop to see the page design
  • Both Current Color and Target Color dropdown fields should only have <empty>, “red”, “green” and “blue” as color options.
  • Current Color dropdown field affects the color of the LEFT CAR IMAGE. Target Color dropdown field affects the color of the RIGHT CAR IMAGE. so when the user selects e.g. “green” for the Current Color, the left car graphics should change to green. Default selection is <empty> / gray car.
  • The images for the different car colors can be found inside the PSD file. car-assets-location
  • Adding form validation is a plus, but not required.
  • Upon submitting the form, the user should be redirected to the Paint Jobs page
Paint Jobs paint-jobs-page
  • Unhide the “Paint Jobs Page” layer group in Photoshop to see the page design
  • The Paint Jobs and Paint Queue tables should refresh the list of paint jobs via AJAX call, with a polling delay of 5 seconds.
  • The Shop Performance block needs to refresh its data via ajax calls, with a polling delay of 5 seconds.
Solution Please provide the following:
  1. Schema for the database tables used.
  2. Code using PHP (Laravel will get you preferential treatment). Database can be Sqlite3 or MySQL
  3. This is your chance to demonstrate your skills so using one or more of the following is highly encouraged.
    • Clean OOP coding style
    • HTML5
    • Javascript and jQuery
    • CSS / SASS / LESS
    • Test-driven Development
    • Git
    • MVC
Once done, please create a Github public repository to upload your source codes then send us the URL to the repo via apply@valens-research.com. Please use “Web Developer Practical Exam” as subject. In the email, also include comments regarding any assumptions or trade-offs you made. Thank you and good luck! P.S. — If you have any questions, please email the same email address above.

You don’t have access to the Valens Research Premium Application.

To get access to our best content including the highly regarded Conviction Long List and Market Phase Cycle macro newsletter, please contact our Client Relations Team at 630-841-0683 or email client.relations@valens-research.com.

Please fill out the fields below so that our client relations team can contact you

Or contact our Client Relationship Team at 630-841-0683