3 min read | 11 Nov 2023

AUSTRALIA POST FORM DEVELOPMENT

DEVELOP A REUSABLE FORM COMPONENT INFRASTRUCTURE TO RAPIDLY DEVELOP FORMS CONSISTENTLY

When I took on this project it was on it's last legs. My job was to turn it around and get it on schedule ASAP!!. This project wasn't behind due to from a lack of effort but rather a lack of front end development experience.

The team were experts in back end development & had dabbled with front end development. From this knowledge it seems straight forward to build out the architecture.

Why is it so hard to build a form? A little bit of styling with some validation what could go wrong?

This was the question raise in a meeting where I raised the concerns below to the senior management team. Who had a meeting with the client at 9am the next morning to make the decision on which way we should move forward. At 5:20pm I was asked write a document to present to the team in a way that would enable them to make an informed decision by 8am.

Coming from a start up culture to me there is no such thing as regular hours. If something needs to get done, it MUST be done. At 8am I presented my insights to the team after finishing on the document at 3:30am.

The below are the aspects I presented that needed to be addressed immediately in order to move forward successfully. The concern was that if we changed these aspects of the code base, we would be pulling apart months of work & rebuilding many features while being constrained to a tight budget.⁠

TypeScript Vs JavaScript
- The entire code base was written in JavaScript & when you haven't learnt TypeScript correctly this decision feels like a blessing! The issue with TypeScript when you don't understand it is that you end up fighting against it for hours! It feels like you are making no progress. However this initial pain is nothing compared to debugging the code base endlessly with no reference to the data types.
- Using TypeScript would give the team confidence in the types of data we were using improving the debugging process dramatically.
UI Frameworks
- The code base was all written using plain React with CSS & JavaScript. Which is OK when the team is writing code consistently. The issue in our case was the each component was built in a custom manner and behaved in a custom fashion with no documentation.
- This lead to the team constantly helping each other debug the code base to understand the nuances of each component. Taking time away from their own work
- The solution here needed to leverage NPM packageswhich solved 2 problems. It improved the consistency of how the components were written as well as gave the junior developer detailed documentation on how to complete their work. This also gave time back to the senior developers to steer the project forward.
Consistent Code Patterns
- Because the foundations of the code base had to be re written I took this opportunity to teach the development team how to structure the code base consistently including file structure and naming patterns.
- This dramatically improved the readability of the code base improving debugging times & improve the ability for developers to work with components written by other developers.
Validation
- The validation file was custom built, 2000 lines of it.. There were disagreements that this custom function could work. The issue was every new developer needed to study it line by line just to understand how to use it.
- This took up precious time to do & was not scalable moving forward.
- I made the suggestion to use YUPvalidation & at first there was push back, however when walking the team through working with YUP the simplicity & documentation won them over.

After the meeting the decision was made to move forward using the updated Tech Stack & I needed to prove to the team that this was the right decision.

I buckled down working extra hours into the weekend and delivered the first version of the form within one and half weeks. The team were wrapped, we were finally making progress!

Next up I trained up 3 Junior Developers to help complete the project. This was a true test of their commitment & determination to contribute. Over the following weeks they all rapidly improved taking accountability for their individual forms.

Unfortunately my contract ended before all forms were completed.
This project pushed me to become a better developer in both leadership & technical skills.

Thank you to Paul & Adam for this opportunity it was a pleasure working with you.

Loading content...