Building a Responsive Application with Bootstrap

Simpliv

Course

Online

£ 15 VAT inc.

The best Other Education courses

See all

See all

Description

  • Type

    Course

  • Methodology

    Online

  • Start date

    Different dates available

Create stunning web pages with intricate designs for mobiles and the web using BootstrapBootstrap discards the myth of “the creative type” and enforces the belief that even you are capable of design. It is easy to learn, open source, customizable, and coupled with an incredible support from the community; in short it is truly worth your time! This course walks you through the fascinating arena of web development, giving you a grid-based framework that’s easy to work on and saves the time that goes into CSS framework development.You will see how to create a “PACKT CMS’ application, which will have a custom CMS layout with amazing real-time features. This will enable PACKT to create new courses, and users to view all the data in an advanced table format and get a dashboard overview of all the courses, views, subscriptions, and so on.We'll start with a dedicated video that explains the intricacies of the different components in our application, including hacks and gotchas to master bootstrap code. We will spice up our application by using Bootstrap JavaScript plugins such as modals, tooltips, popovers, alerts, and tabs. We will also use third-party JavaScript plugins for various elements you’ll be relying on day to day.You'll find out how to migrate your existing application to Bootstrap 4 seamlessly. You'll add the newly introduced components from Bootstrap 4 in your current application and see what’s changed from Bootstrap 3. This course takes you from zero to hero, leaving you with the know-how required to build your own real-world project.About The Author
.
Vedran Cindrić has been a front-end developer for around 15 years now and has been using Bootstrap exclusively for the last 4 years. He has run a web development company called Flip.hr for 5 years now, and he has worked on a lot of interesting projects for clients all around the world. He really enjoys writing great code, optimizing websites, and creating awesome responsive experiences

Facilities

Location

Start date

Online

Start date

Different dates availableEnrolment now open

About this course

Build any website layout using Bootstrap’s flexible grid system
Explore the different Bootstrap plugins and use them in your “PACKT CMS” application to get a real-time effect
Design efficient forms and style them to perfection, creating a lasting effect on your users
Understand the intricacies of creating a dashboard page and create your own rather than using pre-built templates
Work with tables in depth, from styling to making them responsive and using third-party plugins such as DataTables for advanced interaction control
Make your application responsive by learning the general principles of responsiveness and reflecting them in your design
See what’s changed from Bootstrap 3 and migrate your existing application to the current version
Explore the newly introduced components in Bootstrap 4 and implement them in your current project

Questions & Answers

Add your question

Our advisors and other users will be able to reply to you

Who would you like to address this question to?

Fill in your details to get a reply

We will only publish your name and question

Emagister S.L. (data controller) will process your data to carry out promotional activities (via email and/or phone), publish reviews, or manage incidents. You can learn about your rights and manage your preferences in the privacy policy.

Reviews

This centre's achievements

2021

All courses are up to date

The average rating is higher than 3.7

More than 50 reviews in the last 12 months

This centre has featured on Emagister for 6 years

Subjects

  • Web Development
  • Systems
  • Project
  • Web
  • Layout
  • Design
  • Javascript
  • HTML
  • Javascript training

Course programme

Getting Started with Bootstrap 5 lectures 38:57 The Course Overview This video will offer an overview of the course. Setting Up Our Project This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
Creating a Login Page This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
Working with Forms in Bootstrap This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
Designing Efficient Forms This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
Getting Started with Bootstrap 5 lectures 38:57 The Course Overview This video will offer an overview of the course. Setting Up Our Project This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
Creating a Login Page This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
Working with Forms in Bootstrap This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
Designing Efficient Forms This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
The Course Overview This video will offer an overview of the course. The Course Overview This video will offer an overview of the course. The Course Overview This video will offer an overview of the course. The Course Overview This video will offer an overview of the course. This video will offer an overview of the course. This video will offer an overview of the course. Setting Up Our Project This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
Setting Up Our Project This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
Setting Up Our Project This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
Setting Up Our Project This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
This video will show how to configure your project properly.
  • Download a custom version of bootstrap
  • Create the proper folder and file structure
  • We include Bootstrap files in our project and create a boilerplate HTML
Creating a Login Page This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
Creating a Login Page This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
Creating a Login Page This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
Creating a Login Page This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
This video will show how to create our first page—the login page.
  • Create a custom container for your page
  • Create your page and form elements in HTML
  • Transform your form using Bootstrap
Working with Forms in Bootstrap This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
Working with Forms in Bootstrap This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
Working with Forms in Bootstrap This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
Working with Forms in Bootstrap This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
This will show how to use Bootstrap forms.
  • Use various Bootstrap form layouts
  • Use Bootstrap form helper classes
  • Mix Bootstrap form layouts and Bootstrap grid layouts
Designing Efficient Forms This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
Designing Efficient Forms This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
Designing Efficient Forms This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
Designing Efficient Forms This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
This video will show how to use forms and Bootstrap forms to provide a better user and form experience.
  • Learn some bad form practices
  • Learn how to make your form better and more efficient
  • Get some suggestions for developing good UI for forms
Layout Basics 3 lectures 27:41 Building Layouts with Bootstrap This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
Custom Layouts and Bootstrap This video will show you how to use the custom width layouts with Bootstrap and how to hack the Bootstrap grid.
  • Create two new selectors and apply padding on both the left and the right. Use max width in a custom container class to make it responsive.
  • Learn responsive design through the example of a web page with the sidebar area and content area
  • Use popular jQuery and JavaScript plugins with Bootstrap layouts
Creating a Dashboard Page In this video, we will be creating our dashboard page using the techniques learned so far.
  • We create a custom layout for our CMS interface
  • We use different Bootstrap components covered in earlier sections in our CMS
  • We create a responsive base for our layout
Layout Basics. 3 lectures 27:41 Building Layouts with Bootstrap This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
Custom Layouts and Bootstrap This video will show you how to use the custom width layouts with Bootstrap and how to hack the Bootstrap grid.
  • Create two new selectors and apply padding on both the left and the right. Use max width in a custom container class to make it responsive.
  • Learn responsive design through the example of a web page with the sidebar area and content area
  • Use popular jQuery and JavaScript plugins with Bootstrap layouts
Creating a Dashboard Page In this video, we will be creating our dashboard page using the techniques learned so far.
  • We create a custom layout for our CMS interface
  • We use different Bootstrap components covered in earlier sections in our CMS
  • We create a responsive base for our layout
Building Layouts with Bootstrap This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
Building Layouts with Bootstrap This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
Building Layouts with Bootstrap This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
Building Layouts with Bootstrap This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips.
  • Create a simple grid from Bootstrap and make it responsive for mobiles and tablets
  • We add a background color to our page and use container fluid so that the rows and columns use 100% of the screen space
  • We build layouts with Bootstrap for our page using some interesting tricks and tips
This video will show you the different Bootstrap grid systems. It will also show you how to build a Bootstrap layout using some tricks and tips les plugin with Bootstrap tables
  • Learn how to customize the default DataTables options
    • Advanced Tables The video will show you how to use DataTables and how to apply it to the existing table and customize it.
    • Learn how to use DataTables plugin with Bootstrap tables
    • Learn how to customize the default DataTables...

    Additional information

    This course is also for developers looking to upgrade their existing application to Bootstrap 4

    See related categories

    Building a Responsive Application with Bootstrap

    £ 15 VAT inc.

    The best Other Education courses

    See all

    See all