Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
July 25, 2022 05:50 pm GMT

React.js Interview - technical submission and detailed feedback

I have recently created a React.js project for one of the MNC I'm interviewing at and they provided a really detailed feedback of my assignment submission.

Sharing the codebase and the Feedback given by company here so anyone can benefit from it.

Requirement: Create a React.js app to list stocks and clicking on a stock will take to stock detail page which have stock quotes listing.

  • Should be filtrable.
  • Stock Quotes can be sorted by date.
  • Once the Quotes expires fetch new quotes [polling].
  • Should use React.js.

Submission:

Detailed Feedback

@Negatives- code look messy and unnecessarily made complicated- created a common http get service around axois, the implementation is not proper- unnecessary component wrappers, just for using some CSS classes- usage of error boundary is not in the recommended way- unnecessarily added new functionality rather than concentrating on the complete solution- unnecessarily suppressing lint rules- not handling mobile responsiveness@Instruments page / stock listing - api call twice on page mount - using 2 different state for search results and default view - filter function will always runs@Quotes page / stock detail page - api call twice on page mount - polling is implemented but the implementation is messy and won't work implementation details      - spawn a web worker and listen for post message, inside this if the quotes list length is 0 make an api call to update the quotes      - providing the user a control to update the interval (1,2,3,5,10 ms) for checking expired quotes      - there's  a  set interval run on this interval (1..10 ms) inside this posting a web worker message      - web worker will run the loop for checking the quote's expiry and the expired leg is removed from the list      - once all items have been removed from the list, initiate the api call to fetch new quotes, this time frontend will hit the server at least 100-300 times (sometimes more than 1800 requests)       reasons for this the web worker will receive a message every 1-10ms and hit the server - not properly clearing set interval, leads to calling the previous apis as well, now the loop will hit the server more than 5k times - Use string split and replace T and Z to convert the timezone for comparing the time - timestamp not converted to IST in the table listing@Positives- Using typescript- Using error boundaries- segregating code by spliting components and util functionsInstruments page- implemented searchQuotes page- implemented sortWe thank you for the time, energy, and effort you invested in our process and we wish you the very best in your future endeavours.

Disagree Points.

  • What I didn't found helpful in this feedback is that it says the code looks messy, which I totally don't agree. Folks here can give their feedback about this and this will be super helpful.
  • Also The react does render everything 2 times in dev mode in v18, that's why APIs get called two times, but in production it doesn't happen.
  • The timestamp which is received by API must be in Unix timestamp or UTC to do date operations better, I had tough time doing that time conversion which I end up doing with split and replace. Didn't wanted to use moment for this 1 task.

At the end It was a really nice experience and get to know new things.

Thank you for reading


Original Link: https://dev.to/rajeshroyal/reactjs-interview-technical-submission-and-detailed-feedback-2pk7

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To