Skip to content

Instantly share code, notes, and snippets.

@original4sure
Created March 12, 2019 13:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save original4sure/2dea87b6a8c923ccee48561a6b03940a to your computer and use it in GitHub Desktop.
Save original4sure/2dea87b6a8c923ccee48561a6b03940a to your computer and use it in GitHub Desktop.
Take home hiring assignment for front-end engineer.

Create an offline TODO app for the browser using ReactJS/VueJS/VanillaJS.

Key Features to Implement:

  • A simple input bar to add Todo(s) on pressing the return-key.
  • A list of TODO cards where each todo is appended on creation.
  • Clicking on a TODO card should mark the TODO as complete and move it to the bottom of the list.
  • The active TODO cards should appear in order of creation (most recent on top), while the completed todo cards should appear in order of completion (most recent on top).
  • A reset button on the top right corner of the App to clear all Todo(s) and return to initial state.
  • Hitting the refresh button (including hard refresh) in the browser should not cause any change in the state of the app (it should work like a regular offline app).
  • Create a Hash-tag feature:
    • Any text in todo matching the #hashtag pattern should be separately highlighted
    • Clicking on a hashtag should act as a filter and show only Todo(s) containing that tag.
    • Hashtags can be stacked and the result should be only Todo(s) where all of them are present (ex. after clicking #work I should then be able to click #back-end to see Todo(s) containing both tags)

Expectations

  • We expect to see UI/UX chops coming from your end.
  • Obvious things should work as expected.
  • Any additional utility or UX features that you might have time for are appreciated.
  • App should work in the latest version of Google Chrome and Firefox.
  • App should work simply by starting an HTTP server in the root folder (it should have index.html file as entry-point).

How to share your code

Use Git for versioning and create a public Github repository to host your code. Share the link of the repository with us.

Keep in mind

This submission serves the purpose of demonstrating your capabilities. Anything that eases the process of determining the correctness and robustness of your solution will be to your benefit. Documentation, a list of assumptions, clear highlighting of unhandled edge cases etc., would be highly appreciated. For any queries please feel free to contact us.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment