Bootstrap Logo

Goals


- Learn to use the Bootstrap framework

Program

Presentation of jQuery: objectives, alternatives … Use
cases, examples of sites
Specific principles and tips
The versions of jQuery
jQuery slim

Workshop: Add jQuery in a project

Essential functions and chaining
Extended CSS3 selectors Browsing
, manipulation of the DOM tree and filters
Association of events and triggering
Control of the execution context of callbacks
Animation effects
Existing functions

Workshop: Handling web pages with jQuery

Asynchronous / synchronous communication
Implementation of AJAX
jQuery functions available
Interface of Deferred and Promise objects
Loading of pages and code injection
Complete integration of AJAX and the UI
Compatibility with other frameworks

Workshop: AJAX requests and XML parsing with jQuery

Discover adaptive CSS frameworks Bootstrap
alternatives
: presentation, contributions, examples
Dependencies associated with Bootstrap: jQuery and popper.js

Workshop: Include Bootstrap in a project and basic templating

Bootstrap and Responsive Web Design (RWD)
The Bootstrap Grid
Containers and breakpoints
Class prefixes
Automatically arranged columns
Horizontal and vertical alignment
Reorder, offset and nest columns

Workshop: Using the grid in a project

Typography and links
Tables: lines, borders, rollover, RWD
Form elements, supported controls
Buttons: options, sizes, status
Avoid image overflows

Workshop: Using bootstrap classes in web pages

Manage positioning: flex, position, float and clearfix
Modify texts: alignment, truncation, weight, italics, etc.
Manage borders, shadows, margins (padding, margin)
Background and text colors

Workshop: Customizing the appearance of beacons with the utilities

The badges
The breadcrumbs
The buttons and group of buttons
The cards: title, image, link, formatting
The Forms: layout, validation, grouping
The Lists
The Media

Workshop: Integrating CSS components into a page

Discovery of JS components
Usefulness of jQuery for components
Interact using data- * attributes Component
option variables Methods
and events available

Workshop: Transmit information to components using events – Display the components using asynchronous request

Presentation of the customization of the bootstrap theme
Structure of the files of a project
Import the library into a sass file
List of existing variables
Modify the values ​​of the bootstrap variables
Manipulate the maps (addition, modification, deletion)
Create these own components using the Bootstrap functions 

Lab: Modifying bootstrap using Sass

Duration

3 days

Price

£ 1501

Audience

Web developers, integrator, Front End developer

Prerequisites

Good knowledge of HTML, CSS and javascript

Reference

SIT101067-F

Sessions

Contact us for more informations about session date