Overall, I spent around 16 hours on the test including thinking through the task,planning, coding, debugging, structuring, styling and answering these questions. It took me some time to debug my function to obtain the right "the most used word", because one of the testing files contains some underscores within and without characters. I felt that was a bit tricky but in the end I tried with regex and filter method to extract the "words" that are without underscores to achieve the task.
I chose to use React and Node.js to build the fullstack task because they are both written in javascript and they are the techniques I enjoy work with. In the assignment, I put extra time on creating more user friendly interface by styling and highlighting the key word and also implementing loading icon before rendering the text outcome.
React is the framework that I have been using in the majority of my work and private projects. I like using its hooks and functional components as it makes the code easier to read and also simplifies the way to handle the data by sending props and handling states.
In the backend I use Express, which is a Node.js web framework to build the server, and the API endpoint. I like its built-in middleware that make it easier to set up the project.
In the coding structure, I tried to break down the components and functions to keep the code simple and clean so it is easier to read. Although this is not a big project, I'd like to keep this in practice.
In styling, I chose to use class naming convention BEM and Sass, because BEM makes the class names clear to read and it increases the chance to avoid the styles that are on the same html tag elements but in different component get overwrite with each other. Besides, Sass makes the CSS structure more organized with its rules such as nesting selectors, import files and variables etc.
What would you add to your solution if you had more time? This question is especially important if you did not spend much time on the coding test - use this as an opportunity to explain what your solution is missing.
As I'm currently also working a full-time job, I spent my weekend and evening time to do this test. I tried my best to present my work and to deliver in time.
One of the things I would like to improve is to write more efficient code. Another is to improve my regex as it is very handy but it is not so easy and takes time to figure out the right pattern. The other thing is to implement design to highlight the converted word in the presented text for providing better user experience. Last thing is to try to build the work with another framework (such as vue.js, Angular) or libraries, just to try something new or different.
It was a very interesting test that looks simple but contains a lot of small details that requires to pay attention to such as error handling and special character in the text. The flexibility of technical choice provided by the test is very much appreciated. I enjoyed the process of doing it!