API in Hindi | Create Project using API in Website in Hindi 2019
Welcome all to API in Hindi. How to use API and Create a Mini Project using API in javascript with Source code. How API works in Hindi. An API (Application Programming Interface) is a software-to-software interface that enables two applications to exchange data among each other. Though this might sound a little boring, they are used a lot in the real world to create some amazing applications.
Index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Luckiest+Guy" rel="stylesheet">
</head>
<body>
<section>
<h1>WHAT DOES YOUR NAME SAY ABOUT YOUR PERSONALITY?</h1>
<p> DONATION FOR SUPPORT: PhonePay = vinodbahadur@ybl GooglePay: vbthapa55@oksbi
Believe me all this money will be used to make more quality videos and to make my channel grow. So that I can always provide you awesome free videos :) </p>
<div class="centerDiv">
<div class="details">
<label>ENTER YOUR NAME</label><br>
<input type="text" name="" id="nameid">
</div>
<div class="imgdiv">
<img src="img.png" width="200" height="200" class="imgchange">
</div>
<button> Click Me</button>
</div>
</section>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('button').click(function(){
const name = $('#nameid').val();
alert(name);
$('.imgchange').attr('src',`https://joeschmoe.io/api/v1/${name}`);
const b = $('.imgchange');
console.log(b);
});
});
</script>
</body>
</html>
CSS Files
*{padding: 0; margin: 0; box-sizing: border-box; font-family: 'Luckiest Guy', cursive;}
section{width: 100%; height: 100vh; display: flex; justify-content: center; flex-direction: column; align-items: center; background: #2ed573}
section h1{ text-shadow: 2px 5px 5px #2f3542; word-spacing: 10px; margin-bottom: 15px;
font-size:2.5rem; text-transform: uppercase; letter-spacing: 2px; color: white;}
.centerDiv{ width: 60%; height: 450px; box-shadow:2px 2px 2px 5px white; display: flex;
flex-direction: column; align-items: center; justify-content: center; background: #57606f; color: white;}
.details{ text-align: center; text-transform: uppercase; }
.details label{font-size: 1.4rem;}
.details input { padding: 10px; background-color: #ff6b81; color: white; text-align: center;}
.details input[type=text]:focus {
border: 3px solid #555;
}
.imgdiv {margin: 30px 0;}
button {
background: #3498db;
width: 180px;
padding: 4px 0;
border-radius: 3px;
color:white;
font-size: 1.2rem;
letter-spacing: 2px;
background-color: darken(#f1c40f, 20%);
}
button:hover {
cursor: pointer;
}
hlw sir,
ReplyDeleteI want to tell you i have crete a website for bootstrapped on local drive in my computer file but how to show on google page.
please sir tell me solution.
bro host on 000 web host i know it if need any help so tell me
DeleteThe effectiveness of IEEE Project Domains depends very much on the situation in which they are applied. In order to further improve IEEE Final Year Project Domains practices we need to explicitly describe and utilise our knowledge about software domains of software engineering Final Year Project Domains for CSE technologies. This paper suggests a modelling formalism for supporting systematic reuse of software engineering technologies during planning of software projects and improvement programmes in Final Year Projects for CSE.
DeleteSoftware management seeks for decision support to identify technologies like JavaScript that meet best the goals and characteristics of a software project or improvement programme. JavaScript Training in Chennai Accessible experiences and repositories that effectively guide that technology selection are still lacking.
Aim of technology domain analysis is to describe the class of context situations (e.g., kinds of JavaScript software projects) in which a software engineering technology JavaScript Training in Chennai can be applied successfully
The Angular Training covers a wide range of topics including Components, Angular Directives, Angular Services, Pipes, security fundamentals, Routing, and Angular programmability. The new Angular TRaining will lay the foundation you need to specialise in Single Page Application developer. Angular Training
hello dear sir
ReplyDeletepls make a project on sending sms using api of http://customer.bulksmsplans.com/
Gg
Deletenice
ReplyDeletehello dear sir
ReplyDeletepls make a project on sending sms using html css api php
sir i need a tutorial to travel book website .. how to integrate a hotek booking api , flight booking api to website using php
ReplyDeletehttps://kyafi.com
ReplyDeleteThanks for such a pleasant post. This post loaded with lots of useful information. Keep it up. If you are looking for the best information and suggestions related to Google Search Api then visit SERP House.
ReplyDelete
ReplyDeleteThanks for taking the time to share this information here. This is very informative and nicely described. If anyone looking for the Google Search Api, Visit SERP House.
hello sir mujhe cricket live ka source code chaiye
ReplyDeletewell
ReplyDeletesir how can i make cloud mining site
ReplyDeleteSir please ek video aisi banayeye jisme html css javascipt php mysql sbki help se ek complete project bana ho. Mai new hu mjhe starting se pura sikhna h kaise hota h please help me
ReplyDeletePlease sir help me mjhe sbke bare m theory pta h bt implement krna ni aata full project banayeye jisme sb kch starting se btaya ho html css js mysql and php
ReplyDeletegreate sir
ReplyDeletethis code doesnt work
ReplyDeletei also
DeleteDoing a good job .
ReplyDeleteGod bless you.
Thanks
what is the use of api.html?
ReplyDelete