둥이의 개발여행

접속장치로 연결된 네트워크네트워크 접속장치는 통신망(근거리, 광역) 구성에서 가장 기본이 되는 하드웨어 장치물리적으로 떨어진 다양한 형태의 근거리 통신망을 연결하면 좀 더 복잡하고 큰 광역 통신망을 형성하는데, 이들을 연결하려면 다양한 접속장치가 필요하다.컴퓨터나 네트워크 장치는 NIC(네트워크 인터페이스 카드)를 사용하여 네트워크에 연결할 수 있다허브, 스위치, 중계기, 게이트웨이, 라우터 등을 사용하여 네트워킹 문제를 해결한다 네트워크 접속장치 종류 LAN 카드 (Netwrok Interface Card, NIC)컴퓨터나 장치가 네트워크에 연결되기 위한 컴퓨터 내에 설치하는 확장 카드네트워크에 연결하는 장치에는 반드시 하나 이상의 LAN 카드가 있어야 함LAN 카드에는 48비트의 고유한 물리적 주소(..

네트워크(Network)네트워크는 두 개 이상의 컴퓨터나 장치들이 서로 연결되어 데이터를 주고받을 수 있는 구조를 의미한다. 네트워크를 통해 장치들은 정보, 리소스(프린터, 서버 등), 인터넷을 공유할 수 있으며, 유선 또는 무선 방식으로 연결될 수 있다.통신설비를 갖춘 컴퓨터를 서로 간에 연결하는 조직 체계, 통신망인터넷(internet)수 백만 개의 네트워크(LAN, WAN)를 서로 연결하여 정보 공유와 통신이 가능하도록 만든 거대한 네트워크 시스템LAN(Local Area Network, 근거리 통신망)우리 집, 학교, 회사 등 작은 지역 내 네트워크내부에서만 연결되며, 인터넷에 직접 연결되지 않음각 LAN은 특정한 프로토콜로 운용된다. 하나의 LAN이 여러 프로토콜을 이용할 수도 있다.ISP(In..

1. FSD 아키텍처란?FSD(Feature-Sliced-Design) 아키텍처는 소프트웨어 시스템을 기능 중심으로 나누어 모듈화하고, 각 기능을 독립적으로 관리하는 방식이다. 이 아키텍처는 특히 대규모 프론트엔드 애플리케이션에서 코드의 유지보수성과 재사용성을 높이기 위해 사용된다. FSD 아키텍처는 각 기능을 독립적인 도메인으로 분리하여 개발할 수 있도록 하고, 코드의 복잡도를 줄이며, 팀 협업을 개선하는 데 목적이 있다.2. FSD 아키텍처의 기본 개념FSD는 기능 중심(Feature-Oriented) 접근 방식을 사용한다. 이를 통해 프로젝트가 점진적으로 성장하면서도 유지보수가 용이하게 설계된다. FSD 아키텍처의 기본 원칙은 다음과 같다.기능 기반 분할: 애플리케이션을 기능별로 나누어 각 기능을 ..

훅(Hook)은 React에서 함수형 컴포넌트(functional componet)에서도 상태(state)와 생명 주기(lifecycle) 기능을 사용할 수 있게 해주는 특별한 함수입니다. Reack 16.8에서 도입되었으며, 기존의 클래스형 컴포넌트로만 가능했던 작업을 훨씬 간결하게 구현할 수 있게 한다.함수형 컴포넌트에서 사용 가능 : 클래스형 컴포넌트를 사용하지 않아도 상태 관리, 생명 주기 관련 작업을 처리할 수 있음.함수 기반 : 이름이 항상 use로 시작하며, React 내부의 특정 기능과 연결됨.재사용 가능 : 사용자 정의 훅을 만들어 코드 재사용성을 높일 수 있음.클린한 코드 : 상태와 관련된 로직을 더 명확하고 모듈화된 방식으로 작성 가능.useState : 상태 관리 훅함수형 컴포넌트에..

ag-Grid웹 애플리케이션에서 데이터를 표 형식으로 효율적으로 표시하고 관리할 수 있도록 돕는 JavaScript 기반의 고성능 데이터 그리드 라이브러리 aggrid는 모든 주요 웹 프레임워크(React, Angular, Vue.js)와 호환되며, 독립적인 JavaScript 라이브러리로도 사용할 수 있다.다양한 기능정렬(Sorting)필터링(Filtering)그룹화(Grouping)페이징(Paging)편집(Editing)컬럼 고정(Pinned Columns)드래그 앤 드롭(Drag and Drop)셀 템플릿(Custom Cell Templates)컬럼 숨김/보임(Column Visibility)ag-Grid 기본 사용법 공식 문서 : https://www.ag-grid.com/react-data-gr..

$digest already in progressangularJS에서 발생하는 오류, 이 오류는 $digest 루프가 이미 진행 중일 때 또 다른 $digest 루프가 시작되려고 할 때 발생하는 오류이다.$digest angularjs 데이터 바인딩 시스템에서 모델이 변경될 때 이를 ui에 반영하기 위해 실행되는 프로세스문제 원인모델이 변경될 때 $digest 루프를 시작하여 뷰를 업데이트하는데 이 루프가 완료 되기 전에 또 다른 모델 변경이 발생하면 $digest already in progress 오류가 발생한다.$digest 또는 $apply를 수동으로 호출할 때 이 오류가 발생한다. 예를 들어 한 $digest가 진행 중일 때 또 다른 $digest나 $apply를 호출하면 충돌이 일어날 수 있다..

프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr// 1function solution(name, yearning, photo) { const answer = photo.reduce((acc, picture) => { let result = 0; picture.forEach(item => { const a = name.find(n => n === item); if (a) { const idx = name.indexOf(a); result += yearning[idx]; ..

1xx (정보 응답)100 Continue: 클라이언트가 요청을 계속 진행할 수 있음을 나타냅니다.101 Switching Protocols: 서버가 클라이언트의 프로토콜 변경 요청을 수용했음을 나타냅니다.2xx (성공)200 OK: 요청이 성공적으로 처리되었습니다.201 Created: 요청이 성공적으로 처리되었고, 새로운 리소스가 생성되었습니다.202 Accepted: 요청이 접수되었지만, 아직 처리되지 않았음을 나타냅니다.204 No Content: 요청이 성공했지만, 반환할 내용이 없습니다.3xx (리다이렉션)301 Moved Permanently: 요청한 리소스의 URL이 영구적으로 변경되었음을 나타냅니다.302 Found: 요청한 리소스가 임시적으로 다른 URL에 있습니다.303 See Oth..

객체 (Object)원시값(primitive value)을 제외한 나머지 값(함수, 배열, 정규 표현식 등)은 모두 객체원시 타입은 하나의 값만 나타내지만 객체 타입(object / reference type)은 다양한 값을 하나의 단위로 구성원시 값은 변경 불가(immutable)한 값이지만, 객체는 변경 가능(mutable)한 값객체는 0개 이상의 프로퍼티로 구성된 집합이며, 프로퍼티는 키 (key) : 값 (value)로 구성자바스크립트에서 함수도 프로퍼티의 값으로 설정 가능 [함수는 일급객체]var myObj = { num: 0, // 프로퍼티 increase: function () { ... ) // 메서드} 자바스크립트는 프로토타입 기반 객체 지향 언어자바와 같은 클래스 기반 객체 지향 언..

원시 값과 객체 비교자바스크립트가 제공하는 7가지 데이터 타입(숫자, 문자열, 불리언, null, undeined, 심벌, 객체 타입)은 크게 원시 타입과 객체 타입으로 구분할 수 있다. 데이터 타입을 구분하는 이유는 무엇일까? 원시 타입과 객체 타입을 크게 세가지 측면에서 나눌 수 있다. 원시 타입의 값, 즉 원시 값은 변경 불가능한 값(immutable value) 이다. 이에 비해 객체(참조)타입의 값, 즉 객체는 변경 가능한 값(mutable value) 이다.원시 값(100)을 변수에 할당하면 변수에는 실제 값(100)이 저장된다. 이에 비해 객체를 변수에 할당하면 변수에는 참조 값(메모리 주소)이 저장된다.원시 값을 갖는 변수를 다른 변수에 할당하면 원본의 원시 값이 복사되어 전달된다. 이를 ..