Jifunze Bootstrap| Boostrap ni nini na wapi inatumika

BOOTSTRAP ni "FRONT-END FRAMEWORK"  inayotumika na web developers ili kutengeneza websites kwa haraka na kwa urahisi. naposema FRONTEND namaanisha "muonekano wa nje wa website". Kuna terminology 2 zinazotumika sana katika ulimwengu wa web development.Terminoloqies hizo ni FRONTEND na BACKEND. Frontend ni kama nilivyoeleza hapo awali, "Backend" linawakilisha shughuli zote zinazofanyika kwenye background (Nyuma ya pazia) ambazo wewe kama mtumiaji wa kawaida wa website hauwezi kujua (You can't notice).

kwa mfano, Unapotaka kuingia kwenye website fulani unaona fomu ambayo itakutaka uandike email yako na password yako. baada ya hapo unabonyeza button kupeleka data ulizoingiza kwenda kwenye seva (server). Endapo data ulizoingiza ni sahihi unaingizwa kwenye system bila matatizo , Kama haziko sahihi unapewa meseji kwa mfano  "Hakikisha username yako au passowrd yako ni sahihi".

Sasa haya yote yanayofanyika "nyuma ya pazia " ya kuangalia kama username yako na password yako ni sawa na data zilizokuwepo kwenye DATABASE, hii ndio tunaita BACKEND activities (shughuli za backend).

Programming languages  zinazotumika kwa ajili ya kuprogram backend ni kama vile PHP,Ruby, Java , ASP.NET na kadhalika.kwa hiyo katika mfululizo wa topic za somo hili tutasoma FRONTEND tu. Baada ya kozi hii kwisha unaweza anza kusoma BACKEND. 

Turudi kwenye ulimwengu wa bootstrap. Muonekano wa code zilizoandikwa kwa kutumia class za "bootstrap" ni kama zinavyoonekana hapa chini.

<div class="container">
  <div class="jumbotron">
    <h1>My First Bootstrap Page</h1>
    <p>Resize this responsive page to see the effect!</p> 
  </div>
  <div class="row">
    <div class="col-sm-4">
      <h3>Column 1</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
    </div>
    <div class="col-sm-4">
      <h3>Column 2</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
    </div>
    <div class="col-sm-4">
      <h3>Column 3</h3> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
    </div>
  </div>
</div>