전체 글 103

1. React 개발환경 만드는 방법: create-react-app

1. React 란 위와 같은 html 코드를 보면 실제로 저런 태그는 존재하지 않는다. 따라서 태그에는 내용중 Top에 해당하는 내용이, SideBar, Bottom에는 그에 맞는 내용들에 해당하는 엄청 긴 html 코드를 직접 작성해야한다. 그렇게 된다면 코드의 가독성의 가독성이 떨어짐은 물론이고 내용을 수정하고 관리하는 유지보수 작업이 매우 힘들어진다. 만약 위와 같은 태그들이 실제로 존재하고 그 태그 안에 엄청나게 긴 내용들을 packing 하여 나타낼 수만 있다면 유지보수관리 측면에서 코드의 재활용과 효율성이 좋아질 것이다. 이것을 가능하게 해주는 것이 React이다. 사용자 정의 태그를 만들어주는 여러 가지 기술이 있는데 리액트는 그 여러 가지 기술 중 하나이다. 그리고 React에서는 사용자..

4. Calling Convention(Caller-save, Callee-save, Hybrid)

1. The Stack 명령어를 통해 프로그램 작성할 때 필요한 메모리 구조에 대해 정리하였습니다. MIPS에서 32개의 레지스터를 가지고 있습니다. 한 프로그램 내에서 사용하는 모든 데이터를 레지스터에 로드하기 때문에 레지스터의 개수는 늘 부족합니다. 따라서 load store 명령을 통해 연산이 필요한 순간에 메모리와 레지스터가 소통하며 연산하게 됩니다. 이때 메모리의 어떤 저장 공간에 레지스터 값을 할당해야할까? 라는 정리가 필요합니다. 레지스터에 값을 메모리로 쫒아내는 과정을 “spil” 이라고합니다. 반대로 메모리에서 레지스터로 값을 읽어 들이는 과정을 “restore”라고 합니다. 이 두 과정을 수행하기 위한 메모리 공간을 stack 구조로 관리되게 됩니다. 일반적으로 OS가 프로세스에 데이터..

3. MIPS 문법 정리

1. MIPS 레지스터 Name Register Number Usage Calling Convention $zero 0 zero 레지스터에는 상수 0이 들어감. &at 1 at 레지스터는 어셈블러가 사용하는 임시공간이다. $v0 - $v1 2 - 3 함수의 리턴 값으로 사용된다. Caller Svae $a0 - $a3 4 - 7 매개변수를 저장하는 레지스터이다 $t0 - $t7 8 - 15 임시변수로 사용되는 레지스터로 값이 변할 수 있다. $s0 - $s7 16 - 23 상수 값을 저장하는 레지스터로 불변상태이다. Callee Save $t8 - $t9 24 - 25 임시변수로 사용되는 레지스터로 값이 변할 수 있다. Caller Save $k0 26 OS Kernel reserved $k1 27 OS..

2. ISA란?

도입 (내 생각 정리) ISA라는 용어를 처음 접하게 되면 아마 가장 많이 보게되는 정의는 “ISA란 마이크로프로세서가 인색해서 기능을 이해하고 실행할 수 있는 기계어 명령어를 말한다.” 일 것이다. 난 이 문장으로 처음 ISA를 접했을 때 전혀 이해할 수 없었다. 내가 공부한 방식으로 ISA를 정의해보면 ISA의 영어 뜻을 해석해보면 “명령어의 집합인 아키텍쳐”라고 해석이 된다. 아키텍쳐의 영어 뜻은 “건축학”을 의미한다고 한다. 컴퓨터 아키텍쳐(컴퓨터 구조)에서의 아키텍쳐는 컴퓨터 시스템의 하드웨어 구조를 말한다. 이를테면 1.에서 설명한 CPU, 메모리, 디스크와의 관계 또는 기계적 구조 또는 이를 설계한는 방법들을 두루두루 의미한다고 생각한다. 아키텍쳐란 어떠한 “구조” “형식”을 의미한다. 아래..

2. 자바스크립트: 클래스

이 글은 이옹모님의 모던 자바스크립트 DEEP DIVE 교재를 참조하여 작성하였습니다. 더보기 목차 1. 개요 프로토타입 기반의 객체지향 언어는 클래스가 필요없는 객체지향 프로그래밍 언어이다. ES5에서는 클래스 없이 아래 코드와 같이 생성자 함수와 프로토타입을 통해 객체의 상속을 구현할 수 있다. // ES5 생성자 함수 var Person = (function () { // 생성자 함수 function Person(name) { this.name = name; } // 프로토타입 메서드 Person.prototype.sayHi = function () { console.log('Hi! My name is ' + this.name); }; // 생성자 함수 반환 return Person; }()); /..

JavaScript 2021.10.05

4. 관계 데이터 모델 , 관계 데이터 베이스 제약 조건

이 글은 Database Management System 3ed / R. Ramakrisnan and J. Gehrke 책을 읽고 직접 정리한 글입니다. 더보기 목차 1-1. 관계 모덜의 뜻 정리 1-2. relation의 예시 1-3. 예시를 통한 domain, attribute, tuple, relation 용어 정의 1-4. relation의 특성 1-5. tuple 내에서 값들과 NULL 값 2-1. 관계 모델 제약 조건 2-2. 도메인 제약조건 2-3. 키 제약 조건과 널에 대한 제약 조건 2-4. 관계 데이터베이스 스키마 2-5. 엔티티 무결성 제약조건 2-6. 참조 무결성 제약조건 3-1. 렐레이션의 3가지 갱신 연산(삭제, 삽입, 수정) 1-1. 관계 모델의 뜻 정리 관계 모델이란 DB의 ..

1. 프로퍼티와 어트리뷰트

이 글은 이옹모님의 모던 자바스크립트 DEEP DIVE 교재를 보고 정리한 글입니다. 더보기 목차 내부 슬롯 , 내부 메소드 프로퍼티 어트리뷰트 프로퍼티 디스크립터 객체 데이터 프로퍼티 접근자 프로퍼티티 프로퍼티 정의 1. 내부 슬롯 , 내부 메소드 내부 슬롯과 내부 메소드는 JS 엔진의 구현 알고리즘을 설명하기 위해 ECMAScipt 사양에서 사용하는 의사 프로퍼티(pseudo property)와 의사 메서드(pseudo property)이다. ECMAScipt 사양에서 등장하는 이중 대괄호 [[...]]로 감싼 이름들이 내부 슬롯과 내부 메소드이다. 내부 슬롯, 내부 메소드는 [[..]] 이렇게 생긴 개념은 실제로 없다. 이는 JS 엔진에서 실제로 동작하는 무엇(?)인가를 설명하기 위해 도입된 개념이..

JavaScript 2021.10.04

4. Github 프로젝트 관리 / remote, push, pull, clone

1. Github 소개 Github는 git을 사용하여 관리되는 프로젝트를 지원하는 웹호스팅 서비스이며 git을 업로드할 수 있다. 개발자들의 버전 제어 및 공동 작업을 위한 플랫폼이다. 예를들어 home에서 작업하던 내용을 office로 옮겨서 해야하는 경우 home의 로컬 저장소 git이 있을것이다. 이 git에서 작업을 한 뒤 github로 git을 업로드하고 (push) office에서 로컬 저장소 git에서 github를 통해 업로드 되어있던 내용을 다시 pull 하여 작업을 이어갈 수 있다. 팀 단위로 진행되는 프로젝트를 github에서 서로 작업한 코드의 내용을 branch단위로 만들고 master에서 commit 하기 전에 테스트 하거나 수정할 수 있다. branch에서 작업하는 동안 ma..

Git 2021.10.02