Are you are a web developer who wants to build enterprise-level websites, web, and mobile applications efficiently with Bootstrap 4? If yes, this Learning Path is for you.
Sass Instead of LESS. Brand New Bootstrap Cards. New Reboot Module. Opt-in Flexbox Support.
With regard to Bootstrap, we have the above-mentioned features to our advantage.
This Learning Path starts with introducing the new features of Bootstrap 4 and its installation. Then, you will be introduced to Sass and will learn to set up your first Sass project. Also, you will be building an application called Neighborhood, which enables others to discover local businesses in a location. While building this application, you will use Sass to write all of your stylings, organizing your website into mobile responsive grids, and writing advanced components using the cards feature. Moving ahead, you will learn to create larger projects. These projects include building out the structure and design of a social media platform, comprehensive login and registration forms, and finally a music library application.
By the end of this Learning Path, you will have a strong understanding of the new features of Bootstrap 4 with hands-on experience of working with larger projects.
About the Authors
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 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.
Aaron Vanston is a front-end developer and product specialist based in Melbourne, Australia, specializing in usability and user experience design on the web. Aaron has a multidisciplinary background ranging from digital marketing to web application development. He is currently exploring his passion for web development through his own web development studio and start-ups/ web development teams within Melbourne. In the past, Aaron has developed a range of tutorials based on design and web development including various Bootstrap written tutorials.
What are some of the new features and key differences between Bootstrap 3 and 4?
How are we going to set up our development environment and what tools will we use?
How to use SaSS in our first project?
What are SaSS variables and how to do basic nesting?
What are and how we can use different SaSS options such as mixins, extends, and partials?
How to get started with the Bootstrap 4 grid system?
How to build table layouts using Bootstrap?
How to use Bootstrap 4 popovers and tooltips?
How to use Bootstrap 4 dropdowns?
How to become a better developer?
Users unfamiliar with Bootstrap won't know how to get started with the framework. This video will help lay the base for downloading and setting up Bootstrap ready for our projects.
Bootstrap’s grid system can be quite complex. Users deep-diving into Bootstrap won't understand how it works and the required syntax. Using the grid system in the context of a project will help understand how to accurately use it.
Our social platform has no place to input or view any social statuses and content. Adding a status submit input and various content blocks will solve this.
User messages don’t have a place within the current UI. We need a way to display various message data that the user may have.
We need to display both the login and registration forms/information on the same screen, but only show what the user needs to see.
Many users can access the web page; we need a way to authenticate who they are.
The user may not have an account already and thus will need a form to register.
Being new to Bootstrap, its component structure, its dependencies, and methods in which you build, users may face many issues that could troubleshoot if they knew how.
Having established a core understanding of Bootstrap, users will need a quick reference to some of the best practices to align their newly found skills.
We need to display the content for the music library in meaningful ways through content alignment and hierarchy.
The user will be able to navigate and manipulate the state of the song whilst viewing the song’s progress.
Written content can be minified by a usual icon as a visual language to provide context and display actions to the end user. We must keep in mind screen readers and accessible devices.
Without a high level of understanding, users are unable to Build Bootstrap UI without documentation or instructions.
Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.
With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.
From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.
Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.