Learning Path: Bootstrap 4 Application Development

Simpliv

Course

Online

£ 40 + VAT

The best Other Education courses

See all

See all

Description

  • Type

    Course

  • Methodology

    Online

  • Start date

    Different dates available

Create attractive websites and web applications with Bootstrap 4 frameworkIf you are creative, having designing skills, and willing to create responsive, innovative websites and applications in a modern way, explore this Learning Path and you’’ll get what you’re looking for. Bootstrap is a free and open source frontend web framework for designing websites and web applications.Packt’s Video Learning Paths are a series of individual video products put together in a logical and stepwise manner such that each video builds on the skills learned in the video before it.You will expand your creative horizon, first by designing responsive web pages, styling them to perfection in Bootstrap 3, and then seamlessly moving on to Bootstrap 4.   You’ll learn how you can use CSS classes within your HTML to bring Bootstrap 4 functionality to your project.Among other things, you will also tour the anatomy of a Bootstrap plugin, create your own custom components, and extend Bootstrap using jQuery.By the end of this Learning Path, you will have a thorough knowledge of the framework’s ins and outs, and be able to build highly customizable and optimized web interfaces. Your websites and projects of all sizes will work across multiple screens sizes perfectly with Bootstrap 4.About the AuthorsVedran CindrićVedran Cindrić has been a frontend 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. He has written some articles on Bootstrap before.Laurence Svekis
.
Laurence Svekis is a highly experienced web developer with over 18 years of web development experience

Facilities

Location

Start date

Online

Start date

Different dates availableEnrolment now open

About this course

Understand how to plan and design a responsive website
Build any website layout using Bootstrap’s flexible grid system
You will see how to create a “PACKT CMS’ application, which will have a custom CMS layout with amazing real-time features
Explore the different Bootstrap plugins and use them in your “PACKT CMS” application to get a real-time effect
Migrate smoothly From Bootstrap 3 to Bootstrap 4
See how to use Bootstrap 4 to develop multi-page websites
Master styling, navigation, and alerts, and responsive queries
Bring your web pages to life using Bootstrap jQuery plugins

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

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 4 years

Subjects

  • Web Development
  • Application Development
  • Project
  • Web
  • Layout
  • Design
  • HTML

Course programme

Building a Responsive Application with Bootstrap 18 lectures 03:10:22 Building a Responsive Application with Bootstrap - 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
v04682-video1_2.mp4 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
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
Creating Our First Table View This video will show you to create your first basic table layout for CMS and how to transform it using Bootstrap.
  • Learn how to integrate tables in custom layouts
  • Add a class “table” to the table and see the magic of Bootstrap unfold
  • Learn how to use Bootstrap styles and add interesting functionalities to the table
Tables and Bootstrap This video will teach you how to use classes to change the look and feel of a table. We will add pagination and make our page responsive.
  • Change the look and feel of the tables by tweaking Bootstrap classes
  • Add responsiveness to your tables
  • Learn how to the use the Pagination component
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 options
Working with Bootstrap JS plugins Bootstrap has over a dozen custom JS plugins and this video shows you how to bring Bootstrap component’s to life using them.
  • Learn how to use the most popular Bootstrap JS plugins
  • Hack the plugins to get more use out of them
  • Learn how to customize the look and feel of the plugins
Most Popular Third-party JS plugins This video covers the gems and must-have plugins that can make you site a joy to use.
  • Discover the newly introduced third party plugins
  • Use the custom JS plugins in our application
  • Learn to customize the look and feel of the plugins
Making Our App More Responsive Bootstrap is the most popular framework for developing responsive applications and this video shows just that.
  • Learn how to use Bootstrap for responsive design
  • Learn how to write your own responsive code
  • Optimize the responsive experience for your application
Difference between Bootstrap 3 and Bootstrap 4 This video gives you the basics of Bootstrap 4 and sets you up for migration.
  • Learn what’s new in Bootstrap 4
  • See the main differences between the two versions
  • Learn how to use Bootstrap 4 for production ready applications
Migrating Our App to Bootstrap 4 This video shows you how to upgrade from Bootstrap version 3 to version 4, emphasizing on major changes
  • Migrate your current app from Bootstrap 3 to Bootstrap 4
  • Tweak the HTML and CSS structure of your application to avoid breaking existing code
  • Learn how to run your application in Bootstrap 4
Using New Bootstrap 4 Components This videos covers the newly introduced components and how they are replaced in the application
  • Learn the newly introduced features in Bootstrap 4 Components
  • Learn how to use the Card Component in your application
  • Know the various layouts for card components
Final Steps This video summarizes the section as a whole and gives you a bag of important resources that will aid your further study in Bootstrap 4
  • Check the useful developer tools and bookmark all the important resources discussed in the video for further study.
  • See some best practices that can be useful in your future experiences with Bootstrap
Building a Responsive Application with Bootstrap. 18 lectures 03:10:22 Building a Responsive Application with Bootstrap - 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
v04682-video1_2.mp4 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
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
Creating Our First Table View This video will show you to create your first basic table layout for CMS and how to transform it using Bootstrap.
  • Learn how to integrate tables in custom layouts
  • Add a class “table” to the table and see the magic of Bootstrap unfold
  • Learn how to use Bootstrap styles and add interesting functionalities to the table
Tables and Bootstrap This video will teach you how to use classes to change the look and feel of a table. We will add pagination and make our page responsive.
  • Change the look and feel of the tables by tweaking Bootstrap classes
  • Add responsiveness to your tables
  • Learn how to the use the Pagination component
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 options
Working with Bootstrap JS plugins Bootstrap has over a dozen custom JS plugins and this video shows you how to bring Bootstrap component’s to life using them.
  • Learn how to use the most popular Bootstrap JS plugins
  • Hack the plugins to get more use out of them
  • Learn how to customize the look and feel of the plugins
Most Popular Third-party JS plugins This video covers the gems and must-have plugins that can make you site a joy to use.
  • Discover the newly introduced third party plugins
  • Use the custom JS plugins in our application
  • Learn to customize the look and feel of the plugins
Making Our App More Responsive Bootstrap is the most popular framework for developing responsive applications and this video shows just that.
  • Learn how to use Bootstrap for responsive design
  • Learn how to write your own responsive code
  • Optimize the responsive experience for your application
Difference between Bootstrap 3 and Bootstrap 4 This video gives you the basics of Bootstrap 4 and sets you up for migration.
  • Learn what’s new in Bootstrap 4
  • See the main differences between the two versions
  • Learn how to use Bootstrap 4 for production ready applications
Migrating Our App to Bootstrap 4 This video shows you how to upgrade from Bootstrap version 3 to version 4, emphasizing on major changes
  • Migrate your current app from Bootstrap 3 to Bootstrap 4
  • Tweak the HTML and CSS structure of your application to avoid breaking existing code
  • Learn how to run your application in Bootstrap 4
Using New Bootstrap 4 Components This videos covers the newly introduced components and how they are replaced in the application
  • Learn the newly introduced features in Bootstrap 4 Components
  • Learn how to use the Card Component in your application
  • Know the various layouts for card components
Final Steps This video summarizes the section as a whole and gives you a bag of important resources that will aid your further study in Bootstrap 4
  • Check the useful developer tools and bookmark all the important resources discussed in the video for further study.
  • See some best practices that can be useful in your future experiences with Bootstrap
Building a Responsive Application with Bootstrap - The Course Overview This video will offer an overview of the course. Building a Responsive Application with Bootstrap - The Course Overview This video will offer an overview of the course. Building a Responsive Application with Bootstrap - The Course Overview This video will offer an overview of the course. Building a Responsive Application with Bootstrap - 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
v04682-video1_2.mp4 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
v04682-video1_2.mp4 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
v04682-video1_2.mp4 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
v04682-video1_2.mp4 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
v04682-video1_2.mp4 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
v04682-video1_2.mp4 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 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...

    Additional information

    Familiarity with HTML, CSS, as well as creating and editing files is required

    See related categories

    Learning Path: Bootstrap 4 Application Development

    £ 40 + VAT

    The best Other Education courses

    See all

    See all