React practice course. Build React app from scratch.

Install the latest React application with create react app via npx, using yarn or npm as needed, then launch on localhost 3000 and set up the environment.

Configure git and GitHub to save and restore project data, commit and push changes, and share your repository on GitHub to connect with version control.

Install and integrate a ready-made React autocomplete package to power an input with a dropdown of suggestions, using hooks and useState for state management.

Fetch real data from Wikipedia via REST in a React app, install and use Axios for AJAX, and manage data with useEffect and state, handling CORS and errors.

Learn to customize a React input by creating a reusable component, passing placeholder and other props, applying styles, and rendering a custom autocomplete menu with children and items.

Create a useSearch hook that manages search value with an onSearchChange handler, returning value and a change function for the search form.

Install and configure react router, import browser router as router, use switch and route to map home, search, and not-found pages, apply exact matching for the home route.

Create dedicated pages for each route by adding a pages folder with home, search, and not found components and switch to react link to prevent reloads.

Customize the home page with a logo, center-aligned layout, and a styled search input. Move assets to the public folder, apply css updates, and adjust image sizing and autocomplete.

Configure the search page to fetch data based on the query from url search params, render articles with links using search hook, and handle empty results and status-driven messages.

Discover Storybook, an open source tool for developing React components in isolation with zero configuration; test, document, and switch themes using props, mobile, and tablet views.

Fix issues with Storybook by removing node_modules and yarn logs, then reinstalling dependencies from scratch to ensure Storybook runs and launches successfully.

Create your first story in Storybook by configuring a component input with a placeholder, then move the article list to a separate component and preview the page in Storybook.

Build a search results page in storybook by passing location and search props, calling the backend with useSearch, and using mocked axios data for no data and test scenarios.

Install and configure moxios to mock requests in storybook, using contract-based data for development and testing without real data.

Explore how storybook enables mdx-based documentation from stories, with canvases and code samples that describe component usage.

Define a unified unit test convention to ensure consistent style and coverage, including 100% coverage for presentational components, 80% for containers, an overall 80% target, and a practical style guide.

Learn to create and run a unit test for a React input component, write snapshot tests with the testing library, render with props, and update snapshots as needed.

Install and configure Enzyme for React unit testing, use shallow rendering for component tests, explore mount, manage snapshots and props, and verify code coverage.

Learn to run and configure code coverage for React tests, troubleshoot coverage issues, skip stories, set thresholds, and generate text and HTML coverage reports.

Learn to unit test a container component in React by mounting with children and props, using snapshot tests, and mocking hooks like useSearch to verify search value and articles.

Test the useSearchForm hook with the React hooks testing library, verifying initial empty value and updates to data one and data two via onSearchChange.

Test the bounce hook with fake timers, rendering the hook with value and delay to verify default 500 ms, simulate rapid input, and confirm debounced values update after 510 ms.

Learn how PropTypes enables type checking in React, how to install and import the library, and how to enforce required props and string prop types with default values.

Install the latest nodejs and npm on Windows, check for existing installation with command prompt, download from nodejs.org, choose 64-bit, and verify node -v and npm -v.

Install yarn, a popular package dependency manager, on Windows using npm or the MSI installer, and choose yarn two or yarn one as needed.