Bootstrap होता क्या है और Bootstrap का Use क्यों किया जाता है ? | Details About Bootstrap in Hindi

July 02, 2021 INFORMATION

आपका हमारी Website Technovichar में स्वागत है। आज के इस  Article में हम Bootstrap के बारेमे जानने वाले है। आखिर Bootstrap होता क्या है और Bootstrap का Use क्यों किया जाता है ? | Details About Bootstrap in Hindi। यानिकि आपको इस Article में Bootstrap के बारेमे Complete Information मिलने वाली है। तो चलिए जानते है की Bootstrap होता क्या है ?


What_is_Bootstrap_and_How_to_Use_it_in_Hindi



Article Content


Bootstrap क्या है ? (What is Bootstrap in Hindi)

Bootstrap का Use Website में कैसे करे ?

Bootstrap का Use क्यों किया जाता है ?

History of Bootstrap 

How to use Bootstrap in Website ?

Advantages of Bootstrap 

Conclusion


Bootstrap क्या है ? 

(What is Bootstrap in Hindi)



  • Bootstrap - HTML , CSS और JavaScript का एक पॉपुलर फ्रेमवर्क है। जिसका Use करके एक Mobile Friendly तथा Responsive (Suitable for All Devices) वेबसाइट बना सकते है। 


  • Bootstrap , Free और Easy to use Framework है। जिसका use करके Easy और Fast , Web Front End बना सकते है। जिसमे CSS और JavaScript की कुछ Built-in functions होते है। 



Bootstrap का Use Website में कैसे करे ?



Bootstrap की Official Website पर आपको इसकी Starter Template मिल जाएगी। 


Website : https://getbootstrap.com/




Bootstrap का Use क्यों किया जाता है ?



  • Bootstrap , Easy to use Framework है। और आपके पास HTML और CSS का थोड़ा भी Knowledge है तो इसके Code Format को आसानी से समज सकते है। 


  • Bootstrap से बनाए गए Website सभी Browser - (Google Chrome ,Safari ,Firefox , Opera) में अच्छे से Run करती है।

  • यह Website को Responsive बनाने का सबसे अच्छा Framework है। 



History of Bootstrap 



Bootstrap  को Mark Otto and Jacob Thornton द्वारा Develop किया गया था। इसे August 2011 में Github पर एक Open Source Product के रूप में Release किया था । आज कल सभी Front End Developer Bootstrap का Use करते है। 



How to use Bootstrap in Website ?



CSS of Bootstrap

<!--BootStrap CSS--> <link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" rel="stylesheet"></link>


Javascript of Bootstrap

<!--Optional JavaScript; choose one of the two!--> <!--Option 1: Bootstrap Bundle with Popper--> <script crossorigin="anonymous" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script> <!--Option 2: Separate Popper and Bootstrap JS--> <!--<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>-->


Bootstrap Starter Template 

<html lang="en"> <head> <!-- meta tags --> <meta charset="utf-8"></meta> <meta content="width=device-width, initial-scale=1" name="viewport"></meta> <!-- Bootstrap CSS --> <link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" rel="stylesheet"></link> <title>Hello, world!</title> </head> <body> <h1>Hello, world!</h1> <!-- Optional JavaScript; choose one of the two! --> <!-- Option 1: Bootstrap Bundle with Popper --> <script crossorigin="anonymous" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script> <!-- Option 2: Separate Popper and Bootstrap JS --> <!-- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script> --> </body> </html>



Advantages of Bootstrap 


  • Responsive grid 
  • Responsive images 
  • Bootstrap के Components : जैसे की Alerts , Badge , Breadcrumb , Popovers , Buttons , etc 
  • Bootstrap की JavaScript : Bootstrap , Developers को JQuery Plugins का उपयोग करने की अनुमति देता है। 
  • Community : Bootstrap की ,Designers और Developers Community बहोत बड़ी है। जिससे कोई Problem या Issue होने पर उसका आसानी से Solution Find कर सकते है।   



Conclusion




हमें उम्मीद है की आपको यह Post - Bootstrap होता क्या है और Bootstrap का Use क्यों किया जाता है ? | Details About Bootstrap in Hindi पूरी तरह से समज में आया होगा और हमें यकीन है की आपको इस Article को पढ़कर काफी जानकारी भी मिली होगी.



यदि आपको हमारा यह लेख Bootstrap होता क्या है और Bootstrap का Use क्यों किया जाता है ? | Details About Bootstrap in Hindi पसंद आया है तो आप इसे अपने दोस्तों और अपने सोशल मीडिया पर शेयर जरुर करे. जिससे वह लोग भी इस जानकारी का फायदा उठा सके और यह जान सके.


 

अगर आप Bootstrap जैसे ओर Topic के बारेमे जानना चाहते है तो Notification Allow जरूर करदे। ताकि ऐसी Information आपको Daily मिलती रहे।

Also Read This

Post a Comment

1 Comments

  1. UnknownNovember 22, 2021 at 9:21 PM

    Hello Sir.
    You have explained this very clearly and understanding way... Thank you for guiding ... If anyone wants to get the
    best bootstrap course in Delhi Then visit here...

    ReplyDelete