Book Image

Modern JavaScript Applications

By : Narayan Prusty
Book Image

Modern JavaScript Applications

By: Narayan Prusty

Overview of this book

Over the years, JavaScript has become vital to the development of a wide range of applications with different architectures. But JS moves lightning fast, and it’s easy to fall behind. Modern JavaScript Applications is designed to get you exploring the latest features of JavaScript and how they can be applied to develop high-quality applications with different architectures. Begin by creating a single page application that builds on the innovative MVC approach using AngularJS, then move forward to develop an enterprise-level application with the microservices architecture using Node to build web services. After that, shift your focus to network programming concepts as you build a real-time web application with websockets. Learn to build responsive, declarative UIs with React and Bootstrap, and see how the performance of web applications can be enhanced using Functional Reactive Programming (FRP). Along the way, explore how the power of JavaScript can be increased multi-fold with high performance techniques. By the end of the book, you’ll be a skilled JavaScript developer with a solid knowledge of the latest JavaScript techniques, tools, and architecture to build modern web apps.
Table of Contents (21 chapters)
Modern JavaScript Applications
Credits
About the Author
About the Reviewer
www.PacktPub.com
Preface
Index

Understanding the rem and em CSS units


Bootstrap 4 has switched from px to rem and em wherever possible. This is the main reason why Bootstrap 4 is not supported in IE 8 as IE 8 doesn't support the em and rem units. Bootstrap 4 switched to rem and em because they make responsive typography and component sizing easier.

If you are not familiar with the rem and em CSS units, then it's the right time to learn it.

The em unit is relative to the font size of the parent element. 1em is equal to the current font size of the parent element. 2em means two times the size of the current font. For example, if an element is displayed with a font size of 10 px, then 2em is 20 px. We can achieve responsive typography and components by just changing the parent element's font size using CSS media queries for different viewport or device width sizes.

As em sizing is nested (it depends on parent element), if you have elements with 1.5em sizing and then nest some HTML with elements that also have an em declaration...