1. Introduction to CSS

Anatomy of a CSS Rule

A CSS style sheet consists of rules, which targets HTML by using selectors that describe the elements on which the styles should've applied.

Rule Syntax: The rule consists of a selector follows by a block of some CSS properties contained inside the curly braces.CSS properties consist of property and a value that is separated by a colon and are delimited with semicolons. However, a value may be a single value or a collection of multiple values, depending on the property.

For example,

• The rule targets any elements with the class header & any element with this class will have a…

Solid concepts for your next frontend interview

1. What is Progressive Rendering?

Progressive rendering refers to the techniques that are used to improve web page performance, such as displaying content as quickly as possible. Web developers should always learn such methods to build web pages that are more user-friendly and compatible with slow internet connections.

For example:

• Lazy loading of images using JavaScript can be used to load images when the user scrolls down to the page.
• Using only minimum CSS scripts for the number of pages that would be rendered to the user's browser as fast as possible.

2. Explain the srcset attribute in image Tag

The srcset tag comes into action…

Build Scalable Applications With Better Code

As a developer, writing code is something we all know at our own best, but there are times when things are bigger than our expectations & Big O notation is something you should care about when you are creating algorithms that will be running huge processes in an application.

Big-O

Big-O notation is a language that is used to talk about how long an algorithm takes to run, which is also known as the time complexity, or how much memory is used by the algorithm, which is also known as the space complexity. …

OAuth is an app authorization standard that is used widely over the web for fast and seamless authorization in applications. It allows you to share access to apps and permission securely, which simplifies the hurdles of controlling app access.

OAuth and Why We Need It

OAuth stands for Open Authorization is a secure, industry-standard protocol allowing us to approve an application interaction with another without sharing the password, and other information. Instead of sharing a user password and credentials from app to app, OAuth passes the authorization between apps over HTTPS with access tokens.

For example:

1. Striped Backgrounds

There are times when developers have to add stripes as backgrounds in their application as a medium of visual design. Usually, this is done with separate images with an image editor every time changes are required, sometimes SVG is also used as an alternative, but all the methods require a separate file with unfriendly HTML & CSS syntax.

The Same Can be Achieved with CSS in a Few Simple Steps.

Gradients as Stripes

Striped backgrounds can be easily achieved with the help of gradients in CSS, you just have to deep dive into the way gradients work in CSS. …

Learn Docker in 12 minutes.

Whether you are planning to start a career in the DevOps field or have already started, if you don’t have Docker in your resume, then it’s definitely time for you to think about it, as Docker is a critical skill for anyone who is into the DevOps arena.

Before we dive in, and start exploring Docker, let’s take a look at the topics we’ll cover in this beginner’s guide.

• What is Docker?
• The Problem Docker Solves
• Advantages & Disadvantages of Using Docker
• Core Components of Docker
• Docker Terminology
• What is Docker Hub?
• Docker Editions
• Installing…

24 JavaScript array methods with examples.

1. Creating An Array

There are multiple ways to create an array in Javascript, and the most simple one is to simply assign array values to a variable.

1. Frame by Frame Animation

There are times when we need an animation that is quite difficult to achieve with raw CSS transition properties on elements.

For example, a progress indicator or a moving icon can be a difficult task to achieve with raw CSS properties. In such cases, image-based frame-by-frame animation is a perfect choice where you can achieve all types of challenging tasks flexibly.

Note: We can also use GIFs for most cases, but there are certain limitations to using GIFs. They are limited to 256 color palettes and also they can’t have alpha transparency which becomes a big problem when there are…