DEV Community: Dany Tulumidis

Your IDE is not your identity

Dany Tulumidis — Sun, 22 Jun 2025 19:59:38 +0000

I love customizing my IDE. Especially when it comes to the visual appearance. I spend hours finding the right theme, customizing the keymaps, adjusting and arranging the windows so that everything looks exactly the way I want it to. The IDE is something very personal. Or at least it is for me and many others. There are also psychopaths who install the IDE and just leave everything as it is. Yes, exactly with the default color theme! That's really beyond my comprehension. But anyway, this is about something else. It's not about the IDE but about the person in front of it and what you do with it.

Its a Cult

Thinking of Neovim? You guessed right. I worked with it myself for a few months. And still do regularly but for all that is holy, it's not the only true IDE for “real” developers.

VsCode is not the best IDE (blabla its a Code eDiTor blabla) just because it is the most widely used and has 9123012390123 plugins.

NotePad++ is the best IDE.

No matter what you use, don't defend your IDE like it's your first born child and the most sacred thing you own. And above all, don't take it personally.

Productivity is not due to the IDE

A shocker! Spending 412 hours setting up and perfecting your IDE (Neovim) does not make you productive. Quite the opposite. Get to know your IDE, learn the shortcuts, learn what you can do with it. But above all, take care of THE CODE. You use the IDE for coding so use it for that and not to make it look like something out of a fucking Matrix Hacker movie.
And I know what I'm talking about, I've done it all to a certain extent. It's about the code in the IDE and not about what's around it. The feature won't be finished any faster, the bug won't disappear any faster.

Your Identity is not your IDE or vice versa

Like food, the IDE is very personal. And it's okay to take your time and find the right colors and icons. And it's even more okay to get to know your IDE properly. In fact, it should be a must. It's a tool and if you know how to use it efficiently - oh boy it's a blast.

But your IDE is not the best. Your IDE is not your favorite sports team that you defend to the death (which is just as stupid). Your IDE is special. For you. And that's perfectly okay and, up to a certain point, even healthy and right. Try yourself out. I've tried a lot of things and still do. I've tried everything from Neovim to Jetbrains. I think it's like programming languages. There's something for everyone.

AI here and everywhere

Dany Tulumidis — Sun, 15 Jun 2025 18:02:57 +0000

I understand that AI is a cool thing. It's amazing how far AI has come in the last few years. It can give you delicious recipes using only the things you have at home, help you do research, take over your homework completely or explain things to you. And programming too, of course. Oh, and pictures and videos anyway.
Every startup, every new product, every web application advertises it. AI. But do we really always need it?

Just Hype?

Everyone wants a piece of the pie and AI is a huge pie. Just like crypto was huge a few years ago, AI is now the big buzzword that everyone is talking about faster than you know what.
But is it just hype or is there more to it? No, it's not just hype.
It will and has already changed the world as we know it. But that doesn't mean that EVERYTHING needs AI.

AI simply sells well

And that already solves the mystery of why AI is used in every product, every advertisement and every application. It increases profit. But what should be much more important is whether it serves the product. Is AI being used sensibly? Does it bring added value? Using AI just for the sake of using it won't benefit anyone in the end. And I believe that the more technical the product, the better the customers know about technology and AI, the more obvious it becomes (hello Devin, you awesome software developer).

The cake is still big enough

It's already been over 3 years. ChatGPT, Claude, Gemini, AI. There are more models than Javascript frameworks. Okay, maybe not yet, but soon. There are many cool products that use AI in a really creative and creative way. And this is just the beginning. There are still countless use cases, so many creative applications of AI that you can use in your product. Maybe your product doesn't need AI. But if you want a piece of the pie, if you want to ride the hype, if you want to sell better, then use AI. But find a way to use it in a way that makes sense for you. Ask AI how you can best incorporate it into your product. That really works.
AI is cool. AI is new. AI is everywhere. Sometimes a bit overhyped. But I think one thing is pretty certain. We will never live without AI again. So it would probably be better to understand it better and how we can best use it. It's not a buzzword. It's not hype. But an opportunity.

Screw your favorite programming language

Dany Tulumidis — Sun, 08 Jun 2025 19:56:26 +0000

Okay, maybe the title is a bit harsh, but this battle between developers and their programming languages is really annoying.

“Rust is the future, it’s safe, it’s the best!11!!”
“C is the godmother of languages and still the best!”
“Haskell is the way!”
“Javascript and vibe coding trust me bro!”
“Go is easy and effective. Its just the best”

It’s just a tool. I have my favorites too, but I would never go to war for them. Use the best tool for the job. If there are several, use the one you enjoy the most.

Where does this thinking come from?

Twitter. Or X.
Okay maybe it’s a bit more complex and a bit older but holy shit social media really brings out the worst in people and it’s the same with software developers. Gatekeeping wherever possible. Everyone has THE right opinion.
On top of that, we humans love to compare things.

“Mine is better, bigger, stronger, smarter, blah blah blah”

And Tech Twitter is a very special bubble. Most of the time I love this bubble. Peaceful, interesting, focused on technology and extremely motivated to learn. But sometimes there’s this toxic “I know better” opinion and then it gets really ugly really fast.

One language to bind them all

But does it exist? The “best” language that everyone talks about? The one that is objectively better than all the others? A language that has the power to bind them all?

Of course. C.
All joking aside. C is cool and certainly one of the most important and influential languages of our time, but the best? For some things for sure, but certainly not for everything. Otherwise we wouldn’t have languages like C++, Rust or Zig that try to improve and/or replace C.

Rust!
Nope. The syntax is really an attack on my retina and before I start a major project in Rust I’d rather write Assembly. Nevertheless, it’s an important language, the Borrow Checker is a cool thing and there’s a reason for the hype.

Zig baby!
Okay, I’m biased here. I love Zig, the syntax, completely compatible with C, great build system, low level etc.
I think and hope that this language will become much more popular. But the best? Certainly not.

Go, simple and effective!
I like Go very much. It’s simple but you can still do everything with it. But I can understand people who find it boring. My first choice for any backend, especially in the web area.

I could go on like this forever, but I think you understand what I mean.

Summary

Use the language that does the job best and that you prefer to work with. But don’t idolize the language. Don’t get too attached to one language. There are many, many very good languages. It’s okay to have your favorites but at the end of the day we all like different things and everything is subjective. Except of course the fact that Javascript is a crime against humanity.

Focus on one thing

Dany Tulumidis — Sun, 01 Jun 2025 18:12:49 +0000

Time is a resource

If there's one thing I don't have enough of, it's time. And by that I mean time for all my projects, for everything that interests me, for everything I would like to learn. I love learning new things. Definitely a great skill and practically indispensable in my job as a software developer. But sometimes it's also a curse.

I always try to organize my time as well as I can. Sometimes it works more or less well.
But even if you have 5 projects and divide your time perfectly, you've also split your attention and focus into 5 parts. Nothing half and nothing whole. You jump from one project to the next and are always 50% focused on the next project. Focus? An illusion.
And although I know all this and am aware of it, I fall into this trap again and again. Because this time it must be different. But it's not.

I believe that this one thing is the reason why projects are not fulfilling, don't work or simply fall by the wayside.
Time is the most valuable resource we have. Doing one thing, and really only one thing, and concentrating all your focus, energy and attention on it. That moves you forward. Is inspiring. Brings better results. And most importantly: more fulfilling.

Do one thing deeply

Our brain can do many things, but one thing it cannot do. Multitasking. It is said that women are better at it than men. And that may be true. But it's still bad.
The ability to concentrate fully on one thing is becoming increasingly rare. In a world full of distractions, short-form content and hype, we are trained to concentrate on 100 things at once. There is endless content. You can learn anything at any time and there's a video or blog post for everything.

It is both a curse and a blessing. But this skill of doing one thing with everything you have is incredibly powerful. It may sound like a fortune cookie saying, but you really can do anything with it. It's a superpower.

There is no perfect

One trap I often fall into is the fact that I believe that if I only do one thing, I have to do it perfectly. It has to be worth it, right? Bullshit.
Of course you should always do your best, but it's always much more important to do something than not to do something because you're afraid of not doing it well enough. Perfection is the enemy of done. Very common in my profession.
Just do it.

Summary

I wrote this blog mainly for myself. Of course I hope to help others but I personally struggle with this issue every day.
I love learning new things. There are countless things I would like to learn, projects I want to do.
But trying to do everything at the same time only leads to me not getting any of it done. It's a vicious circle.

Focus on one thing. Don't split your attention and energy. Bundle them. Quality over quantity!

Care about your Craft

Dany Tulumidis — Sun, 25 May 2025 18:23:05 +0000

Software Engineering is not (only) about money

A lot of people jump into coding because they think it's a good way to make a lot of money. Either by working for big tech or by building the next $1 million app. Maybe you come from a third world country and want to support your family, and I respect that.
Maybe you just love money. I get it. And there's nothing wrong with that.
Jobs in this field pay pretty well. Often exceptionally well. But that should not be your first and only reason for becoming a software engineer. It's not about the money. Software engineering is a craft. The world moves fast and we live in a world where it's all about the end result. Not about HOW we got there. Not about how well you did it. Product above all.

Everything used to be better

Everything used to be better. Fewer problems, better and friendlier people, better music, more money etc.
Well, that's not true at all (except for the music). But some things were better in the past. And software is at the top of that list.
I think one of the biggest reasons is: Limitations.
RAM? 128 KB. Deal with it.
CPU? 2 kHz. 4 bits!

There were no shortcuts. You couldn't just throw more RAM or more power at it. You had fixed circumstances and it was about how you used them. Pokemon Red and Blue were 373 KB. Legendary games to this day, more than enough content, polished and soooo much fun. Nowadays every fooking Call of Duty update is multiple GBs!

The result is that software is getting worse and worse and has been for decades. Web development is a big pile of abstractions and Javascript is everywhere. Bugs are already considered normal. “You can fix them later anyway.”

Love your Craft

I love software engineering. I love learning new things, I love looking under the hood. To understand how things work. Valuing resources and not following the mantra “make it work somehow”.

That doesn't mean you should lose yourself in perfectionism.
But how many new programmers start every day, start with web development and don't know how a compiler works? Don't know how binary works. That would be like a craftsman not knowing how to use his hammer. You just bang away at it, maybe using the wrong side of the hammer. In the end, the nail is somehow inside. Success?

What I want to say:
Love your craft. Try to understand it. It should be the least you can do to understand what you use and create every day.

Conclusion

Hardware is getting better and better. Faster and faster. Smaller and smaller. We are at a point where hardware is getting better and better and software is getting worse and worse.

In a world where “vibe coding” is becoming more and more popular, it is all the more important that we take our craft seriously and do it with love. Our world is built on software. Make software great again!

How to Transition from Web2 to Web3

Dany Tulumidis — Sat, 14 May 2022 04:28:47 +0000

Introduction

Hello there! My name is Dany and I'm a Full Stack Web Developer and currently transitioning from Web2 to Web3. My goal is to work in Web3 Full-Time and put all my time to make the Web more decentralized.

I'm on this journey for about 4 months now and want to share my story and my tips with you. You may heard of this thing called Web3, about decentralization, Crypto, Blockchain, and NFTs. Maybe you also ask yourself “Should I get into Web3” or “How i can get into Web3”.

These are the questions I want to answer right here, right now.

It's important to note that this guide is especially for people that are already in the tech space and want to transition. For people that want to get started in tech, I will do a separate post in the future!

Agenda

Find a reason
Community is key
Learn the fundamentals
Resources
Build Projects

Find a Reason

For me, this is the most important step. If you find a reason you will never lose motivation. And you will need Motivation in a space that changes every single day. Web3 is still very early. Something you learned last week could be obsolete by now. If you lack motivation this could break you.

My motivation is decentralization. My goal is to fully decentralize our web for one simple reason. I want that the internet is run by us, the users, and not by big tech companies and the government. Platforms like YouTube, TikTok, etc. can do whatever they want with your account. One day you upload a video, the next day you are banned and your account is deleted. They can do this even without a reason. They own you and our data.

Web3 wants to change this. Web3 is a vision that the users own their data and no one is excluded. We are just at the beginning and we have many open questions, like how to prevent users to upload harmful content with a central authority. I'm optimistic that we will find a solution for this in the future because I see so many nice and talented people in this space. Web3 isn't about money or scam. It's about the user.

Community is key

This is true in every field. I think it's especially true in Web3. A few weeks before I dived into Web3 completely I started to use Twitter on a daily basis. It was one of the best decisions I made so far. I met so many nice, helpful and talented people out there! People that I call friends today.

You have to know I'm more of an introverted person but on Tech Twitter I love to engage and talk to people. I know that Twitter can be very toxic but Tech Twitter is 100% awesome. Everyone tries to help, to motivate, teach, and to spread happiness.

Although Web3 is pretty new you can already find many resources from where you can learn. It was overwhelming for me. Which one is the best? Which one suits me?

Learning Platform and a community

Then i found LearnWeb3DAO (Twitter: @LearnWeb3DAO). I can't express how happy I am to found this platform and this community.

First of all, they offer a platform where you can learn Web3, from the very beginning to very advanced topics. All on your pace.

Their website: https://www.learnweb3.io/

Right now they offer their 4 core tracks:

Freshman
Sophomore
Junior
Senior

That was exactly what I searched for. A structured learning path from the very beginning.

Each track has multiple levels where you learn the core concepts of Blockchain and they also provide nice resources for you.

On top of that, you can access their Discord Server. And that was the best thing I did while getting into Web3. At the time of writing this, we have reached over 19.000 Members. There are thousands of people that are learning Web3 and some even already working in this industry. Whenever you are stuck and have questions there will be someone who can help you.

Also, we have multiple events and community calls each month. For example last month we had an event where multiple people showed us their projects. Or we had a Giveaway Event where people can win prizes. But the most important part is the people. Believe me when I say that it's really like a family.

I can't emphasize enough how important it is to join and participate in a community.

Sure you could do everything on your own and you may succeed. But it will take longer, it will be harder and you will not have this much fun. Community is key!

Learn the fundamentals

If you are a developer and familiar with HTML, CSS, and JS you are halfway there! Web3 is not something that is completely new and will replace Web2. It's an addition. It's like Typescript and Javascript. Typescript adds nice features. In this case really amazing, world-changing features.

There are many great resources out there to learn Web Development fundamentals and more blog posts about it. We live in a world where you can learn about development just from the internet. And that for free. If there is one course I would recommend for learning Web Development from scratch it would be that:
https://www.udemy.com/course/the-complete-web-developer-zero-to-mastery/

Blockchain and Solidity

Now it's time to dive into Blockchain development. You may heard of Ethereum and it's for sure the most well-known Blockchain. And it's the one I would suggest to start with. The ecosystem is fantastic and you will find a ton of resources for it. The community is quite big and really nice.

For Ethereum, you need to learn Solidity. Even if you don't want to write Smart Contracts on your own it's really important to understand what's happening under the hood. In my opinion, the best way to learn a programming language is through coding.

https://cryptozombies.io/ is a website where you will learn basic and advanced Solidity by building a Zombie Game. How cool is that? It's really well written, easy to understand and you can practice by building a game.

Resources

There are a ton of resources you can use to learn about Web3 and get into it. I guess you can already imagine what is my number one resource. Yes! Its LearnWeb3DAO. I think I already said why it's awesome. But we have more!

Here are some great video content creators:

Patrick Collins ⇒ https://www.youtube.com/c/PatrickCollins

Smart Contract Programmer ⇒ https://www.youtube.com/channel/UCJWh7F3AFyQ_x01VKzr9eyA

Chainlink ⇒ https://www.youtube.com/c/chainlink

Dapp University ⇒ https://www.youtube.com/c/DappUniversity

Alchemy ⇒ https://www.youtube.com/c/AlchemyPlatform

Blockgeeks ⇒ https://www.youtube.com/c/BlockGeeks

EatTheBlocks ⇒ https://www.youtube.com/c/EatTheBlocks

Austin Griffith ⇒ https://www.youtube.com/channel/UC_HI2i2peo1A-STdG22GFsA

Whiteboard Crypto ⇒ https://www.youtube.com/c/WhiteboardCrypto

Nader Dabit ⇒ https://www.youtube.com/c/naderdabit

Twitter is also awesome. Especially Tech Twitter. And especially Web3 Tech Twitter!

Here are some very nice Web3 content creators you can follow. They all provide constant and good content:

Abel => Awesome content, amazing threads

Kacie => One of LearnWeb3DAO founders, working in Web3

Haardik => One of LearnWeb3DAO founders, working in Web3

Sneh => One of LearnWeb3DAO founders, working in Web3

Peter => Daily Web3 content and an amazing person

Oscar => Provides Web3 content on a daily basis and explains it very well

Balddev => I love his content, always about Web3 and how to create a better web

Nader Dabit => A legend, already working in Web3 for me a must-follow

Vitto => Super sympathetic guy, also working in Web3

Rahat => Amazing Web3 and mostly Polygon Content

Anish => Talented young developer and share his learnings

Param => Daily Web3 Content, amazing threads

Suhail => Amazing young developer, Solidity Pro

Francesco => His threads are awesome, Web3 enthusiasts and Docker Captain

Etisha => Amazing content, super sympathetic, know how to provide value

Krishna => Provides amazing Web3 content

I could list over 100 people here but for now, this should be a good starting point. And if you are active in this bubble you will connect with all the others in no time!

Build Projects

As developers, the best way to learn is to actually build projects. You will do this in the Tracks of LearnWeb3DAO but you should also build something on your own. If you go through Youtube you will find many, many tutorials where you will build NFT Marketplaces, a simple Token, NFT Collection, DAOs, etc.

In the beginning, this is excellent because you will learn a lot because the creator will explain the code and what's going on.

But don't get stuck in tutorial hell. Build things on your own.

Many people (including myself) are struggling, in the beginning, to build a project without a tutorial. That's totally normal. One tip from me would be to take tutorials and after you finished the tutorial project you extend it with your own features.

You will gain self-confidence and that will help you a lot while building something completely on your own.
You don't have to invent the wheel. Just make multiple small fun projects or maybe one bigger project that you are passionate about.

Take your time

You don't have to make a hard cut, quit your job, and jump right into Web3. Begin slowly, and engage on Twitter and Discord. Just be curious and always willing to learn new stuff. Every single day.
And this will take time. Some people can invest one hour a day, some can put in 8 hours a day.
I have a Full-Time Job and a family. I stand up very early every morning (Also at the weekends), to invest time to learn and build in Web3 and to engage with people on Twitter and Discord.
Everyone has different circumstances. Find your way, use your time wisely and you will get your foot into this industry. Sooner or later.

Summary

I hope this rough roadmap gives you the starting point to make the leap and start to explore this wonderful world of Decentralization, Blockchain, Crypto, NFTs, and co.

If only one of you now is motivated to get into Web3 I'm more than happy!
My goal is not only to develop in this space. My goal is also to help people get into this space. There are so many nice and talented people in this space. I'm sure you will be the next! Let's build a better Web. A better future. A decentralized future!

Let's connect on Twitter and learn together. I post every day about Web3 and share my learnings with you.

Don't forget to put on your biggest smile and enjoy your life!

Ceelei - A CLI tool for the CLI

Dany Tulumidis — Sun, 12 Sep 2021 10:53:05 +0000

Introduction

Hello there!
This time I wanted to share a little tool I wrote last week that helps me in my daily work and maybe it's also helpful for others, for you!

The problem

As a developer, I work inside the CLI. A lot. I really like it but how often I don't remember a specific command that I used months ago or maybe only days ago. Then I have to step out of the CLI and Google it or open my notes to search for it. This brings me out of my flow and discourages me to use the CLI sometimes.

The idea

Last week I decided to learn some Golang. A programming language that was on my To-Learn-List for a long time. Searching for a project idea is often difficult. Then I really thought about problems I can solve for myself. Making my life a bit better.
So my thoughts:

Improving my CLI workflow would be nice.
Go and developing a CLI tool matches perfectly!

Most important for me was that this project taught me the basics of Go, helps me in my daily work but isn't too big that it would cost me multiple weeks.

Ceelei

Ceelei was born. Ceelei is my little CLI tool that now helps me in my daily work as a developer.
You can add a command to your Ceelei list inside your CLI and list it at every time also inside the CLI. You don't need to leave the CLI at any time!
It's completely written in Go and Open Source.
The readme in the repository tells you everything you need to know about how to use it.
Feel free to check it out, suggest ideas, or just use it for yourself.

Conclusion

Learning a new technology or programming language is the most fun when you can solve a problem that you face in your life.
It was a lot of fun and maybe I will develop more features for it in the future.

Stay connected to me and my content on Twitter.

I love to improve myself every single day even if it's just a tiny bit!

Stay safe and healthy guys!

And as always: develop yourself!

5 useful CSS resources

Dany Tulumidis — Sun, 08 Aug 2021 08:59:54 +0000

Introduction

Hello there!
CSS is like magic and there are tons of resources out there. I want to share 5 of them that I find very useful when working with CSS and I hope you will also find value in them.

1: CSS Tricks

One of the best and well-known websites when it comes to CSS. Here you can find guides, tips and tricks and articles all around CSS. The articles are very well written and detailed.

2: CSS Minifier

The name says it all. A very simple but useful little website where you can copy your well-structured CSS code and get it minified. It also offers an API.

3: CSS Grid Cheatsheet

CSS Grid is super useful when it comes to building layouts on a website. I'm a big fan of it and prefer it over complete frameworks like Bootstrap because you have full control and it's very easy to build a layout with it. And on this website you have a lot of examples of well-known layouts that you can copy to your clipboard in one click.

4: CSS Flexbox Cheatsheet

CSS Flexbox is like a CSS Grid a tool integrated into CSS to build layouts on a website. Often you will use only one of them (preference) but they are really good if you combine them. On this website, you have an overview of the most basic and important properties with a little image next to them to see what they are doing.

5 : CSS Gradient

Gradients are very popular these days and on this website you can create it very easily with point&click and then copy the code to your clipboard.

Conclusion

I hope you will find these resources as useful as I do and they will help you in your development process.

Stay connected to me and my content on Twitter.

I love to improve myself every single day even if it's just a tiny bit!

Stay safe and healthy guys!

And as always: develop yourself!

Stress-Free Productivity

Dany Tulumidis — Sun, 01 Aug 2021 09:11:06 +0000

Introduction

Hello there!
At the moment I'm reading a book about stress-free productivity and I want to share one or two tips that are mentioned in this book. These tips are really simple but I was surprised how effective they are if you follow them.

Capture

The first thing that you have to know is this: Your brain is not a storage. This simply means you have to stop using your brain to remember everything. And this is simple as you just have to write everything down that pops into your mind. And I really mean everything. You don't have to be very specific and also you don't need to write them down as a TODO. Just write them down as generic as you want them to be. You will clarify them later.

This will clear your mind and your brain can do the things it's supposed to do: Thinking and solving problems and have new ideas.

You can do it in whatever way you like it. For example, I like to sort them into simple blocks like Personal, Flutter, Side project ABC, etc., and under these headlines, I write all things that are in my mind.

Clarify

The next step is also pretty easy. Take your captured notes and clarify what actions need to be done. This is the step where you will take the notes and form a TODO list.

This means that one point of your capture list can be one or more items on your TODO list based on how big or complicated it is. You have to consider things like if this item has to be done within a specific time range or even on a specific day. Then you can use a Calendar. Otherwise, a simple TODO list is all you need but the most important thing is:

Regardless of what Calendar you use or where you write down your captured items and TODOs: Your brain has to trust this system.

Otherwise, the whole thing is not very effective because the reason for this system is to take those things off your brain. If you trust your system your brain will have the capacity for the really important stuff in your life and your stress level will shrink enormously because if you have clarified all the things that were in your mind and know what to do with them you don't have to worry about anything.

Simple ToDo List

As I said keep it simple. Choose whatever system you are most comfortable with and trust the most. For example for time-specific things, I use the normal Calendar App from Apple as it's synchronized between all my devices.

And for all other stuff, I use Notion. Notion is really great because you can customize it to your needs and it's very user-friendly. You can take a text passage and transform it into a whole new page in two clicks. It's available on the web and on all devices and synchronizes between them. I highly recommend you test it if you don't know it yet.

Of course, you also can do take notes on paper if you like it or use any other note-taking app. As I said the important thing is your brain trust it. Everything else is up to you.

Conclusion

It's impressive how simple it can be to be more productive and simultaneously reduce your stress level dramatically because everything is captured and clarified. I hope you can take these tips and improve your life.

Stay connected to me and my content on Twitter.

I love to improve myself every single day even if it's just a tiny bit!

Stay safe and healthy guys!

And as always: develop yourself!

Understand Constraints in Flutter

Dany Tulumidis — Sun, 11 Jul 2021 13:44:37 +0000

Introduction

Hello there!

Another week, another Flutter blog post. This week I want to introduce you to constraints in Flutter. When building a UI in Flutter constraints are very important and I would bet you already met an error based on constraints (Unbounded constraints, nah sounds familiar?). I hope after this post you have a better understanding of constraints in Flutter so it will help you building awesome UI´s.

The general Rule

There is one rule about Layout in Flutter. And every Flutter developer should know and understand this early in his/her career:

Constraints go down.

Sizes go up.

Parent sets position.

The whole post here is built around these rules and is key to understand constraints in Flutter.

What are constraints?

Okay. Okay. But what are constraints?

It's actually pretty simple. A constraint is nothing more than a set of 4 doubles. A minimum and maximum height and a minimum and maximum width.

It's about the size of a widget and what are the minimum and maximum height/width. I like to compare it with a set of rules. And this analogy is even better when we come to the next important point.

The parent rules, the child wishes

In a tree of widgets, we have parent widgets. Those parent widgets give their constraints (the rules) down to their child widgets. Like we do it to our children. The parent may say that the child can have a maximum height of 100px.

And like in the real world the children have wishes and want something. In the case of Flutter, the child widgets take the constraints from their parents and based on these rules tell its parent widget which size it wants. In this example, the child cant exceed a height of 100px.

A good point to refer to the general rule I mentioned above.
Constraints go down is just that. The parents give constraints down to their children. Sizes go up is the other way around. The children widgets tell their parents which size it wants to be based on these constraints.

I made a little diagram to visualize this for a better understanding:

I marked the constraints with a red color and the sizes with a green color to really make it clear that constraints go down and the sizes go up.

Parents set position

Although the children widget can wish for a size it doesn't decide where it gets positioned on the screen. This is done by its parent. And also it's important to mention that Flutter has to look over the whole Widget tree as almost every widget (besides the root widget) also has a parent widget that must be taken into consideration.

Tight vs Loose Constraints

It may be that you come across terms like tight or loose constraints.
Actually, it's pretty straight forwarded and the Container Widget is a very good example to explain these concepts.

Tight

If a widget has tight constraints it means that the minimum width and height are equal to the maximum width and height. It's basically an exact size.
On top of that, it also means that the widget can be as big as possible. The container widget is a good example here because without a child the container is as big as it can be.

Loose

Loose constraints mean that the minimum width and height are equal to 0. The widget can be as small as it wants to be.

Box Constraints

In Flutter, widgets are getting rendered by RenderBox Objects.

There are 3 types of these RenderBox Objects:

As big as possible

Good examples here are Center or ListView.

Same size as children

Transform and Opacity widgets are mentionable here as they try to be the same size as their children's widgets.

Particular Size

Image and Text Widgets have a particular size.

Variations

As I mentioned about some widgets are special and can switch between these types. For example, the Container Widget tries to be as big as possible but if you give it a children it has a particular size.

Unbounded Constraints

Every Flutter developer knows this error. It's notorious!
But what are unbounded constraints?

Sometimes constraints are unbounded (unlimited, infinity). This means either maximum Width or maximum Heigth is equal to double.infinity.

This error then happens when the RenderBox (our Widget) wants to be as big as possible but has unbounded constraints.

Resources

I used the official Flutter documentation. It's fantastic!
If you want to read about this topic I can highly recommend Constraints and Box Constraints.

Conclusion

I hopefully made constraints in Flutter clearer for you and you have a basic understanding of what happens when you build a Layout in Flutter and how Flutter decides which Widgets have which sizes.

Stay connected to me and my content on Twitter.

I love to improve myself every single day even if it's just a tiny bit!

Stay safe and healthy guys!

And as always: develop yourself!

How Flutter renders Widgets

Dany Tulumidis — Sun, 04 Jul 2021 14:59:31 +0000

Introduction

Hello there!

On my way to master flutter widgets are key. In Flutter everything is a widget. And so it's crucial to understand how they work and how Flutter renders Widgets. It's a bit of theory but it will help you to better understand Flutter and write better, more efficient apps.

3 trees to rule them all

The number 3 is magic. And especially in Flutter.
Flutter uses 3 so-called trees. Imagine it like an ordinary tree in the forest with a treetop and leafs.

The 3 trees

For every widget, you will have 3 objects. One in each tree.

Widget tree

The first tree is called the Widget tree. This is used to configure the User Interface. There you can configure the properties of the widget and decide how it should look.

Element tree

The second tree is called the Element tree. This is used to manage and update everything. And with everything, I mean the trees and all references. In the element tree are elements and an element is a specific instance of a widget. This may sound familiar to you if you know OOP (Object Oriented Programming) where you have classes and objects where objects are just instances of a class.

Render Tree

The last missing piece is Render Object. Inside of the Render tree are render objects and this is basically what you are seeing on the screen. You don't see widgets. You see render objects.
Render objects will take care of the size, layout, and the actual painting to the screen.

How flutter renders widgets - The 3 states

There it is again. The number 3!
Flutter goes through 3 stages when rendering the widgets to the screen. Well, as we learned it's not the widgets we see on the screen. That's are the render objects. But how Flutter approaches this?

1. State: Configure

As I mentioned above the widget tree holds the widgets and in this state, it's all about the configuration of our widgets. Via an API you assign properties and values to your widgets which gets hold by the widget tree.

2. State: Life Cycle

Here the whole life cycle of the UI gets managed. Also here it determines the components that are existing in your UI hierarchy. You can imagine this state as the glue between state 1 and 3.

3. State: Paint

Here the Render tree comes into play. All relevant things about painting will be done here. It takes care of constraints, how the childrens of widgets will actually look like, how big they should be. This is where the render objects get painted on the screen.

Okay, but why 3 trees?

You may ask yourself by now "okay but why? Why Flutter not just use widgets and just one tree?".
Actually a very good question.

Its about performance

Ok, first things first.

Widgets are immutable

You cant change widgets. And this is basically why one widget tree is not enough. Just imagine you change for example a text widget. You would need a completely new widget because you can't change the exact same widget. And if you are working with Flutter you may know how often the UI can change.

This means when a widget needs a change the widget object inside the widget tree gets replaced completely and cant be updated.

And here the other 2 trees come into play.
Both the Element and the Render Tree getting updated whenever possible instead of created entirely new. And this is a massive performance boost!

Update or not to update?

And how Flutter decides if the Element and Render Object can be updated?
Let's imagine you have a Text Widget where you just change the text. The second you change it the CanUpdate Method of the Widget will check two things and if one of them is true the Render Object and Element Object gets updated instead of created entirely new objects.

Is the runtimeType (the widget type like Text, Column, Container, etc.) still the same?
Is the key the same?

In our example, the runtimeType is still Text and so it's true and the Element Object will call the updateRenderObject Method that will make sure Render Object gets updated instead of re-created.

The key is a property that you can give to almost every widget and helps Flutter identify a widget. Pretty useful especially for this purpose.

And you can test this behavior quite easily. When you run a Flutter App inside your IDE and open the Flutter DevTools you will have this view:

Here I selected a text widget and inside the red box, you see the Render Object. And this Render Object has an ID that starts with a # symbol. When you change the text for this Text Widget the ID will NOT change. Feel free to try it out!

Summary in 1 sentence

Flutter will try to re-use as many resources (objects in the trees) as possible while trying to create new objects as little as possible.

Resources

There are 2 resources I used to learn about this topic and were super helpful to understand it.
For the ones of you who are more into videos than pure text, I can highly recommend this of the official Flutter Youtube Channel:

How Flutter renders widgets

And here are some text with deep dive into the matter in the official Flutter Docs (Flutter has the best documentation I have ever seen, you can basically learn everything from there):

Rendering and Layout

Conclusion

That's it. Pretty cool and clever how Flutter renders widgets if you ask me! If you want to dive even deeper into the topic I can highly recommend the documentation link I posted above. I hope you enjoyed the read and learned something new that you can use to write even better Flutter apps!

Stay connected to me and my content on Twitter.

I love to improve myself every single day even if it's just a tiny bit!

Stay safe and healthy guys!

And as always: develop yourself!

Flutter Learning Roadmap V1

Dany Tulumidis — Sat, 26 Jun 2021 18:41:31 +0000

Introduction

Hello there!
Currently, I'm really into Flutter and I want to learn it inside out. I don't want to learn Flutter I want to be Flutter! So I thought this time a rough overview of all the topics would be nice so I have a rough structure to follow.

Flutter is not that old but already has many topics and subtopics to learn and master. Everyone knows the feeling when too much knowledge is overwhelming and you don't even begin to study or let it slip half the way. So my idea is to have a rough Roadmap at first that will evolve over time the further I get.

For all of you that are want to get into Flutter or currently getting into it, this first version of my Roadmap hopefully will help you.

Flutter Roadmap

How to read it

I don't want to make it very strict. Without thousands of arrows and lines. It should more serve as a guidance. You can read it from top to bottom where I tried to make suggestions on which topics to learn first. The topics are grouped and you can distinguish them by the colors.

Whats next

As i said above this Roadmap will evolve over time. As more I get into specific topics I will discover even more topics and subtopics. The end goal is to have a somehow perfect (at least to 99%) Roadmap for every upcoming Flutter Developer. If you have any suggestions for improvement please feel free to contribute to this Roadmap and drop a comment! I will upload it in my Github Account in the next days where I update it in the future.

When I'm finished I will announce it here.

Conclusion

Either you are an upcoming Flutter developer or interested to become one i hope you find this Roadmap and this approach to learn a topic helpful.

Stay connected to me and my content on Twitter.

I love to improve myself every single day even if it's just a tiny bit!

Stay safe and healthy guys!

And as always: develop yourself!