감동의 순간들

1. 기본 개요jQuery : jQuery는 DOM 조작과 이벤트 핸들링을 간편하게 하기 위해 설계된 자바스크립트 라이브러리이다. CSS 선택자 문법을 사용하여 요소를 선택하고 조작할 수 있으며, AJAX 요청, 애니메이션, 이벤트 핸들링 등의 기능을 간단하게 구현할 수 있다. 반응형 디자인을 구현할 때는 주로 CSS 미디어쿼리와 함께 사용된다. React : React는 페이스북에서 개발한 자바스크립트 라이브러리로, 사용자 인터페이스를 구축하기 위해 만들어졌다. 컴포넌트 기반 아키텍쳐를 채택하고 있으며, 상태관리와 데이터 흐름을 체계적으로 관리할 수 있다. 반응형 디자인을 지원하는 다양한 라이브러리 및 도구와 잘 통합된다.  2. 반응형 디자인 구현 방법jQuery : CSS와 미디어 쿼리 : 반응형 ..

strict equality operator === 연산자는 React에만 국한된 특별한 문법은 아니다. JavaScript의 엄격한 동등 연산자(strict equality operator)이다 === 연산자는 두 값의 타입과 값이 모두 같은지 비교한다. 예를 들어,5 === 5는 true이다. (두 값이 모두 숫자 5이므로)5=== '5'는 false이다. (숫자 5와 문자열 '5'는 타입이 다르기 때문에)이 연산자는 React와 같은 JavaScript 라이브러리나 프레임워크에서도 자주 사용되지만,  JavaScript 언어 자체의 문법이다. 따라서, JavaScript를 사용하는 모든 환경에서 사용할 수 있다. React에서는 JavaScript를 사용하기 때문에, 당연히 === 연산자도 사용할 ..

import ReactDOM from 'react-dom/client'; 이 코드는 React 18 버전에서 새로운 API를 사용하기 위해 도입된 문법이다. 기존 React 17 버전과 그 이전 버전에서는 ReactDOM.rednder 메서드를 사용하여 애플리케이션을 DOM에 렌더링 했다. 하지만 React 18에서는 ReactDOM.createRoot를 사용하여 루트 DOM 노드를 생성하고 렌더링한다. 1. React 17 버전까지의 렌더링 방식import React from 'react';import ReactDOM from 'react-dom';import App from './App';ReactDOM.render(, document.getElementById('root')); 2. React 18..

React에서 props(properties의 줄임말)는 컴포넌트가 부모 컴포넌트로부터 데이터를 전달받는 방법이다. props는 컴포넌트의 입력값을 정의하며, 이를 통해 컴포넌트의 동작과 렌더링을 제어할 수 있다. props는 읽기 전용이며, 컴포넌트 내에서 변경할 수 없다. 이를 통해 컴포넌트 간의 데이터 흐름을 단방향으로 유지하여 예측 가능한 상태 관리를 할 수 있다. 주요 역할과 특징 1. 데이터 전달 : props는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달하는 데 사용된다. 이를 통해 컴포넌트 간에 데이터를 공유할 수 있다.2. 컴포넌트 재사용성 : props를 사용하면 같은 컴포넌트를 다양한 데이터와 설정으로 재사용할 수 있다. 컴포넌트의 동작을 다르게 설정하여 다양한 용도로 사용할 수 ..

JSX는 JavaScript와 XML의 조합으로, React에서 주로 사용되는 문법이다. JSX는 JavaScript 코드내에서 HTML과 유사한 문법을 사용할 수 있게 해주어, UI 컴포넌트를 정의하고 렌더링하는 과정을 직관적이고 간결하게 만든다. JSX는 Babel과 같은 트랜스파일러에 의해 일반 JavaScript로 변환된다. JSX의 주요 특징 1. XML-like Syntax : JSX는 XML과 유사한 문법을 사용하여 HTML 태그를 작성할 수 있다. 이는 코드의 가독성을 높여주고, UI 구조를 직관적으로 이해할 수 있게 한다.const element = Hello, world!; jquery로 제작한 코드와 비교해 보았다.var element = $('').text('Hello, world!..

React React는 Facebook에서 개발한 오픈 소스 자바스크립트 라이브러리로, 사용자 인터페이스(UI)를 구축하는 데 사용된다. 2013년에 처음 공개된 이후, 웹 개발 커뮤니티에서 널리 사용되고 있다. React는 특히 단일 페이지 애플리케이션(SPA)을 개발하는 데 매우 유용하며, 사용자 인터페이스를 효율적이고 동적으로 업데이트하는 데 중점을 둔다.  SPA의 개념에 대해 한번 확인하고 넘어가자.SPA 단일 페이지 애플리케이션(Single Page Application, SPA)은 웹 애플리케이션이나 웹사이트의 일종으로, 사용자와 상호작용할 때 페이지를 새로 고침하지 않고도 동적으로 콘텐츠를 업데이트하는 방식이다. 이는 사용자 경험을 향상시키고, 애플리케이션의 응답성을 높이는 데 주력한다. ..