On the Innovation and Technology team here at Microsoft, our goal is to fairly evaluate all candidates and ensure that everyone has the best chance to show their potential. As a result, we’re doing a take home evaluation instead of a live coding portion within our interview. We hope this takes some of the stress and pressure off and allows you to operate more like you would during a normal day. Just like your day-to-day, you are free to use Github Copilot, Stack Overflow, open source repos and packages, etc. We just ask that you do not use established design systems or component libraries to solve this problem.
This challenge is intentionally meant to be ambiguous - we are not only testing your engineering skills but also how you think across design and engineering. If questions come up during the process, please proceed in the way that you best see fit. Be sure to note your questions, anything that stands out, and be prepared to talk through how you unblocked yourself and why.
Your time is valuable and we want to respect it. We know this could turn into a massive project or build so we don’t recommend going over 8 hours. Below we’ve listed the minimum requirements we need to see to drive a discussion.
Are you a dog lover who wants to learn more about the amazing diversity of canines? Do you wish you could see pictures of all the different types of dogs in the world, from the tiny Chihuahua to the majestic Great Dane? If so, you need to check out Woofer, the ultimate app for dog enthusiasts!
Woofer is a new and exciting app that lets you browse and discover all kinds of dog breeds and sub-breeds. You can select any breed from a menu and see its sub-breeds, along with pictures of each one. Woofer is more than just a fun and informative app. It is also a way to celebrate and appreciate the beauty and diversity of dogs, and to raise awareness about their conservation and welfare. By showing all dog breeds and sub-breeds, Woofer aims to promote respect and compassion for all dogs, regardless of their shape, size, or origin.
So what are you waiting for? Check out Woofer today and unleash your inner dog lover! 🐶
- A fully functional search feature that searches through all dogs in the Dog API (more information found below)
- Build to the design spec linked below
- No established design systems to solve problems, we want to see your solution here only.
- We want you to showcase your additional skills by expanding on the challenge in front of you. Choose one of the following options below for expansion:
- Option 1: Add an expected feature to Woofers homepage in your development build
- Option 2: Concept an innovative feature for Woofer in a design tool / brainstorming tool of your choice
- This section aims to evaluate which part of our team you will thrive in the most. Please choose the option that best showcases your skills as we want to fairly assess the areas that you feel strongest in.
- Your technical abilities - both your ability to write code and your ability to explain your technical choices
- How well you articulate challenges
- Your process for working in an ambiguous space
- How you handle limitations or issues when building something
Below we’ve provided you with a GitHub Codespaces template link that is pre-populated with TypeScript and React 18. This is a free service that provides up to 60 hours of usage and includes a preview pane all within the browser. No dev environment setup! All you need is a GitHub account and the link below. Once there, click the “Use this template” button in the top right and then “Open in a codespace”. After you open the template, it will start the app and you should see the Woofer logo. Before you get coding, open the source control tab and publish the branch to a public repo within your GitHub. That’s it! You should be ready to work. Happy coding and thanks for taking the time to show us what you can do!
https://github.com/chelseasimek/msft-uxeii-code-challenge - you're here now
Password: woofwoof
We’ve placed the only assets you should need in the public folder. Exporting or other production design work shouldn’t be necessary.
- https://dog.ceo/api/breeds/list/all which returns all the information in JSON you should need to populate the navigation.
- For more information on the complete Dog API please see their documentation (it’s very simple which is great) Dog API
In the project directory, you can run:
We've already run this for you in the Codespaces: server
terminal window below. If you need to stop the server for any reason you can just run npm start
again to bring it back online.
Runs the app in the development mode.
Open http://localhost:3000/ in the built-in Simple Browser (Cmd/Ctrl + Shift + P > Simple Browser: Show
) to view your running application.
The page will reload automatically when you make changes.
You may also see any lint errors in the console.
Launches the test runner in the interactive watch mode.
See the section about running tests for more information.