Harry Roberts
CSS Wizardry
Doors will open at 8:30am. We'll have a selection of fresh fruit and pastries for you to choose from and for 2024 you can grab yourself a fresh coffee from our onsite barista thanks to our sponsor Scrumconnect!
I'll examine the recent trend towards meta frameworks like Nuxt, Next, Solid Start, Remix, SvelteKit, and others, exploring the factors driving their rise in popularity. We'll discuss the benefits and potential drawbacks of using meta frameworks, when they are the best solution, and scenarios where other options may be preferable. Through live coding demos, I'll showcase the current capabilities of meta frameworks and offer predictions on how this landscape may evolve over the next year.
What if you could just draw what you want? What if you could just scribble a drawing of a website, and hit a button to make it real? What if you could just draw a picture of a database, and hit a button to make it happen? Multi-modal AI makes this more of a possibility everyday, and we tried it out at tldraw. In this talk, I'll share everything we learned, so that you can make your own version too. I'll show you what worked, what didn't, and the unexpected lessons we picked up the hard way.
As the landscape of technology evolves, so do the expectations of our web clients. For the longest time, we’ve gotten away with executing resource-intensive tasks without a noticeable impact on our user interfaces. However, in the face of ever-expanding data demands, it has become imperative to seek out ways we can improve our application’s performance. In this talk, we will delve into the untapped potential of web workers for supercharging your web applications. I will serve as your guide on this journey as we explore the fundamentals, I’ll show you how I built a performant image cropper, as well as the limitations of this fascinating technology. At the end of it all, you’ll have a much better understanding of web workers and how to harness its power to build high performance applications and user experiences.
When dealing with more advanced UI elements there are a lot of things that go wrong. They impact performance, accessibility and have the tendency to create frustrations along the way. In this talk, I will be introducing you to the W3C community Open UI, while also taking a little detour with the Anchoring API. By combining these new features we'll take a peek at the future of styling custom UI by only using HTML and CSS, giving you less frustration, performance boosts and basic accessibility out of the box. As a bonus, we'll also have a little look at stylable selects and exclusive accordions.
Exceptional front end developers are often promoted into leadership positions. This transition can be daunting. Michaela's talk unveils a tailored framework for these "accidental managers," offering strategies to delegate, communicate, and give feedback effectively. By empowering them with leadership tools, she prevents them from becoming mere "walking spreadsheets," and inspires them to maintain technical expertise whilst excelling in leadership.
Join us for a fully catered lunch from last years favourites Bentleys. We'll also have a few games giving you the chance to win some special prizes.
Learn about streaming live coding, and how writing silly code in front of a live audience is a powerful (and hilarious) way to build community.
Have you ever found yourself not just having to build the product, but in the absence of an actual designer, you’re the one who ends up having to throw together a design for it too? Want to gain the magic design powers to transform that average screen into a beautiful interface? People have often told me they’d never be able to design interfaces because it’s too subjective and a completely different mindset to coding. Well I’m here to tell you that UI design isn’t as complex as it looks when you’ve got the right tools to hand – and it really isn’t a magical dark art, I promise! In this talk, I will help you understand some of the main design principles that you can apply across UI design. Such as Typography, Emphasis, Hierarchy, Layout, Spacing, Size, Depth and Colour. We’ll be discussing these principles and, through visual demonstrations and examples, show how you can implement these principles across typical UI components such as forms, cards, dashboards and other interface elements. Whether you’re the ‘dev-signer’ or you’re just somebody who would like to learn some fundamental design skills to widen your knowledge – you should then leave feeling well equipped with new design skills to apply day to day!
Runtime CSS-in-JS and style props are powerful features that allow developers to build dynamic UI components that are composable, predictable, and easy to use. However, it comes at the cost of performance and runtime. With the release of Server Components and the rise of server-first frameworks, most existing runtime CSS-in-JS styling solutions either can't work reliably or can't work anymore. In this talk, we’ll explore how modern CSS-in-JS improves performance and user experience.
The past few years have brought us a tonne of new CSS features to help solve common layout challenges. In this session, we’ll delve into some real-world use cases for new features like container queries, subgrid, the :has() pseudo class and more. We’ll explore how to build robust, flexible and creative layouts that respond to both content and context, and take a peek into the near future to see what’s coming next for CSS layout.
When it comes to testing for accessibility of our web apps, most of us would have used Chrome Lighthouse to generate a report and use the results to improve the accessibility of our web apps. However, that is not the only way to test for accessibility, and those tests can only detect a subset of issues. Do you know, there are many other ways in which we can test for accessibility using those same dev tools? In this talk, we will delve beyond the conventional use of Chrome Lighthouse and uncover several alternative methods within the developer tools to test web accessibility. We will explore techniques such as inspecting the accessibility tree, gaining insights into ARIA attributes, emulating various vision disabilities, and more. So, join me in this session, where we will unlock the potential of dev tools to unveil a diverse range of accessibility issues. Let's all learn together and improve how we test for web accessibility, and make the web inclusive for all our users.
As awareness and tooling around site speed have been improving at a very exciting rate, has performance testing actually become any easier? Any more straightforward? As someone who spends every day auditing client projects, I think areas of confusion have actually increased in many places. Which tools should we be using? Can we trust them? How do we run tests that serve as realistic and actionable predictors? And how do we know when we’ve won? In this talk, we’ll look at highly practical tools and workflows to ensure that every test we run has a purpose and gives us data we can truly leverage. By the end, we will all have a shared idea of what effective performance testing looks like, as well as customised and fine-tuned tooling to ensure replicable and predictable tests.
Join us at the Middlesbrough Town Hall Fire Station & Courtyard from 5:30pm - Late. Where we'll have drinks, informal networking, games and a selection of local food vendors. Sponsored by BigBite
We're very excited to welcome some of Europe's leading figures in the world of Front End Development!
CSS Wizardry
VodafoneZiggo
Chakra
Algolia
tldraw
Opportunity Global
Take a look at what you missed out on
Join our mailing list and socials to be the first to know about the 2024 speaker lineup and receive exclusive content.
Middlesbrough Town Hall, Albert Road, Middlesbrough, TS1 2QJ
Our conference would not be possible without contributions from our amazing sponsors!
Interested in sponsoring Middlesbrough Front End Conference? Click here to learn how to get involved.