Using the included design comps, your goal is to create a working version of 'FamilySpot', a fictitious Family Reunion app. We're particularly curious to see how you internalize and organize your browser code. Use this as an opportunity to show us how you like to work.
- Create a high-fidelity version of the FamilySpot main screen, which breaks responsively to mobile width. (As demonstrated in the sketch file).
- When you click the 'Edit Info' button, it launches a live edit modal. Changes to the modal should reflect on the screen after you click 'Save.'
- Don't worry about session management/account creation/login. It's fine to store data in localstorage, or even a global variable.
- The most important goal here is to give us a sense of your code style, and how you use technology to solve problems. Feel free to use as many (or as few) libraries, gems, other technologies as you see fit. It's important to demostrate your own style and approach.
- Package all dependencies. Make sure all libaraies, npm modules, or gems are either in a gemfile, package.json or other dependency management system (npm, Gulp).
- Annotate your code. Give a brief description of your approach in the README (do edit the readme!). Include any-non obvious setup instructions in the README. Where possible, make your code self documenting (well named variables, methods, and clear composition of responsibility). We really want to see how you communicate your intentions and choices in the code!!!!
- Tests are optional. But we'd really love to see it if you have the time. We recommend using rspec for rails tests, mocha/jasmine for javascript. However, whichever tool you prefer is fine.
- Pick just one browser to test in. We'll be looking for best practices for browser compatitbility, but for the sake of speed, you don't need to test in all the major browsers. Just pick one, and let us know which one to look in.
Link to a git repo is easiest, but a zip/tarball is good too.
- For react, feel free to clone this boilerplate: https://github.com/everplans/react-boilerplate (which has some examples of how to use our test tools), or feel free to use your own boilerplate.
- Try not to use too heavy of a layout framework like bootstrap. (Preprocessors and other lower level tools like sass or stylus are fine though) We want to see how you think about layout, cascades, styleguides, and re-usable components.
The following are not required, but would definitely help set you apart from your competition:
- Use frontend integration tests (mocha, jasmine, etc.).
- For super, super bonus points, use some of the patterns from TestRig or fluxxed_up (examples in the boilerplate repo).
- Leverage HTML5/css.
Overall, have fun with this, we want to see the code you like to write. Reachout if you have any questions or comments. Looking forward to seeing your code!
--Everplans engineering team.