Introduction to React

Welcome to Week 4: Introduction to React

Welcome to Week 4, where we are introducing React, a popular JavaScript library for building user interfaces. React is one of the most popular tools to build UIs (User Interfaces)

This week we will be taking a closer look at why we use React, what Single Page Applications (SPAs) are, and the benefits and drawbacks of SPAs. We'll examine alternatives to React and understand why we've chosen to use it for this course.

Next, we'll delve into the nuts and bolts of React. We'll create our first React project and explore how to build components, which are the building blocks of any React application. You'll get familiar with JSX, an extension to JavaScript that allows us to write HTML-like syntax in our JavaScript code.

We'll also cover how to style components using CSS and handle events within them. Lastly, we'll introduce the component lifecycle, a core concept in React that allows us to control what happens at each stage of a component's life in the DOM.

By the end of the week, you'll have a firm grasp of the basics of React and will apply your newfound skills to a project.

Learning Objectives

By the end of this week, you will be able to:

• Define what a Single Page Application (SPA) is and list the benefits and drawbacks of using them
• Compare React with other tools and justify why you might choose React for a project
• Set up a new React project from scratch
• Build your first React component and understand the role of components in React
• Write JSX syntax and describe how it differs from HTML
• Apply CSS styles to your React components
• Handle user interactions with events in your React components
• Understand the basics of the component lifecycle in React, and use lifecycle methods in your components
• Construct a project utilizing the React skills you've learned throughout the week.