أفضل مكتبة أكواد css و js جاهزة (bootstrap)

سلام عليكم ورحمة الله وبركاته وبعد في إطار البرمجة تصاميم وكما يعرف أغلب مبرمجين و المصممين خاصة متخصصين في برمجيات ويب ما هو bootstrap ففي الحقيقة هو مشروع مفتوح المصدر بمعني أخر هو هو إطار العمل جاهز لإستخدام يتوفر على مكتبة مهم من أكواد css و js أطلقته شركة تويتر سنة 2011 وتكمل أهمية هده التقنية في توفير وقت و المجهود و تظمن نتائج مقنعة بتصميم جذاب حتى لو كان المبرمج لا يجيد إلا القليل من الـ html و الـ css.

طريقة تركيب bootstrap في مشروعي

طريقة سهلة جدآ كل ما عليك هو إضافة أسطر تالية داخل الوسم <head>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

ادا كنت تريد مكتبة جافا js ضف التالى فوق </body>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>

مثال حول طريقة إضافة bootstrap

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
  </body>
</html>

دورة مجانية bootstrap

فإذا كنت لا تجيد أو لا تعرف شيء عن هده التقنية فأنصحك بزيارة الموقع التالي

مشاريع مفتوحة المصدر bootstrap

وهده مجموعة من المشاريع مفتوحة المصدر قابلة لتعديل التي يقدمها الموقع مجانا متعددة إستخدمات يمكنك تجميلها من الموقع الرسمي

تحميل مشاريع bootstrap مجانا

شراء مشاريع جاهزة bootstrap

يمكنك شراء مشاريع جاهزة من الموقع الرسمي بأثمنة مناسبة في حالة ادا كانت لديك إمكانيات مالية بدهب إلى هده الصفحة

شراء مشاريع bootstrap

للمزيد من المعلومات يمكنك زيارة موقع الرسمي بإستخدام الزر التي

gobootstrap

تابعوا مدونتنا للمزيد من الشروحات وسلام عليكم

شارك Share Tweet Share Share Share

انقر هنا

محمد نجيري (mnajiri@) مشرف على مدونة ماتريال ويب تحت الرابط التالي :https://mdwab.blogspot.com/ مند 2018 و أدعوك لمتابعتي عبر حسابي على أنستغرام

8 تعليقات

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق

● أن يكون التعليق خاص بمحتوى التدوينة
● أن لا تضع أي روابط خارجية
● أي سؤال خارج محتوى التدوينة يرجى تواصل معنا
● يمكنك تعليق بإستخدام صور ✋👇