코딩하는 짱구

SQL(Structured Query Language)과 NoSQL(Not Only SQL) 데이터베이스는 데이터를 저장하고 관리하는 방식에 있어 근본적인 차이를 가집니다. 각각의 접근 방식은 특정 유형의 애플리케이션과 요구 사항에 적합한 장점과 단점을 가지고 있습니다. SQL 데이터베이스 SQL 데이터베이스는 관계형 데이터베이스 관리 시스템(RDBMS)에 기반을 둔 것으로, 데이터를 테이블로 구성하여 관리합니다. 이러한 테이블은 열(속성)과 행(레코드)으로 구성되어 있으며, 테이블 간의 관계를 통해 데이터의 무결성을 유지합니다. 장점: - 데이터 무결성 및 일관성 : 관계형 데이터베이스는 데이터의 무결성을 유지하기 위한 엄격한 규칙(예: 외래 키 제약 조건)을 가집니다. - 복잡한 쿼리 지원 : SQL..

<백엔드 >/MySQL 2024. 2. 26. 21:37

DOM (Document Object Model)은 웹 페이지의 콘텐츠와 구조를 프로그래밍적으로 조작할 수 있게 해주는 인터페이스입니다. 간단히 말해서, DOM은 웹 페이지를 브라우저가 이해할 수 있는 구조로 변환하는 방법입니다. 이를 통해 자바스크립트와 같은 스크립팅 언어들이 웹 페이지의 텍스트, 스타일, 구조를 동적으로 변경할 수 있게 됩니다. 웹 페이지가 브라우저에 로드될 때, 브라우저는 HTML 문서를 읽고 DOM을 생성합니다. DOM은 문서의 구조를 나무(tree) 형태로 표현합니다. 각 요소, 속성, 텍스트 등은 노드(node)로 표현되며, 이들은 서로 계층적인 관계를 가집니다. 예를 들어, 태그는 최상위 노드가되고, 그 안의 , 태그들은 자식 노드가 됩니다. 이와 같은 구조 덕분에 개발자들은..

웹 < 프론트앤드 >/자바스크립트 2024. 1. 26. 21:05

타입스크립트를 사용하는 이유는 다음과 같습니다. 정적 타입 검사 : 타입스크립트는 코드를 작성하는 시점에서 변수들의 타입을 명시적으로 지정하므로, 컴파일 시점에서 코드의 타입 오류를 검사할 수 있습니다. 이로 인해 런 타임에 발생할 수 있는 일부 버그들을 사전에 방지하고 코드의 안정성과 신뢰성을 향상 시킵니다. 코드 가독성 : 타입스크립트는 코드에서 변수의 타입 정보를 명시적으로 제공하기 때문에 코드를 읽고 이해하는 데 도움이 됩니다. 타입 정보가 명시적으로 표현되므로 개발자들이 코드의 의도를 더 쉽게 파악할 수 있습니다. 코드 도구 지원 : 타입스크립트는 코드 에디터나 IDE에서 코드 자동 완성, 코드 어시스트, 타입 정보 툴팁 등과 같은 다양한 도구 지원을 받을 수 있습니다. 이로 인해 개발 생산성이..

프론트앤드 부트캠프/Day 2023. 7. 26. 17:24

타입스크립트를 사용하는 방법 생성일: 2023년 7월 26일 오후 3:38 타입스크립트를 사용하는 방법은 다음과 같습니다. 타입스크립트 설치 : 먼저, 타입스크립트를 사용하기 위해서는 Node.js와 npm(Node Package Manager)이 설치되어 있어야 합니다. 설치되어 있지 않다면, Node.js 공식 웹사이트(https://nodejs.org/)에서 Node.js를 다운로드하여 설치합니다. Node.js 설치에 따라 npm도 함께 설치됩니다. 설치가 완료되었다면, 커맨드 라인(CMD, 터미널 등)을 열고 다음 명령을 실행하여 타입스크립트를 전역으로 설치합니다. npm install -g typescript 타입스크립트 프로젝트 초기화 : 타입스크립트 프로젝트를 시작하기 위해 프로젝트 폴더를..

웹 < 프론트앤드 >/타입스크립트 2023. 7. 26. 16:46

JSX(JavaScript XML)는 JavaScript의 확장 문법으로, React에서 UI를 작성하기 위해 사용됩니다. JSX는 XML과 유사한 구문을 가지며, React 엘리먼트를 생성하는 데 사용됩니다. 아래는 JSX의 주요 문법에 대한 설명입니다. 엘리먼트 생성 : JSX를 사용하여 React 엘리먼트를 생성할 수 있습니다. JSX에서는 형식으로 엘리먼트를 작성합니다. 예를 들어, 는 HTML에서와 같이 로 작성할 수 있습니다. const element = Hello, World!; JSX 표현식 : JSX에서 중괄호 {}를 사용하여 JavaScript 표현식을 삽입할 수 있습니다. 이를 통해 변수, 함수 호출, 산술 연산 등을 JSX 내에서 사용할 수 있습니다. 예를 들어, {count}는 변..

웹 < 프론트앤드 >/React 2023. 7. 14. 19:48

리액트(React)를 사용하여 기본 파일을 만드는 방법! Node.js 설치하기 : 리액트 애플리케이션을 개발하기 위해서는 Node.js를 먼저 설치해야 합니다. Node.js는 자바스크립트 런타임 환경으로, npm(Node Package Manager)을 제공합니다. npm은 리액트 및 다른 종속성을 관리하는 데 사용됩니다. Node.js를 설치하려면 공식 웹사이트(https://nodejs.org)에서 다운로드하여 설치하세요. 리액트 앱 생성하기 : 터미널(혹은 명령 프롬프트)을 열고 새로운 디렉토리를 생성한 후, 해당 디렉토리로 이동하세요. 예를 들어, 다음과 같은 명령어를 사용하여 디렉토리를 생성하고 이동할 수 있습니다 :) mkdir my-react-app //리액트 앱 생성 cd my-reac..

웹 < 프론트앤드 >/React 2023. 7. 14. 19:08

자바스크립트를 공부하면서 여러 함수들을 접해봤는데 완벽하게 의도와 용도를 알기는 쉽지 않은것 같다. 오늘은 콜백함수가 정확히 뭔지 궁금해서 정리를 해보려고 한다. 계속 그런가 보다 하고 넘어갔는데 ㅠㅠ 공부를 할수록 자주 나오는것을 보니... 알아둬야 겠다 싶었다. 자바스크립트에서 콜백 함수(callback function)란? 자바스크립트에서 콜백 함수(callback function)는 다른 함수에게 인자로 전달되고, 해당 함수의 실행이 완료된 후에 호출되는 함수입니다. 이것은 자바스크립트의 비동기성(asynchronous)을 다루는 일반적인 패턴 중 하나입니다. 콜백 함수는 주로 비동기 작업을 처리하거나, 이벤트 처리, 타이머 설정 등의 상황에서 사용됩니다. 예를 들어, Ajax 요청을 보내고 응답..

웹 < 프론트앤드 >/자바스크립트 2023. 6. 27. 16:32

Redux는 JavaScript 애플리케이션의 상태 관리를 위한 예측 가능하고 일관성 있는 방법을 제공하는 상태 관리 라이브러리입니다. 주로 React와 함께 사용되며, 다른 라이브러리와 프레임워크에서도 사용할 수 있습니다. Redux의 핵심 아이디어는 애플리케이션의 상태를 하나의 중앙 저장소에 저장하고 변경을 예측 가능한 방식으로 관리하는 것입니다. 이 상태 저장소는 애플리케이션의 모든 컴포넌트에서 접근 가능하며, 상태 변경은 불변성을 유지하는 방식으로 이루어집니다. Redux의 주요 구성 요소는 다음과 같습니다: 1. 액션 (Actions) : 상태 변경을 위해 발생하는 이벤트나 명령을 나타냅니다. 일반적으로 객체 형태로 정의되며, "type" 필드를 포함하여 어떤 유형의 액션이 발생했는지 식별합니다..

프론트앤드 부트캠프/Day 2023. 6. 22. 14:06