Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Articles on Trending Technologies
Technical articles with clear explanations and examples
DTH Sensor Programming
DHT11 and DHT22 sensors are digital sensors that can measure temperature and humidity. The DHT22 is more expensive but offers better accuracy and wider temperature ranges compared to DHT11. These sensors communicate with microcontrollers like ESP32 using a single−wire digital protocol. Syntax #include "DHT.h" #define DHT_PIN pin_number #define DHT_TYPE DHT11 // or DHT22 DHT sensor_object(DHT_PIN, DHT_TYPE); DHT11 Specifications Parameter DHT11 DHT22 Temperature Range 0°C to 50°C −40°C to 80°C Humidity Range 20% to 80% 0% to 100% Temperature Accuracy ±2°C ±0.5°C Humidity Accuracy ...
Read MoreHow to create an image to zoom with CSS and JavaScript?
Image zoom effects allow users to see enlarged details of an image by hovering over different areas. This is commonly used in e-commerce websites and galleries to provide better product viewing experience. Syntax The image zoom effect combines CSS positioning and JavaScript event handling − .img-zoom-container { position: relative; } .img-zoom-lens { position: absolute; border: 1px solid #d4d4d4; } .img-zoom-result { background-image: url(image.jpg); background-size: calculated-size; background-position: calculated-position; } ...
Read MoreThe Adafruit.io
Adafruit.io is a cloud-based IoT platform that enables real-time data visualization and device control through web dashboards. It provides free service with an intuitive interface for connecting IoT devices via WiFi, using authentication keys and feeds to manage data flow between devices and dashboards. In this article, we demonstrate how to connect an ESP32 microcontroller with a BMP180 sensor to an Adafruit.io dashboard for monitoring environmental data and controlling an LED remotely. Required Components ESP32 development board BMP180 sensor (temperature, pressure, altitude) Blue LED Breadboard and jumper wires Adafruit.io account Circuit Connections Connect ...
Read MoreHow to create a responsive portfolio gallery grid with CSS?
If you are a shutterbug and love photography, you would love to display it on a website for sure. For that, grids are created for the gallery that also works on different devices. The responsiveness can also be set easily using CSS Grid or Flexbox. Syntax .gallery-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; } Method 1: Using CSS Grid CSS Grid provides an efficient way to create responsive gallery layouts. The auto-fit and minmax() functions automatically adjust the number ...
Read MoreThe First IOT Program
To start learning IoT, first, it is important to learn how to make circuits using a breadboard and a microcontroller. Then it is important to control that circuit using a program. There are some simulators available to make the beginner of IoT learn both these concepts without even having the IoT devices available. However, to get real results, using the circuit components and making the actual circuit is important. In this article, using two different examples, the way to start IoT programming is given. In example 1, the Wokwi simulator is used and in example 2, the actual circuit using ...
Read MoreHow to add a border to an image with CSS?
To add a border to an image, use the border property and set it to the element. This is the shorthand property to set the border style, width, color, etc. The border style can be solid, double, dotted, etc. Syntax img { border: width style color; } Basic Border Example The following example adds a solid border to an image − img { ...
Read MoreHow to create a thumbnail image CSS?
A thumbnail image in CSS is a small, clickable preview of a larger image that typically opens the full-size version when clicked. Thumbnails are commonly used in galleries, portfolios, and product listings to save space while providing visual previews. Syntax img { width: value; height: value; border: width style color; border-radius: value; } img:hover { box-shadow: values; transform: scale(value); } Example: Basic Thumbnail with Hover Effect The following example ...
Read MoreHow to create a responsive image with CSS?
Responsive images automatically scale with the screen size, ensuring optimal display across all devices. The key CSS properties for creating responsive images are width, max-width, and height. Syntax img { max-width: 100%; height: auto; } Method 1: Using max-width Property The most common approach uses max-width: 100% to ensure the image never exceeds its container width − .responsive-img { max-width: 100%; ...
Read MoreHow Much Java is Better than C?
Java and C are two popular programming languages with different features, syntax, and applications. Java was first introduced by Sun Microsystems in 1995 and operates on the Java Virtual Machine (JVM). C is a procedural programming language developed by Dennis Ritchie at Bell Labs in 1972. Both Java and C have their pros and cons, but here we will explore how Java is better than C in various aspects. Memory Management One of the notable distinctions between Java and C is in memory management. C uses manual memory management, which requires the programmer to allocate and deallocate memory ...
Read MoreHow to create an avatar image with CSS?
The avatar image on a website is a profile image visible under the author's profile. Also visible under the team's page where details of all the team members are visible on a company's website. Let us see how to create an avatar image with HTML and CSS. Syntax .avatar { border-radius: 50%; width: value; height: value; } Method 1: Basic Circular Avatar The images are placed just like any other image using the element. A class is set for both images ...
Read More