I was brought on board to lead the development on HPE’s Standards of Business Conducts (Compliance) website. No ordinary website, this one would require a CMS on the backend so edits can be made to content, language translation into 24 languages including 2 right-to-left languages, compatibility back to IE11, and a fully dynamic front-end. Oh, and we had 3.5 months, one of which was December, to get it done with two developers max.
So, I divided up the tasks between myself for the React.js front-end and a solid WordPress/Node developer on the backend. We found a few starter kits later on (no longer maintained already!), but we rolled our own stack setup.
For the front-end, Next.js was the obvious choice. I wanted to work on it for a long time, and it seemed like a good fit. I had never worked on my own GraphQL full custom roll either, so this was a nice test to see how everything worked together with Apollo.
Building out the pages and components was super easy. We also had to add company required headers and footers, so that came in via jQuery. Yep, jQuery in React.js. So that increased our bundle size a bunch, and slowed things down. But, that’s what was needed to make things happen, so we custom built the headers.
The biggest challenge was the languages. Getting the cookies set was easy enough, but the client needed to be able to change languages and fetch all the pages in those languages during the session. This became quite complex (Thank the tech gods for Polylang Pro). Before it was all said and done, a staff of a dozen or so had to input and modify the language text itself.
As always, the needed support for IE 11 required polyfills and presented enormous styling challenges. People forget IE11 responds very badly to flex. One of the many challenges is that
flex: 1 0 0 is represented differently in IE 11, and needs to be
flex: 1 0. So, you need to build a TON of custom media queries that start with something like:
@media (max-width: 769px) and (-ms-high-contrast: active), (-ms-high-contrast: none) There were many challenges like this for IE, including videos and images. I’ll be happy when the tech gods bury this browser forever.
Overall, I feel the dev team did an incredible job for the time and fees we put out there for our clients. This was a massive undertaking during this time-frame, and the launch of the site got rave reviews internally! That’s always the goal- to make our clients look like the smartest people in the room.
Thanks to the coding and content team for their hard work and many late hours getting this ready!