Srbija Posted November 11, 2022 Share #1 Posted November 11, 2022 Complete Bootstrap & React Bootcamp With Hands-On Projects Published 8/2022 MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz Language: English | Size: 5.90 GB | Duration: 13h 6m Learn to Build Responsive, Interactive Web Apps using Bootstrap and React. What you'll learn Learn the Bootstrap Grid System Learn to work with Bootstrap Three Column Layouts Learn to Build Bootstrap Navigation Components Learn to Style Images using Bootstrap Build Advanced, Responsive Menus using Bootstrap Build Stunning Layouts using Bootstrap Themes Learn the Foundations of React Work with JSX, and Functional Components in React Build a Calculator in React Learn the React State Hook Debug React Projects Learn to Style React Components Build a Single and Multi-Player Connect-4 Clone with AI Learn React Lifecycle Events Learn React Conditional Rendering Build a Fully Custom E-Commerce Site in React Learn the Foundations of JSON Server Work with React Router Requirements No programming experience needed. You will learn everything you need to know. Basic computer skills. Basic knowledge of HTML and CSS Description Welcome to the Complete Bootstrap and React Bootcamp. This course teaches students how to create modern, interactive web pages using the Bootstrap framework and React JavaScript library. The course starts with an introduction into Bootstrap with a focus on its reputation in the development community as the number one choice for mobile-first front-end web frameworks. Bootstrap is a well documented collection of reusable code written in HTML, CSS, and JavaScript. We start with exploring the foundations of Bootstrap, including embedding it into projects, and building out the basic Bootstrap page structure. From there we catapult into the infamous Bootstrap grid system, along with the commonly used three column web page layout. After the introductory topics, students learn to work with a number of components from typography, tables and image styling right up to wells, alerts, and buttons. As part of the course we demonstrate how to build out intricate navigation menus using dropdown, collapse, accordion, and pill menus. We will also cover form styling, carousels, modals, scrollspy and just about every other Bootstrap component that's instrumental to your journey as a front-end developer. The module concludes with a hands-on project, where students will use a Bootstrap theme to build a stunning web page from scratch.In the second section of the course, we explore React. React, also known as React JS, is a powerful JavaScript library used for building custom, interactive user interfaces using UI components. Similar to Bootstrap, React is a well documented free and open source library. The project was founded by Meta and a network of independent developers. In this section, students learn how to use the React library through a series of hands-on projects. The React section of this course starts off with a hands-on project where you'll learn how to work with functional React components, props, Callback functions, OnClick Events, and the React State hook to build a fully functional calculator. From there we will dive into project number two, where you will build a connect-4 clone. Here we will cover more intermediate concepts including passing props, destructuring, passing arguments to click events, various styling methods, and handling callbacks. You will also learn about the React key property, React lifecycle events, and conditional rendering. By the end you will have built a complete multi and single player connect-4 game board with built-in AI capabilities. In the final section of the course we further unleash the power of React by building out a complete e-commerce site with multiple product categories, a product showcase, shopping cart feature, and much more. Here, we introduce a number of integral new concepts including: JSON server, Fetch API, and installing React router. These essential building blocks will be used to render the product categories, style the product list, and configure the product details page. From there we dive into styled components, refactoring the shop layout, and exploring the concept of "context" in React. In the final stages of the project students will configure the shopping cart basket, and the checkout feature. We will also implement a product search feature, followed by in-depth exercises on validating input forms in React.As you can see this course covers a tremendous bit of ground. Best of all it features Tim Maclachlan - a renowned senior full-stack developer with over 20 years of commercial development experience. As a multi-faceted developer, Tim specializes in algorithmic, analytical and mobile development. To date, he's written hundreds of applications and worked in a number of industries from commercial aviation and military, to banking and finance. Tim has a genuine passion for teaching others how to become better coders and looks forward to interacting with his students.With that said, we hope you're just as excited about this course as we are, if so - hit that enroll button and let's get started. Overview Section 1: The Bootstrap Framework Lecture 1 Introduction to Bootstrap Lecture 2 Embedding Bootstrap Lecture 3 Bootstrap Basic Page Structure Lecture 4 Bootstrap Grid System Lecture 5 Bootstrap Three Column Layouts Lecture 6 Bootstrap Typography Lecture 7 Bootstrap Tables Lecture 8 Bootstrap Styling Images Lecture 9 Bootstrap Jumbotron Lecture 10 Bootstrap Wells Lecture 11 Bootstrap Alerts Lecture 12 Bootstrap Buttons Lecture 13 Bootstrap Button Groups Lecture 14 Bootstrap Justified Button Groups Lecture 15 Bootstrap Glyphicons Lecture 16 Bootstrap Badges and Labels Lecture 17 Bootstrap Progress Bars Lecture 18 Bootstrap Pagination Lecture 19 Bootstrap Pager Pagination Lecture 20 Bootstrap List Groups Lecture 21 Bootstrap Panels Lecture 22 Bootstrap Dropdown Menus Lecture 23 Bootstrap Collapsibles Lecture 24 Bootstrap Collapse Panel Lecture 25 Bootstrap Collapse List Group Lecture 26 Bootstrap Accordion Lecture 27 Bootstrap Tab Menus Lecture 28 Bootstrap Pill Menus Lecture 29 Bootstrap Dynamic Tabs and Pills Lecture 30 Bootstrap Navigation Bar Lecture 31 Bootstrap Collapsible Navigation Bar Lecture 32 Bootstrap Forms - Vertical and Inline Lecture 33 Bootstrap Inputs Lecture 34 Bootstrap Form Control States Lecture 35 Bootstrap Input Sizing Lecture 36 Bootstrap Carousel Lecture 37 Bootstrap Modal Lecture 38 Bootstrap Tooltip Lecture 39 Bootstrap Popover Lecture 40 Bootstrap Scrollspy Lecture 41 Bootstrap Project - Themes Intro Lecture 42 Bootstrap Project - File Overview Lecture 43 Bootstrap Project - Script Overview Lecture 44 Bootstrap Project - Script Overview Cont. Section 2: React Lecture 45 Skills Required Lecture 46 What is React? Section 3: React Project: Build a Calculator Lecture 47 Project Overview Lecture 48 Hello React Lecture 49 Tools Needed Lecture 50 Code Pen Lecture 51 Intro to JSX Lecture 52 Functional Components in React Lecture 53 Why Components? Lecture 54 Intro to Props in React Lecture 55 React Components, Props and Callbacks Lecture 56 Building the calculator visuals Lecture 57 OnClick Events in React Lecture 58 Passing Parameters in Callback Functions Lecture 59 Using React State Hook Lecture 60 Implementing the calculator - Display Lecture 61 Implementing the calculator - Operators Lecture 62 Debugging in React Lecture 63 Project Summary Section 4: React Project: Connect-4 Clone Lecture 64 Project Overview Lecture 65 Tools Needed Lecture 66 Creating the Game Board Lecture 67 Game Circle - OnClickEvent Lecture 68 Passing Props - Destructing - React Children Lecture 69 Passing Arguments to Click Events Lecture 70 Inline Styling Lecture 71 Square to Circle Component Lecture 72 Global Styling Lecture 73 Dynamic Styling Lecture 74 Dynamic Classes Lecture 75 Handling Callbacks Lecture 76 Using React State Hook (again) Lecture 77 Updating the Player Circle Lecture 78 Initializing the Game Board Lecture 79 React Key Property Lecture 80 Styling the Game Board - Header and Footer Lecture 81 Calculating the Winner Lecture 82 Displaying the Winner Lecture 83 Determining a Draw Condition Lecture 84 React Lifecycle Events Lecture 85 Initializing the Game Lecture 86 Suggesting a Move - Implementing a Computer Player Lecture 87 Smart Computer Player (Basic AI) Lecture 88 CSS Variables Lecture 89 Conditional Rendering Lecture 90 Deploy to Netlify Lecture 91 Deploy to Surge Lecture 92 Project Summary Section 5: React Project: Build an E-Commerce Site in React Lecture 93 Project Overview Lecture 94 Scaffolding the Project Lecture 95 Intro to JSON Server Lecture 96 Fetch API Lecture 97 Styling the Store Lecture 98 Rendering the Categories Lecture 99 Binding the Products Lecture 100 Refactor the Fetch API call Lecture 101 Dealing with errors in Fetch API Lecture 102 Tidy the Fetch API call Lecture 103 Styling the Product List Lecture 104 Installing React Router Lecture 105 Fixing the Key Warning Lecture 106 React Router - Detail Page Lecture 107 Fetch API - Get Product By Id Lecture 108 Product Description Lecture 109 Intro to Styled Components Lecture 110 Styled Components - Product Description Lecture 111 Dangerously Set HTML (yeah really) Lecture 112 Refactor the Categories Lecture 113 Refactor the Layout Lecture 114 Refactor the Home Page Lecture 115 Intro to Context in React Lecture 116 UseContext Hook and UseReducer Hook in React Lecture 117 Basket Layout Lecture 118 Implementing the Basket Lecture 119 Implementing Basket Icons Lecture 120 Implementing Basket Total Lecture 121 Finishing the Checkout Lecture 122 Checkout - Fixing the State Lecture 123 Implementing the Order Confirmation Lecture 124 Intro to Local Storage Lecture 125 Implementing Search Results Lecture 126 Better Searching with Debouncing Lecture 127 Validating Forms in React - Part 1 Lecture 128 Validating Forms in React - Part 2 Lecture 129 Validating Forms in React - Part 3 Lecture 130 Validating Forms in React - Part 4 Lecture 131 Project Summary Students interested in building mobile responsive websites using Bootstrap,Students interested in front-end web development,Students interested in learning React,Students interested in building UI components using React library Homepage Hidden Content Give reaction to this post to see the hidden content. Hidden Content Give reaction to this post to see the hidden content. Hidden Content Give reaction to this post to see the hidden content. Hidden Content Give reaction to this post to see the hidden content. 1 Link to comment
Recommended Posts
Please sign in to comment
You will be able to leave a comment after signing in
Sign In Now