At the start of the interview, my first thought was to break the giving layout into components. From there, I started thinking about what would be reusable components (E.g a Button ) and what would be a standard component. Usually, I like to analyze the given question first, before going hands-on with coding. Since the test seems to focus more on the design aspect of things I worried less about logic and functionality.
From there I began coding the application and prioritizing what would be a must-have in the layout. For example, the scrollable feature and the necessary information required to display. Once I had only 45 minutes to end this small project, I decided to focus so much on responsiveness across devices. However, this would be easily implemented with react-native-responsive-screen.
After the given interview, I added a few more styling details and reusability. For example, I added variables.tsx
and boxshadow.tsx
to reuse stylings across files (DRY Concepts). Additionally, I renamed a few variables, created two components, and iterated a short list to render JSX elements. Overall, I wanted to make sure the code was maintainable and scalable for the longer term.
Additionally, I added a few images and icons to the application, so it looks more appealing.
- Once the interview ended, I did not have access to the layout image. Due to the lack of time, I made a few changes in the app while betting on my memory of the given layout.
- Also, due to the test being quite fast, I did not focus so much on Android inasmuch as the majority of the market uses apple (iOS) devices ( sad but true ), I was also not entirely sure if that was requested.