• Post category:StudyBullet-7
  • Reading time:4 mins read


Learn to develop any website using ReactJs and Bootstrap 5

What you will learn

You will learn about Installation and Setup of local environment

You will learn everything about Bootstrap 5 and how to use different Bootstrap css classes

You will learn about ReactJs and its concepts and how to use Bootstrap 5 with ReactJs

You will learn to create a fully functional website using Bootstrap5 with ReactJs

You will learn to use Google Fonts and Font Awesome Icons

You will learn about HTML and CSS

Description

In this course, you will learn to develop any kind of website using HTML, CSS, Bootstrap 5 and ReactJs.

We will start by setting up our local development environment, first we will learn to install Visual Studio Code editor, then we will go ahead and install NodeJS runtime.

Next we will move on to creating the first react app, then we will move on to understanding how a create application work.

We will understand the folder structure of the ReactJs project and understand the ReactJs lifecycle and how different aspects works.

We will then move on to integrating Bootstrap 5, Font Awesome, Google Fonts, npm packages into our ReactJs project.


Get Instant Notification of New Courses on our Telegram channel.


We will Create a complete fully functional professional website with different sections like:

  • Navigation Bar
  • Footer
  • Hero section with Carousel and Slider
  • Featured Posts section
  • Latest Posts section
  • Call to Action section
  • Our Portfolio section
  • Contact us form
  • About us page
  • Footer section with different parts like Quick Links, Newsletter and Contact Address

We will do all this in a step by step approach by doing hands-on and using different Bootstrap 5 classes serving different purpose.

We will make sure our website is professional and responsive in different kinds of devices.

This is a beginner friendly course, you just need to have basic knowledge to get started with this course.

English
language

Content

Introduction & Setup

Installing VS Code

Creating React App with Routing using Bootstrap Font Awesome and Google Fonts

Create React App and Start Dev Server
Understanding React Project Structure & Lifecycle
Integrating Bootstrap5 Google fonts and FontAwesome
Creating 1st React Component The NavBar
Styling NavBar Component with Bootstrap5 NavBar
Customizing NavBar Menu
Creating About and Contact page
Installing npm package for react-router-dom
Adding Routing for All the components
Single Page behaviour on menu items click with NavLink

Working on About and Contact Page

Designing Aboutus Page Header Section
Designing Aboutus Page Content Section
Styling our Contact us Form with Bootstrap – part 1
Styling our Contact us Form with Bootstrap – part 2