{"currentChapter":{"id":"pref","sections":[{"id":"preflvl1sec01","contentType":"text","title":"Preface","content":"

Preface

We have come a long way from the first websites that were dull and full of text. While they served their purpose back then, today, websites need to be more dynamic and interactive. In addition to fulfilling their purpose, they must also look aesthetically appeasing.

Websites are primarily designed in HTML and CSS, with HTML being used for the structure and CSS helping with the design and the look-and-feel of the website. Having to code every inch of a website can often be a tedious task, which is why there are templates or frameworks that can be modified to get the desired layout of the website.

Bootstrap is this, and so much more! Bootstrap is a framework that provides a template or a layout that can be used as is or can be modified. It allows you to add items such as jumbotrons, lightboxes, sticky menus, and so much more without have to write the tedious coding that's behind it.

Bootstrap 4, the latest version, is a complete rewrite of the older versions. It offers more support and makes it easier to integrate the framework into your website design. It now comes with features such as switching from LESS to Sass, added support for Flexbox, and dropped support for IE8, IE9, and iOS 6. It has also increased the global font size to 16 px, switched from pixels to root ems, and have even rewritten all the components and jQuery plugins.

This version of Bootstrap requires learning things from scratch, and this is exactly what we are offering. We have designed this book to simplify getting your hands on Bootstrap and actually learn using an example-based approach.

In this book, you will get down to the nitty-gritty of Bootstrap 4 by actually building projects in Bootstrap from the ground up. Using five projects, you will learn the different components and features, all the while learning exactly how to put it into use.

The book has been designed in a manner that will help breakdown Bootstrap for you, and won't talk over your head. So, if you have zero experience with Bootstrap, this book has got your covered.

","url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref","metaDescription":"","titleSlug":"preface"},{"id":"preflvl1sec02","contentType":"text","title":"Who this book is for","content":"

Who this book is for

If you are a web developer who wants to build real-world responsive website from scratch using Bootstrap 4, then this book is for you. Basic knowledge of HTML and CSS is required.

","url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref/preflvl1sec02/who-this-book-is-for","metaDescription":"","titleSlug":"who-this-book-is-for","sectionIndex":2},{"id":"preflvl1sec03","contentType":"text","title":"What this book covers","content":"

What this book covers

Chapter 1, Introduction, starts the book off with an introduction to Bootstrap.

Chapter 2, Bootstrap 4 Features, introduces you to all the new features that Bootstrap 4 offers. You will learn how to set up the environment before you start building your projects.

Chapter 3, Photosharing Website, helps you create multiple pages with different layouts. You will be introduced to Font Awesome and media breakpoints.

Chapter 4, Building a Resume Website, teaches you how to create a sophisticated resume site where you will be using the Bootstrap grid system to create layouts for your different sections, such as about me, contact information, education, experience, skills, services, and recent projects.

Chapter 5, Social Network Frontend, covers a number of different features, such as creating bubble comments, adding photos, and creating groups. You will also learn how to add a sidebar to the website.

Chapter 6, Agency Website, helps you build a one-page Bootstrap website where you will have a navigation menu and a jumbotron. You will also learn some JavaScript animation to achieve a smooth scrolling effect.

Chapter 7, Lightbox Website, uses the lightbox plugin to create a gallery of photos with two different layout. You will also learn how to create a carousel, which is basically a image slideshow.

","url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref/preflvl1sec03/what-this-book-covers","metaDescription":"","titleSlug":"what-this-book-covers"},{"id":"preflvl1sec04","contentType":"text","title":"To get the most out of this book","content":"

To get the most out of this book

For this book, you will need Visual Studio Code to write our HTML, CSS, and JavaScript codes. You can use any browser (Chrome, Safari, or Firefox) to see the results of the website that you are building. Basic knowledge of HTML and CSS is required.

Download the example code files

You can download the example code files for this book from your account at www.packtpub.com. If you purchased this book elsewhere, you can visit www.packtpub.com/support and register to have the files emailed directly to you.

You can download the code files by following these steps:

Log in or register at www.packtpub.com.
Select the SUPPORT tab.
Click on Code Downloads & Errata.
Enter the name of the book in the Search box and follow the onscreen instructions.

Once the file is downloaded, please make sure that you unzip or extract the folder using the latest version of:

WinRAR/7-Zip for Windows
Zipeg/iZip/UnRarX for Mac
7-Zip/PeaZip for Linux

The code bundle for the book is also hosted on GitHub at https://github.com/PacktPublishing/Learning-Bootstrap-4-by-Building-Projects. In case there's an update to the code, it will be updated on the existing GitHub repository.

We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Download the color images

We also provide a PDF file that has color images of the screenshots/diagrams used in this book. You can download it here: https://www.packtpub.com/sites/default/files/downloads/LearningBootstrap4byBuildingProjects_ColorImages.pdf.

Conventions used

There are a number of text conventions used throughout this book.

CodeInText: Indicates code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles. Here is an example: "What they're doing here is creating a variable called $font-stack and assigning it the values Helvetica and sans-serif."

A block of code is set as follows:

$font-stack: Helvetica, sans-serif;
$primary-color: #333;

body {
 font: 100% $font-stack;
 color: $primary-color;
}

Any command-line input or output is written as follows:

 npm install jquery

Bold: Indicates a new term, an important word, or words that you see onscreen. For example, words in menus or dialog boxes appear in the text like this. Here is an example: "We will go ahead and open the terminal, and now, let's go to the Menu, then View, and click on Integrated Terminal."

Warnings or important notes appear like this.

Tips and tricks appear like this.

","url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref/preflvl1sec04/to-get-the-most-out-of-this-book","metaDescription":"","titleSlug":"to-get-the-most-out-of-this-book"},{"id":"preflvl1sec05","contentType":"text","title":"Get in touch","content":"

Get in touch

Feedback from our readers is always welcome.

General feedback: Email feedback@packtpub.com and mention the book title in the subject of your message. If you have questions about any aspect of this book, please email us at questions@packtpub.com.

Errata: Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you have found a mistake in this book, we would be grateful if you would report this to us. Please visit www.packtpub.com/submit-errata, selecting your book, clicking on the Errata Submission Form link, and entering the details.

Piracy: If you come across any illegal copies of our works in any form on the Internet, we would be grateful if you would provide us with the location address or website name. Please contact us at copyright@packtpub.com with a link to the material.

If you are interested in becoming an author: If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, please visit authors.packtpub.com.

Reviews

Please leave a review. Once you have read and used this book, why not leave a review on the site that you purchased it from? Potential readers can then see and use your unbiased opinion to make purchase decisions, we at Packt can understand what you think about our products, and our authors can see your feedback on their book. Thank you!

For more information about Packt, please visit packtpub.com.

","url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref/preflvl1sec05/get-in-touch","metaDescription":"","titleSlug":"get-in-touch"}],"title":"Preface","sampleChapter":false,"isPreface":true},"currentSection":{"id":"preflvl1sec02","contentType":"text","title":"Who this book is for","content":"

Who this book is for

If you are a web developer who wants to build real-world responsive website from scratch using Bootstrap 4, then this book is for you. Basic knowledge of HTML and CSS is required.

","url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref/preflvl1sec02/who-this-book-is-for","metaDescription":"","titleSlug":"who-this-book-is-for","sectionIndex":2},"isLastSection":false,"currentChapIndex":null,"isPreface":true,"prevChapter":{"url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref"},"nextChapter":{"url":"https://subscription.packtpub.com/book/web-development/9781789343250/pref/preflvl1sec03/what-this-book-covers"}}

Learning Bootstrap 4 by Building Projects

Learning Bootstrap 4 by Building Projects

Overview of this book

Related Content you might be interested in

Current Title:

Learning Bootstrap 4 by Building Projects

Mastering Bootstrap 4.

Practical Web Design

Bootstrap 4 Cookbook