Scott104

I was at the last stage of for a full stack JS role. I was asked to do a technical challenge and I think my solution to that was not met the expectation. I decided to learn more details about react, redux and nodeJS and the confusing part is that I still not sure how to improve my solution. Here is the technical challenge

Using a provided GeoJSON data make a full-stack app that visualise boats on the map and filter them based on size and material on the map.

The provided GeoJSON file was having map 4 lat lng coords and meterial and size az key.

I since the provided GeoJSON was just a big array of objects (boats) and I could literally feed that to a map box function to visualise boats on map I just made and express app, enabled CORS and just served that JSON file under /boats route.

I then use create react app to scaffold react app and use redux for global state management. Here is my main suspicion of why I failed. With redux, I updated the store to have material and size key and in mapStateToProps of my child (BoatMap component) I made a logic that if the store was having material filter the boatList to only show that material and same for size. As a result, my mapStateToProps function was very big. I then used useEffect and put my actionCreator inside it and provided [] as second arg. I did not use async action creator (redux thunk) and I did the fetch request and resolved the promise inside my actionCreate. that might be another negative point but I have to mention during the interview I mentioned I don't have a lot of experience with redux and they told me as long as I can use redux to make the functionality it should be fine.

I used env for configs and used two docker container for font-end and backend. I used GitHub action and AWS EC2 instance and hosted them and gave them a live link.

I tired my code to use ES6+ as much as I could and I used sensible comment and variable names with right indentation.

It would be great if you can tell me what am I missing.