ReasonJun

React : Concept 본문

Frontend/React

React : Concept

ReasonJun 2023. 6. 10. 22:40
728x90
  1. Component-Based Architecture: React follows a component-based architecture, where the UI is divided into reusable components. Components are encapsulated, self-contained units that manage their state and handle rendering. This modular approach makes it easier to build and maintain complex UIs.
  2. Virtual DOM: React uses a virtual DOM (Document Object Model) to efficiently update and render UI components. The virtual DOM is a lightweight representation of the actual DOM, and React uses it to perform efficient updates by comparing the virtual DOM with the real DOM and applying the necessary changes only.
  3. Declarative Syntax: React utilizes a declarative syntax, where you describe how the UI should look based on its current state. Instead of manually manipulating the DOM, you define the desired UI structure using JSX (a syntax extension for JavaScript) and React takes care of updating the UI accordingly.
  4. JSX: JSX is a syntax extension that allows you to write HTML-like code within JavaScript. It enables you to define the structure and appearance of your components in a more intuitive way. JSX is transpiled into regular JavaScript by tools like Babel.
  5. Component Lifecycle: React components have lifecycle methods that are called at different stages of a component's life, such as mounting, updating, and unmounting. These methods allow you to perform tasks like initializing state, fetching data, or performing cleanup operations.
  6. State and Props: React components can have two types of data: state and props. State represents the internal data of a component that can change over time. Props (short for properties) are inputs passed to a component from its parent component. Both state and props are used to determine the rendered output of a component.
  7. React Hooks: React Hooks are a feature introduced in React 16.8 that allows you to use state and other React features in functional components. Hooks provide a way to reuse stateful logic and eliminate the need for class components in many cases.
  8. React Router: React Router is a popular routing library for React applications. It allows you to handle navigation and routing within your application, enabling you to create multiple pages and manage URL changes.

React has a vast ecosystem with various libraries and tools that enhance its capabilities and make development more efficient. Some notable libraries and tools in the React ecosystem include Redux for state management, React Native for building mobile applications, Next.js for server-side rendering, and many more.

React has gained significant popularity due to its performance, reusability, and the vibrant community around it. It is widely used in building single-page applications, web applications, mobile applications, and even desktop applications.

728x90
Comments