Goal: Create a simple, mobile-only, SvelteKit page according to the provided Figma design

We’ve setup a GIT repository for you to clone and get started with. This includes all the needed Node modules, server api responses and assets.

The end result should resemble the design closely, but feel free to change small bits if you feel like it’s needed. Functionality-wise, the application should get a random post with comments from the REST API. Liking, commenting and any other functionality you may want to add should only happen on the client-side. No APIs have been built for those functionalities and it’s not needed to create any other mock endpoints.

There are some pre-installed packages, like Tailwind and FontAwesome, but you’re free to install any other NPM packages if needed.

In the end we want to see what you’re capable of as a front-end engineer, so do and use anything you feel like is needed to achieve this goal, within reason for a job exercise. Submission will be done through a planned meeting where you’ll be able to elaborate on some of the choices you’ve made in developing the page. If anything is unclear from this document, feel free to reach out to Rasmus or Sebastiaan.

Expectations

• Your own implementation of the provided Figma design.
  • Users should be able to view a post and its comments.
  • Users should be able to react to/like a post or comment.
  • Users should be able to reply to a post. A comment does not have a reply function.
  • If there are no comments on a post, an empty state should be displayed.
  • There should be some very basic validation on the input field, like a minimum/maximum amount of characters.
• Fetching of posts and comments via the REST API.
• Client-side implementation of liking and commenting on posts.
• No extra endpoints added.
• No testsuite needed.
• The Figma design includes some extra design elements (ellipses, new replies, hidden replies). Those are optional to implement and can be skipped fully.
• The implementation is responsive and works on most modern mobile devices.
• You’re able to explain and walk through your code in the planned meeting.
• Estimated time is around 4-6 hours max depending on your familiarity with SvelteKit. We don’t want you to spend too much of your free time.

REST endpoints

• GET /api/post/[postId]
  • Use this endpoint to get a random post to display.
  • Returns type Post
• GET /api/post/[postId]/comments
  • Use this endpoint to get random comments related to postId
  • Returns a list of type Post