Understand Bootstrap easily and use it with React JS
Duration: 2h 16m | Video: .MP4 1920x1080, 30 fps(r) | Audio: AAC, 48000 Hz, 2ch | Size: 905 MB
Genre: eLearning | Language: English
Do wanted to learn how modern web applications such as HubSpot, Asana are styled? Have you ever wondered how websites for Barclays Bank or HSBC handle all that design? How do they create all those components? How do they style them beautifully and professionally and on brand?
There are many styling frameworks out there, but the best that has stood the test of time is Bootstrap.
In this course, I will teach you the fundamentals of Bootstrap. How to use it to prototype and build sites and web applications fast.
Using Bootstrap SCSS, we will leverage the power of SASS to design everything on the go. Using variables and superpowered CSS.
Using React JS in a Gatsby environment you are introduced to a powerful stack. One used to create applications such as Uber, Airbnb, Facebook, Instagram, and many more.
Don't worry about installing anything on your computer. We will get set up fast using Codesandbox. An online IDE for rapid web development, then get right into coding.
This course covers the fundamentals needed to create outstanding, professional components.
It gets you up and running with the most used components, styles, and elements. Create and prototype awesome websites, web applications without spending weeks learning Bootstrap itself.
These include:
Layout and grid
Starting right from the fundamentals, We will learn how the Bootstrap grid works. we will understand the scaffolding of a website or web app, dealing with containers, rows, and columns. We will go through how to make them responsive and adjustable.
Paddings and margins
We will dive deep into creating spacing around elements. We will learn about paddings and margins and how we can use them. We will explore their use for different situations such as responsiveness.
Alignment
We will explore how to align columns horizontally and vertically. We will align columns from the row. Ss well as the individual columns themselves, for greatest flexibility.
Theme
We will explore how to brand our web application by creating a color palette. We will use that palette to create a root map. We will use that to theme different elements and backgrounds quickly. All this gives our web application a professional and branded look.
Card
We will explore the card component, as well as the components within the card. So that we can understand different layers and facets of customization. Including background colors and shadows etc.
Putting it all together
We will take everything that we've learned and put it together. We will create a simple layout to display the three benefits of our software or service.
Other stuff you will learn
Within all that will explore all sorts of stuff. This includes different buttons, borders, typography, responsive text alignment, and many more.
