Articles

Styled‑components

In React and React Native, styled‑components is a popular library for writing CSS-in-JS for component‑level styles. It uses tagged template literals to apply CSS styles to a component, which then allows us as developers to use JavaScript to dynamically style and manipulate components via props or state. Styling can be encapsulated and written modularly for each individual component, making management in larger‑scale applications easier.

Below you will find a subset of articles from my blog specifically about styled‑components. Although this is a topic I've been working with for many years, it's fair to say that I've not written about it often. I've only managed to publish one article about it, which you can see and read below.

Read article
Understanding Transient Props in styled‑components.
20 May 2024
Understanding Transient Props in styled‑components

"
John Kavanagh is a fantastic developer with all the skills one would want in a lead developer. He's done a superb job on all tasks and has been a great resource within the company. Exceptionally knowledgeable, self‑motivated, and a great team player. I would certainly work with John again!"
Adam Millington Front‑end Developer
"
John Kavanagh is one of the most open‑minded developers I have ever worked with. His appreciation of great creative work, his enthusiasm and 'anything is possible' attitude is always a breath of fresh air. He is always super efficient and effective, combining a great work ethic with immense talent."
Mike Etheridge Creative Direction + Design
"
I had the pleasure of working with John Kavanagh during his time as a contractor on our Web Experience team at Nando’s. He made significant contributions to our technical SEO capabilities, delivering excellent structured data work across our recipes, blog content, and product pages. His implementation of JSON schema markup notably improved our search indexability and how our content appears in search results. He was also instrumental on updating the VI of the restaurant pages and completed that on his own.
Beyond his technical expertise, John brings a wealth of experience from his impressive career background and fits seamlessly into team culture. He's genuinely enjoyable to work with ‑ down to earth, approachable, and someone you can rely on to get the job done. His positive energy and collaborative nature made him a valued member of the team, and I wouldn't hesitate to work with him again. We will miss him at Web Ex."
Liam Kilkenny Senior Software Engineer
"
I've worked with John Kavanagh several times, and can fully recommend his services as a front‑end web developer to anyone. He is a strong JavaScript programmer, and has thorough knowledge of cross‑platform HTML/CSS development. Always punctual, very friendly and importantly knows how to get the job done on time, maintaining a keen eye for professional detail."
Christian Duncan Technical Lead
"
I was lucky enough to work with John Kavanagh at Selfridges on the CX Team for the better part of a year. Throughout that time John's expertise and insight were invaluable in helping get projects started and over the finish line. He is a very approachable, diligent, and good‑humoured Front‑End Developer and I hope to work with him again soon!"
Alex Harmsworth Front‑End Developer
"
John Kavanagh was always articulate, willing to speak his mind, helpful and always did an amazing job ‑ he clearly takes immense pride in his work (and rightly so!). His attention to detail and perfectionist attitude helped produce a product that we could all be proud of."
Howell Lee Head of Business Analysis
"
John Kavanagh is an incredibly talented and efficient developer with great expertise in Gatsby and Contentful. He is incredibly personable and also always willing to share his knowledge. I also appreciated his ability to communicate openly and in a way that allowed me to find a way forward with him.
It was a pleasure to work with John and I would welcome another opportunity to work with him again!"
Clarisse Reyes Senior Client Success Manager
"
John Kavanagh's biggest strength is his ability to deal with conflicting priorities in high‑pressure situations. Along with his excellent development skills, John's ability to manage difficult stakeholders and requirements is one of the key reasons that the projects he led were completed on time without too many problems."
Devrim Ersanli Senior Front‑end Developer
"
John Kavanagh is a highly intelligent and truly senior front‑end web developer, who's surprisingly well versed in the arcana of CSS. I enjoyed John's productivity and attitude, and I very much look forward to working together again."
Samu Lang Technical Director
"
It's been a pleasure to work with John Kavanagh in the web team at Nando’s. He's a top professional who has prided himself in bringing my designs to life with a high standard since day one. He has a great eye for detail with a clear understanding of user‑centric thinking and is always willing to give great suggestions from a technical standpoint.
I have also really appreciated his positive energy which gives a great lift to the team at every stand up. Any team would be lucky to work with him, as I have experienced myself!"
Edwin Yuen Senior Product Designer
"
I had the pleasure of working alongside John Kavanagh on a project focusing around building static webpages for a client, as well as improving their current webpages. John was an absolute pleasure to work with, he knows how to benefit the project and is able to get his point across without being offensive, this really helped him share his vast knowledge of JavaScript, Gatsby and Contentful.
I can see John fitting into most environments as he has a great sense of humour, can read the room and has very advanced soft skills."
Phanos Panayiotou Product Developer
"
John Kavanagh is an incredible UI developer, mentor and passionate lead developer.
I've been incredibly impressed by his technical understanding of UX and front‑end frameworks. Rapid turnaround times with quality output and attention to detail. Would highly recommend."
Mark Burch Technical Lead
"
Worked with John Kavanagh on a big Nando’s project, moving a legacy site off of Drupal and onto Vercel and Next.js.
His work and attitude are both stellar! Highly recommended."
Scott van Looy Technical Director
"
John Kavanagh is very sharp and detailed when it comes to handling complex HTML and CSS components. He has a very wide knowledge of Front‑End development and knows how to sort out any problem that arises. John was an essential part of the team, and I would be happy to work with him again in the future."
Isaac Goldfarb JavaScript Developer
"
If you're seeking to elevate the visual appeal of your design and translate it into an exceptional user interface, John Kavanagh is the ideal professional for the job. With his outstanding skills as a UI developer, he consistently delivers remarkable work with remarkable efficiency. John's contributions make him a valuable addition to any front‑end team."
Andy Howell Technical Lead
"
John Kavanagh is enthusiastic and enjoys getting work completed. His opinion on how we have developed features has been key to our success this financial year. He is fun to work with, always vocal and the dynamic he brought has driven us to deliver better quality features faster than before."
Daniel Franks Product Owner
"
John Kavanagh was great to work with, solving problems without any input and contributing to the project way beyond what was expected. I'd happily work with him again and would easily recommend his talent to everyone!"
Simon Hunt Co‑Founder
"
John Kavanagh is a passionate and highly skilled developer with a wonderful ability to calmly concede downward business pressures whilst pragmatically delivering the project at hand.
John is never fazed by project management/requirement issues as are common in these environments, instead, he always finds a way to deliver value to both the end consumer and the business. It's not always easy to remain level‑headed and calm on high‑pressure projects but John's good nature and professionalism invariably remain infallible. It's an absolute pleasure working with him."
Menelik Williams Lead Full Stack Developer
"
John Kavanagh is a talented front‑end developer and was also a very fast learner. No matter what was thrown at John he always delivered in a timely manner and with a professional attitude. He is easy to work with and an inspirational person to be around."
Jamie Scott CTO & Co‑Founder
"
Delighted to write a few words of sincere praise for John Kavanagh's excellent and exciting work and help in launching our new film production company. I plan to contact him again shortly about another, completely different project, as I do not think anyone could handle it better!"
Clive Evans Director & Producer
"
John Kavanagh is an exceptional programmer who consistently delivered high‑quality work at Selfridges. He possesses exceptional front‑end development skills and has a remarkable ability to tackle complex problems with creative and effective solutions.
What sets John apart is his strong work ethic and dedication to delivering results. He is a reliable and proactive team player, willing to go the extra mile to ensure project success. I was particularly impressed with his ability to resolve issues and make the explanations simple and succinct. He communicates effectively, collaborates seamlessly with team members, and approaches challenges with a positive and solution‑oriented mindset."
Gene Da Rocha Generative AI Engineer
"
John Kavanagh is an 'above and beyond' front‑end developer. By that, a task could be assigned to John and he would complete it effectively, but more than that, if involved at the beginning of the process, he would add so much more value to the project in way of ideas, solutions, process, search optimisation, user experience and so forth."
David Mannheim Founder & CEO
"
John Kavanagh is one of the best front‑end developers I've had the pleasure of working with. Incredibly knowledgeable, great attention to detail – he understands design and why it's important to get it right. Always professional but with a great sense of fun, John would be an asset to any team and project."
Malin Johannesson Lead UI Designer

Articles

# Styled‑components

Understanding Transient Props in styled‑components

Styled‑components

Understanding Transient Props in `styled‑components`