• Post category:StudyBullet-9
  • Reading time:9 mins read


Creating interactive user-interface (UI) components using HTML, CSS, and React.

What you’ll learn

  • HTML Foundations
  • The Structure of an HTML Web Page
  • HTML Body and Header Tags
  • HTML Text Formatting
  • HTML Unordered and Ordered Lists
  • Embedding Images, Video, and Media in HTML
  • Working with Tables and Nested Tables in HTML
  • Creating Web Forms with Input Fields, Select Menus, and Check Boxes
  • Working with Iframes in HTML
  • Building a Complete HTML Web Page
  • Foundations of CSS
  • Types of CSS Rules
  • Working with CSS ID and Class Selectors
  • Working with CSS Divisions (DIVs)
  • CSS Margins, Padding, Text Styling, and Backgrounds
  • CSS Display Properties, and Positioning
  • Styling Tables in CSS
  • Foundations of React
  • Introduction to React Tools for Building New Projects
  • Debugging React Projects
  • Building a Single and Multi-Player Connect-4 Clone Game with AI
  • Building a Fully Customized E-Commerce Site in React
  • Building a Fully Functional Calculator in React

Description

Welcome to the HTML, CSS, and React Certification course for beginners. In this course you will learn how to develop stylish, mobile responsive web pages right from scratch using some of the most powerful front-end mark-up languages and JavaScript libraries. The course starts with an in-depth overview of HTML where we start by exploring the structure of an HTML web page. Once you’re comfortable with HTML foundations, we move on to demonstrating how to work with a number of HTML elements. This includes: Inline text elements, ordered and unordered lists, embedding media, link creation, tables, background images, form elements and iframes. The HTML segment concludes with a hands-on project that will guide you through creating a complete web page with headers, footers, callouts, images, links, forms and tabular data. By the end of the HTML segment, you’ll be able to proficiently code simple and complex html pages with ease.

The second section of this course focuses exclusively on CSS to bring your web pages to life with custom style sheets. Here, students will learn the importance of responsive design and cross browser compatibility by embedding CSS style rules for individual page components. We start by exploring the parts, and types of CSS rules followed by an introduction into CSS Id’s and divisions. From there we move on to CSS margins, text properties, borders, transparency and text on top of images. Once you have a handle on the foundations we move on to more intricate CSS concepts including CSS positioning, CSS float properties, Link Styling, and z-indexes. Similar to the HTML section, the CSS segment concludes with a comprehensive hands-on guide to building a responsive web page, complete with CSS style definitions, element containers, navigation, and a number of other CSS page elements.


Get Instant Notification of New Courses on our Telegram channel.


Once you have a foundational understanding of HTML and CSS, we will dive into working with React, a powerful JavaScript library used for front-end UI development. The React section 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’s co-authored by 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.

Who this course is for:

  • Students interested in Building Responsive Web Pages using HTML, CSS, and React
  • Students interested in Building Stylish Web Pages using HTML, CSS, and React Library
  • Students interested in Building an E-Commerce Site using React
  • Students interested in Learning the Foundations of React through Hands-On Projects
English
language