kon syrokostas (he/him) wrote Flutter code for the first time on the late 2020, where he had to navigate a world without null safety. Since then he has led the successful launch of three Flutter mobile apps and three websites that are built on Flutter Web. He is currently doing freelance work for projects in the mental health and DEI space and is a moderator in the Flutter Bloc Discord server. He is always happy to talk about inclusive software and software architecture. He firmly believes that “one more interface” can’t cause any harm. He has an integrated Master’s in computer engineering from the university of Patras.
Kon Syrokostas
Software Engineer
Creating responsive UIs and other nuances of Flutter Web
Flutter for Web is definitely less widespread than Flutter for mobile devices, but in my practice I have found it to be very powerful. Flutter Web has made reusing code between multiple platforms easier than ever and it enabled the use of a single frameworks across all the frontends of a project. This doesn't come without some nuances that developers should be aware of when building an app for the web.
In this session I will explore those nuances starting from tips on how to create a responsive UI, and then talking about web specific concepts such as SEO (or the lack of it) and dart:js. I will also touch on how to make text selectable, and on potential issues with it.
The main takeaways for the participants will be:
- How to build a Responsive UI (LayoutBuilder, Wrap, Expanded, use fixed values, basic animations for UI transitions)
- What is dart:js and what is dart:io -- how to conditionally import either of them
- What is the state of SEO in Flutter and which are some solutions for the lack of support
- Which are some issues with widgets on the web, most notably the default Text widget not being selectable