In this task you'll be creating and deploying a simple, full-stack, responsive, single-page application in Node and Angular 1/ AngularJS (NOT Angular2+) or ReactJS.
I would like you to create a multi-step or multi-screen athlete profile form that gathers standard demographic, sports and event data. Here is a list of data points and sports you might want to use:
Name
Date of Birth
Location
Team
(e.g. New York Giants)Gender
Sports
(Can Multiple)About
Interests
Profile Image
- Golf
- Tennis
- Cricket
- Basketball
- Baseball
- American Football
- Aquatics
- Archery
- Automobile Racing
- Badminton
- Beach Volleyball
- Bobsleigh
- Body Building
- Boxing
- Cross Country Running
- Cross Country Skiing
- Curling
- Cycling
- Darts
- Decathlon
- Down Hill Skiing
- Equestrianism
- eSports
- Fencing
- Field Hockey
- Figure Skating
- Gymnastics
- Ice Hockey
- Martial Arts
- Mixed Martial Arts
- Modern Pentathlon
- Motorcycle Racing
- Netball
- Polo
- Racquetball
- Rowing
- Rugby
- Sailing
- Softball
- Shooting
- Skateboarding
- Skeet Shooting
- Skeleton
- Snow Boarding
- Soccer (Football)
- Squash
- Surfing
- Swimming
- Track and Field
Here is a suggested organization of the form but use your best judgement and creativity:
- Basic Info: name, sport, gender, date of birth
- About: description, location, team etc
- Summary: show the athlete a wrap-up screen with the info they added, and give them a way to go back and edit if there are any mistake
- Submit: On submit, the payload should be sent to a simple end point which persists the profile. This should be saved to a simple free MongoDB instance, such as mongoAtlas.
- Profile: A well styled profile displaying all the information gathered about the user
- List: After submission I should see a list of all profiles I have created
Here are the requirements for the API
- Node/Express
- Mongoose ORM (MongoDB)
- 3 End Points - POST, GET, PUT
- Request Param Validation - express-validator (Bonus Feature)
Please note:
- This is a single-page application. There shouldn't be page reloads between screens.
Please spend no more than 5-hours on this test.
Within your brief 5 hour time limit I hope you'll prioritize the following, in this order. Consider this an iterative process � get it working on sound principles first, then refine and polish as time allows.
- Make it work!
- Clean and clear code (hopefully you didn't sacrifice this to make it work)
- Project organization
- Planning: tools used, implementation strategy, basic UX concerns like what to ask for where
- Make it look good - just use Bootstrap, a Material theme, or whatever you're comfortable with
- Management of data, state, and events internally
- Code quality details
- Type, variable, property checking
- Failing fast, for better debugging
- Extra polish, concern and care will be noticed
Less important details:
- Tests are great, but I doubt you'll have time.
- Be efficient! Please don't reinvent the wheel, use [generators]and other tools when they speed up your process and get you to your end goal faster.