This challenge has been designed to assess the ability of a front-end candidate to solve real-world problems using our current technology stack. While the difficulties arising during this project are real, the project itself is a mock and will not be used by us for business purposes.
- Fork this repository on github.
- Complete the project as described below within your fork.
- Keep the commit history - don't squash.
- Push all of your changes to your fork on github and work with descriptive pull request.
- A cup of ☕ or 🍵.
Make a simplified slack clone.
Structure:
- system login (only sign in and use fake data user)
- sidebar on the left:
- list of channels
- add / remove button
- list of users - direct messages
- chat window on the right
- list of messages
- each message
- avatar
- username
- timestamp
- message
- edit / remove button
- each message
- comment box
- use placeholders (both UI elements and actions / reducers) in place of features you didn't have time to implement - overall code organization and project structure are more important than implementation details;
- simplistic design will be completely acceptable - don't waste much time on it
- mock channels and users
- mock short history of conversations in channels / direct messages
- store everything in memory only (no need to persist data), but mock ajax calls and make these calls asyncrounous
- strive for good commit messages
- react (+ jsx)
- redux, MobX, zustand or React Context API (+ storage)
- react-router (+ route)
- Moment, date-fns, etc. (+ date)
- Any UI Framework as Antd, Material, ect.
- Use promises for ajax. No need to implement backend - mock response data and simulate latency (e.g. with
setTimeout) - The correct use of hooks (or custom hooks) will be valued if used
- Use correct spelling
- Code organization
- Code readability (including comments)
- Stick to the tech stack described above
- Commit history - structure and quality
- Completeness
- Test coverage