Wireframing an application before jumping to coding process

Usually, software engineers not making wireframes or things like that, but because we are doing Full Stack and Business development, we have to have some kind of functionality overview about what we are actually building. This is now about having a full design, it is more about making the UX workflow and understand better the application parts that we are going to develop. In this video, we are using the Balsamiq mockup tool for creating our TimeBlocker desktop application's initial Wireframe. It will help us to understand what we need in order to make an Electron.js application, because sometimes when there is no planning, the actual coding process going to be less intuitive and we obviously can't produce clean code! The target is to make an Electron application in TypeScript + React which will block access to specific websites during work periods in the Pomodoro principle.