�ݺ�ߣ

Girls Go IT — 2015
Intro to Bootstrap
Mihai Iachimovschi
@mishunika
mihai.iachimovschi@gmail.com

Intro. Bine ai venit!
- Începător;
- Ai mai scris cod (Pascal, nu?);
- Te joci cu HTML + CSS în timpul liber.

Ce-i aia Bootstrap?
“Bootstrap is the most popular HTML, CSS, and JS
framework for developing responsive, mobile ﬁrst
projects on the web.” — getbootstrap.com

Istorie.
- Original: “Twitter Bootstrap”;
- Dezvoltat în cadrul Twitter, Inc.;
- Dezvoltatori: Mark Otto și Jacob Thornton;
- Momentan proiect Open Source, v. 3.3.5;
- Versiunea 4.0 e pe cale să ﬁe lansat (vezi 4.0
alpha).

Necesitate.
- Standardizarea interfețelor sistemelor interne
în cadrul Twitter, Inc.;
- Crearea așa numitor guidelines vizuale;
- Speciﬁcarea HIG (Human Interface
Guidelines).

Istorie (cont.)
- Publicat August 2011 (exact 4 ani în urmă😜);
- Acum e în pragul lansării versiunii 4.0;
- Inițial framework cu CSS pur;
- Acum - mai mult decât doar CSS.

Conținut.
Stiluri, Elemente, Iconițe, Font-uri, Plugins ș.a.

Back to HTML & CSS.
- HTML: HyperText Markup Language;
- CSS: Cascading Style Sheets;
- JavaScript: Logică, animații .
HTML + CSS + JavaScript: Limbajele WEB.

HTML. Recap.
- <html></html>
- <head></head>
- <body></body>
- <h1></h1>
- <h2></h2>
- <p></p>

HTML. Recap.
- <img />
- <a href=“#”></a>
- <ul>, <ol>
- <input />

Bootstrap din interior.
- Stiluri pentru elementele tradiționale;
- Componente bootstrap (labels, badges…);
- JavaScript: Pune viață în elementele tale.

HTML + CSS = ?
Poți crea doar cu HTML și CSS interfețe
impunătoare.
Însă — e nașpa!

De ce bootstrap?
- Vei salva zeci de ore de coding;
- Componente simple în utilizare;
- Documentație foarte bună;
- Responsive!!!

Pachetul Bootstrap.
- CSS - bootstrap.css
- JavaScript - bootstrap.js
- Icon Fonts - glyphicons-regular.ttf

Bootstrap CDN.
CDN — Content Delivery Network
Vom utiliza www.bootstrapcdn.com

�ݺ�ߣ

Girls Go IT -- Day 6 Training 1 -- Bootstrap

More Related Content

Girls Go IT -- Day 6 Training 1 -- Bootstrap