In this tutorial, we are going to develop a complete Google Analytics Realtime Traffic Tracking tool using Analytics API. UPDATE : New tutorial is made for GA4 Realtime API : https://youthsforum.com/programming/php/google-analytics-ga4-realtime-api-using-php/ Please follow these steps to develop your own Google... Read more
In this video, we will create a Codepen like Live Code Editor for HTML, CSS and JavaScript with Live Realtime Preview. Source Code : index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Live Code Editor</title> <link rel="stylesheet"... Read more
Most of us have watched the movie Avengers : Infinity War where Thanos had killed half of the universe with just one snap. Here, in this tutorial we will be creating the same snap effect using JavaScript and CSS. Follow... Read more
In this video, we will use JavaScript to move a circle through a webpage with left, right, up and down keys from keyboard. Source Code : <style> body{ background: #2bc198; } .circle{ border-radius: 50%; background: #1f3fdc; width: 100px; height: 100px;... Read more
In this tutorial, we are going to create a rotating fan animation using HTML and CSS. Source Code index.html <html> <head> <title>Moving Fan Animation using HTML and CSS</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="fan fan-1"> <div class="core-part"> <div class="wing... Read more
In this tutorial, we are going to design a responsive news site using HTML, CSS and Bootstrap library. LIVE DEMODOWNLOAD Read more
In this tutorial, we are going to get random jokes with Joke API using PHP. Source Code : <style type="text/css"> body{ background-color: aliceblue; } .box-container{ display: flex; justify-content: center; align-items: center; height: 100vh; } .box{ background:bisque; border-radius: 15px; box-shadow: 3px... Read more
In this tutorial, we are going to design a webpage with parallax effect using HTML and CSS. Source Code : index.html <!DOCTYPE HTML> <html> <head> <title>Design Parallax Scrolling Webpage using HTML and CSS</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"> <link... Read more
In this tutorial, we are going to learn to make Breadcrumbs using HTML and CSS. A breadcrumb or breadcrumb trail is a graphical control element used as a navigational aid in user interfaces and on web pages. It allows users... Read more
An Equated Monthly Installment (EMI) is defined as “A fixed payment amount made by a borrower to a lender at a specified date each calendar month. Equated monthly installments are used to pay off both interest and principal each month,... Read more
In this tutorial, we are going to design a responsive blog list design using Bootstrap. The layout design comprises of a list of blog posts along with an image and title associated with it. The title is displayed over the... Read more
In this tutorial, we will provide a complete source code to make a website design like YouTube. We will make this webpage using HTML and CSS. Source Code index.php style.css logo.svg profile.jpeg index.php <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible"... Read more
In this tutorial, we are going to learn to create a real-time HTML, CSS, and JavaScript editor with preview in a webpage. We can easily write our code in the text area provided the output of which can be easily... Read more
