Showing the currently active Tailwind breakpoint streamlines building and debugging, allowing for rapid adjustments and a clearer understanding of how your designs adapt to different screen sizes.
In this post, you'll find examples of how to add this feature to vanilla HTML, React, Vue, and Svelte.
Read More →Inspect and adapt loops are the heart of agile development. They enable continuous learning, improvement, and evolution.
In this post, I discuss the limitations of the "fail fast" approach and propose a more impactful alternative: "learn Fast". This mindset embraces the inevitability of failure in innovation and transforms every challenge into a learning opportunity.
Read More →Structured logging focuses on capturing data in a consistent and machine-readable format.
Unlike traditional text-based logs, structured logs are more straightforward to query and analyse, making extracting insights and debugging issues simpler.
In this post, we'll take a look at an example of how structured logging with Pino.
Read More →This post celebrates and thanks Joe Parry as he takes a well-deserved bow and steps down from his role as the head of the JavaScript & NodeJS Cambridge Meetup Group.
He has been an extraordinary leader who has dedicated the past ten years to fostering a vibrant community of Javascriptors in Cambridge.
Companies must be agile and respond quickly to changing customer needs in today's fast-paced and constantly evolving technology landscape. That's why DevOps practices that emphasise collaboration and communication between development and operations teams to deliver software rapidly, reliably, and at scale have become increasingly popular.
Shifting left, a core principle of DevOps can significantly benefit companies of all sizes. By empowering engineers to take on more operations responsibilities and promoting a culture of experimentation and innovation, companies can improve collaboration, increase reliability, and deliver high-quality software at scale.
In this post, I'll discuss how and why Cambridge University Press adopted a shift left culture.
Pino is a popular and fast Node.js logging library that is designed for high-performance and low-overhead logging. It has many useful features, including support for structured logging, log levels, and log redaction.
Pino logging redaction allows you easily redact sensitive information logs, ensuring applications remain secure and compliant with regulations.
In this post, we'll take a closer look at Pino logging redaction functionality, what it is, and how it can be used with examples.
Read More →Logging is an essential part of any application, providing insight into the what's happening behind the scenes. However, as your codebase grows, it can be challenging to keep track of all the different log statements and where they're coming from. This is where child loggers come in.
Child loggers are a feature of many of the Node.js logging libraries such as Pino, Bunyan and winston have that allow you to create a new logger that inherits the configuration of its parent logger.
This means you can create child loggers that are pre-configured with specific options, making it easier to log messages without repeating the same configuration over and over again.
In this blog post, we'll take a look at an example of how child loggers can help cut down on repetition in TypeScript and Pino.
Read More →Engineers are responsible for designing and building complex systems that are expected to perform optimally under different conditions. However, without a deep understanding of how these systems behave, they risk making assumptions that can result in inefficiencies or even system failures.
In this post, we'll discuss why understanding a system like a doctor helping a patient is essential for engineers and by taking a proactive and data-driven approach, engineers can ensure that their systems are performing optimally and can make informed decisions that result in improved performance and reliability.
As engineers, one of our primary responsibilities is to ensure that the systems we build are stable and reliable.
However, despite our best efforts, issues and issues will inevitably arise in production environments. When this happens, it can be tempting to try and patch the problem and move on quickly.
However, recreating production issues locally is a critical step in the debugging and resolution process.
In this post, I'll explain the benefits of reproducing production issues locally.
Some organisations have great onboarding processes, others not so much.
Having experienced onboarding with many clients over the years, I want to share what a good onboarding process is for an engineer.
When working with clients, how teams communicate tells me more about the culture than anything else.
Successful teams should communicate like a team fielding in a game of cricket who work together towards the same goal giving each other support and encouragement.
By sharing information about the batters, pitch, conditions and strategy, a feilding team agree on a plan on how to bowl and position themselves.
A good facilitator seamlessly keeps the flow of conversations fluent and relevant, encouraging people to engage and have equal participation while remaining impartial and patient.
It's a role similar to a conductor orchestrating a choir.
Framer Motion makes creating a sequence of animations easy.
In this example, we will create a React component that animates a circle in the center of three boxes.
Should you build UI components and then add them to a page or build the page first then break it down into UI components is the chicken and egg of software development?
Read More →You've probably heard someone quote Norm Kerths' Prime Directive during a retrospective
Regardless of what we discover, we understand and truly believe that everyone did the best job they could, given what they knew at the time, their skills and abilities, the resources available, and the situation at hand.
In my experience, engineering teams doing their best at that time inevitably end up having to shoehorn features as requirements change or new information becomes available.
In this post, I'll discuss why great products need strong foundations.
Read More →Having worked with many clients who struggled to maintain Javascript projects, Typescript was a no brainer when choosing what to use for the project I was leading.
In this post, I'll share what and how I managed the challenges of introducing and using Typescript.
Read More →Having used Tailwind in my personal projects, I was already a convert of the utility first approach. When I was given the opportunity to lead a new project at Cambridge University Press, Tailwind was the first tool I reached for.
In this post, I'll discuss why and how using Tailwind worked out for us.
Read More →Having experienced the pain of schema-first GraphQL projects, I wanted to use a different approach for a project I led at Cambridge University Press.
In this post, I'll describe what I used and how using code-first GraphQL worked out for us.
Read More →In this post I'll show why and how you can use scoped styles with Tailwind and Svelte.
Read More →In this post I'll show why and how you can use scoped styles with Tailwind and Next.js.
Read More →Tailwind is rightly receiving all the attention it deserves. Every developer I've introduced it to falls in love with working with CSS again!
On a recent Nuxt project, I noticed a potential issue when using Tailwind class names.
Suddenly 'bg-green-500' didn't behave as expected, as an external component also using the same class had set the color to something else.
Read More →In this post I'll show why and how you can use scoped styles with Tailwind and Vue.
Read More →Stencil is a compiler for creating web components that work alone or with web applications written in React, Vue, Angular, Svelte, Ember or anything else you can think of.
Tailwind CSS deserves all praise love it's getting right now as the developer experience is incredible.
In this post I'll show how to create a Stencil web app using Tailwind CSS.
Read More →It's a good thing browsers don't allow sites to autoplay audio or videos without user interaction.
However, on iOS in particular, you might encounter the error
The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
when there is an async operation between the user interaction and playing of audio.
The good news is there's a workaround for it.
Read More →It can be a struggle, endlessly trying to convince your organisation to believe in your ideas and vision.
In this post, I'll share how I managed to do this.
Read More →In 2008 the media were reporting on mistakes and delays in marking examination scripts. To ensure they never made the front page of newspapers for the wrong reasons, Cambridge Assessment decided to rethink how they electronically marked examination scripts for millions of students worldwide.
Read More →In 2015 I was hired by Cambridge University Press to develop a web application providing digital access to over 35,000 books and 1.5 million journal articles, consolidating several smaller sites. The application would go onto have over 2 million users a day and generate £65 million in revenue per year.
It was a fantastic technical learning opportunity, but it was our culture and approach to product development that would teach me the most important lesson of all.
Read More →
