bookmark_borderHow to get div height to auto-adjust to background size?

Problem: when we set a background image on div the div size doesn’t adjust to background image size.

Solution:

height: calc(imageRatio * 100vw);

Explanation:

First, we need to get the ratio from the background image. We simply divide one dimension by another. Then we get something like for example 66.4%

When we have image ratio we can simply calculate the height of the div by multiplying the ratio by viewport width: calc(0.664 * 100vw)

A height of a div is automatically updated when the window is resized.

See also: my answer on StackOverflow – https://stackoverflow.com/a/61990449/3775079

bookmark_borderHey Google, could you please add a .gitignore-like option to Google Drive?

Google products are awesome. Gmail, Android, and Google search engine itself. Whoever used Duckduckgo or Baidu knows how awesome Google search engine is… There’s however one thing which drives me crazy: it’s Google Drive.

In particular, the sync engine of Google Drive app. It’s far from perfect, but the worst thing is when you, as a developer, accidentally leave some node_modules inside the synced directory. Then the whole thing literally explodes. As all of the devs know node_modules directory is the heaviest object in the universe…

When Google Drive tries to sync it we can go and grab a coffee. We can grab it from the plant in South America by swimming in a canoe through the ocean, wait until it grows, pick it, bring it to the USA or Europe or wherever we live, wash the beans, burn them, design our custom coffee machine, make a coffee, and then if we’re lucky we can go back to our computer and see the sync finished.

I tried to find a solution. I found this crazy discussion for example https://superuser.com/questions/820145/google-drive-with-a-gitignore-like-option. Poor admins build some custom scripts to make symlinks to the directories which they want to exclude from syncing. Or they remove the directories before running the syncing engine.

Therefore I’d like to pray to Google itself. Please, I beg you, oh mighty – add the exclusion mechanism to the Google Drive sync app so we can exclude the directories, files, anything, just like we can simply do it with .gitignore file. I know you’re busy, I know it might take a long time, but please. It will make the world a bit better place to live. Thanks in advance, Google 🙂

bookmark_borderDevelopers, developers, developers, developers!

You are a dev. You find a job. You get a PC. It’s slow. It lacks the software which allows you to be productive. Half of the internet is blocked. You can’t choose your favorite keyboard or mouse or chair. Sounds familiar?

5S

Japan has a fascinating culture. Esthetics, order, industriousness are its strengths. One of the biggest achievements of modern Japan is its automotive industry. American car manufacturing companies, with the great Detroit and Ford’s assembly line, have been one of the landmarks of USA industrial power. These enterprises had decades of experience, America won the war but despite this in the 80s Japanese took over the automotive industry. Toyota production system became famous and the whole world looked at Japanese organizational techniques to find inspiration.

One of the elements of Japanese culture in this field is 5S. Long story short, it’s the organization of a workplace where:

  • useless tools and items are removed
  • unnecessary move and effort of workers is minimized
  • workplaces are kept tidy and organized

Implementing these principles helps to create a safe and effective workplace. It improves the efficiency of a whole company without putting a strain on workers.

Alcoa

Alcoa is one of the biggest aluminum producers in the world. Charles Duhigg in his famous book, the Power of Habit, described an interesting story about the company. Once upon a time, the new CEO has been nominated. His name was Paul O’Neill. He shocked stakeholders on his inauguration speech because instead of describing his plan to increase effectiveness, profit, and reduce cost, he gave a talk about increasing workplace safety.

 O’Neill managed Alcoa from 1987 to 1999. During that time period, the market capitalization skyrocketed from 3 to 27 billion USD, while net income went up from 200 million to almost 1.5 billion USD.

Was it money saved on industrial accidents?

Obviously not. The money was wasted because of bad organization. Workplaces have been badly organized, they posed risk for workers, reporting the problems was far from perfect and the whole organization suffered. O’Neill has introduced the pressure for improvement of the production process. Workplace safety was metrics of perfection. As we can see from the results – it was a proper one.

The workplace of software engineer

Software development and IT industries obsessed with optimization. New frameworks which allows us to work faster. New processors, more RAM, more storage. Faster algorithms. CPUs generating more FPS. We continuously believe that we can make anything better, quicker, cheaper and more efficient.

A software engineer, when confronted with the job, tries to optimize it. If the tasks are repeatable, a developer will try to automate it. If something takes too long, the engineer will figure out how to do it quicker, using a different approach.

What then can be more annoying and demotivating for a developer than the situation where something slows him down and he can’t get rid of it!

The amount of these obstacles is surprisingly substantial in most corporate workplaces. Let me give you a few examples:

  • our development workstation has too less memory / too slow processor / too small hard drive
  • the internet connection is slow (for example due to proxy)
  • antivirus software dramatically slows down our computer
  • company policy blocks some pages (for example youtube, where we can find a tutorial to solve the technical issue)
  • granting access rights takes ages (for example, to perform some task we need access to system X, but it must be accepted by three managers, which takes three weeks and blocks our)
  • the company does not buy some tools or does it very slowly (for example we need a new testing tool in a week when we start the project, but we can order only during next fiscal year starting next few months)
  • repairing broken hardware takes very long (personally I waited two weeks until my workstation has been fixed)

I remember one manager in a big company wondering how it’s possible that startups are more efficient while they have smaller budgets so theoretically they should have worse engineers. My experience tells me the reason is the corporate inertia, when all the procedures mentioned above slow down everything sometimes to gargantuan extent.

Flow

Except for technical aspects, we need to remember also about the ergonomics of the developer’s workplace. Many companies buy the same chairs, keyboards, desks, monitors, and other gear for all employees. It’s understandable and usually, these things are of good quality. However, there always be some amount of people – some unusually short, others obese, tall or sensitive – who will suffer from these default solutions. They will have headaches, sore eyes, the pain of their wrists. You can be sure they will have a problem doing the most important thing in the work of the developer – to focus.

The software engineer, who doesn’t focus, burns company money. Getting the flow is not as easy as going to the office every day. Talkative colleagues, lots of meetings interrupting our focus during the day, uncomfortable chair – all of this can ruin our flow.

Developer eXperience

User experience became big thing. Every company knows now how important UX is and almost all enterprises producing software have UX experts in their teams.

Analogically we should adopt the idea of developer experience, DX. The lower developer experience in the company and project, the more money will be burned, the staff turnover will be greater and the team’s output will be minuscule. On the other hand – awesome developer experience will bring us great experts at a lower price, will give us a productivity boost and we will not need to constantly recruit new team members because old ones decided to quit.

Last but not least, let’s remember – Microsoft always cared about developers 🙂

bookmark_borderHow to update feature branch from master in Git

If you want to update your git feature branch with the new changes from the master branch, you need to:

  1. Update master branch
  2. Merge or rebase the new changes

TL;DR: merging creates additional commit, rebasing rewrites history. Usually the team chooses the way to handle conflicts in repository so ask your colleagues first what your team approach is.

To merge

git checkout master
git pull
git checkout target_feature_branch
git merge master

To rebase

git pull --rebase origin target_feature_branch 
fix conflict and then → git add . 
git rebase --continue 
git push -f