DOM stands for Document Object Model and is an abstraction of a structured text. The text is an HTML code, and the DOM is simply called the HTML DOM. Elements of HTML become nodes in the DOM. While the HTML is a text, the DOM is an in-memory representation of this text. The HTML DOM provides an interface (API) to traverse and modify the nodes. There are methods like
getElementById that can dynamically change the content of the web page. The issue with HTML DOM is that it is always tree-structured. That is usually okay, because we can…
While I was interviewing for a Junior Frontend Developer position I got asked these 10 quick-fire questions. Enjoy!
EM are relative to the immediate parents while REM is only relative to the html (root) font-size.
Let’s say we have a code like this:
Then our CSS needs to look like this:
The way this works is that absolutely positioned elements are always positioned with respect to the first relatively positioned parent element, or the window. Because we set the box’s position to relative, .box-text positions its right edge to the right edge of .box …
There are great ways to make a beautiful dropdown menu. One of them is to use react-select. But, if you would like to make your own for practice or building your own component for the project just follow along.
For the people that don’t have time to read through it all, there is a full code written down at the bottom of the page. :)
Our goal is to make a component that will take a header (this can be a title of the dropdown menu or in our case a initialized value od 300N) and list that will be…
I am sure there has been some times, when you were building React component, you wanted to conditionally apply a class. Maybe, you wanted to make a background-color of a div depending on some state, but couldn’t think of the way — here is a solution to your problem.
There are couple of ways of doing it. We will explain them on our example.
We want to have every other menu item background-color grey. It should look something like this:
In my last project I had to write a timer that you could set, start/pause and reset. It isn’t the most difficult thing to write, but there were couple of things, I initially hadn’t thought of. Let’s go step-by-step and see how to do it.
Our timer should look something like this:
There are couple of extension I really like, and are useful while coding React applications in VS Code. Let’s go straight to them.
The name says it all. This extension automatically adds HTML/XML close tag.
So, I have been living in London for the past year. As my name suggests, I come from Slavic speaking country, called Croatia. After finishing my Master’s Degree I moved to London. Living in London has been great, especially now during Covid-19 as the streets are not full of tourists and there is not much traffic. But, it was a process of getting used to it. Here are some things that struck me the most.
Everybody knows this. Also, the countries that used to be a part of the British Empire adopted the left-hand traffic such as India, Australia, South…
While learning React.js I have asked myself multiple times what is the best practice of displaying icons on my website?
If you are a web developer you know that the icons are integral part of UI design. We use them almost everywhere, from the social media icons to the hamburger menu. It is not so strange to ask yourself which set of icons to use.
Before, we just used images for icons but soon came to realize that using images creates poor performance in terms of resolution and had poor scalability. Image formats like JPEG and PNG had the dramatic…
Electrical engineer that loves robotics, fun facts and cooking!