All Article

공부한 내용을 정리합니다
Computer Science/Basics

프로그래밍

Crash Course: Computer Science를 정리했습니다. 초기의 프로그래밍 방직기 이는 최초의 프로그래밍 방식 중 하나다. 펀치 카드 인구조사 통계 건으로 의뢰해 개발한 그것이다. 그러나 이는 단지 도표화 하나만 가능했으며 프로그래밍은 아니었다. 플러그보드 여기에 점점 빼고 곱하고 나누는 기능이 추가된다. 이런 기능을 수행할 수 있도록 프로그래머는 Control Panel 제어 패널을 조작한다. 이 패널은 작은 소켓들로 채워져 있고, 프로그래머가 케이블을 연결하여 값이나 신호를 기계의 다른 부분으로 보낼 수 있었다. Stored-Program Computers 프로그램을 물리적인 플러그보드의 선으로 저장하는 대신에, 전체 프로그램을 이제 메모리 안에 저장할 수 있게 되었다! 폰 노이만 구조..

Computer Science/Basics

컴퓨터는 어떻게 계산할까?

Crash Course: Computer Science를 정리했습니다. 부울 연산과 논리 게이트 Boole 부울 대수학은 George Boole이 창안한 참 거짓을 다루는 분야이다. 이를 활용해 true일 경우 전기가 통하고, false일 경우 전기가 통하지 않는 것으로 하여, 하나의 트랜지스터로 인풋 아웃풋이 모두 가능하게 했다. Gate 게이트는 전류의 흐름을 통제하기에 붙여진 이름이다. NOT Gate NOT 논리표와 같다 삼각형모양 AND Gate 둘다 참이어야만 참 두개의 인풋 하나의 아웃풋 트랜지스터 두개가 같이 켜져있어야만 전류가 흐르다 D 모양 OR Gate 하나만 참이어도 참 두 트랜지스터를 병렬로 연결했을 때 우주선 모양 XOR (Exclusive or) 모든 입력이 참이면 거짓이 된다..

Computer Science/Basics

컴퓨팅의 역사, 트랜지스터, 튜링

Crash Course: Computer Science를 듣고 정리했습니다. Computing's History Computing's Origins The Abacus 주판 컴퓨팅의 기원은 계산기이며, 그 계산기의 기원은 '주판'이다. 기원전 2500 년전 메소포타미아에서 발명되었다. 이후 인간은 다양한 계산기를 개발한다. Astrolabe 천문 관측 장치.배가 바다 위에서 그들이 있는 위도를 알 수 있게 해준다. The Slide Rule 계산자.곱셈과 나눗셈을 할 때 도움을 준다. 이외에도 일출,밀물, 썰물, 천체의 움직임을 계산할 수 있는 장치들을 개발한다. Leibniz' Step Reckoner 계단식 계산기 또는 라이프니츠 계산기 1672년경 독일의 수학자 고트프리트 빌헬름 라이프니츠가 발명하..

Project Record/Customize Tistory

티스토리 hELLO 스킨 헤더 이미지에 blur 효과 넣기

HTML에서 와 안에 있는 div와 img에 cover-blur 클래스를 추가해주면 된다. div의 thumbnail 앞에 cover-blur 넣어주기 img의 absolute 앞에 cover-blur 넣어주기 그리고 해당 cover-blur 클래스를 아래와 같이 설정하여 CSS에 추가해준다. div.cover-blur { overflow: hidden; } img.cover-blur { filter: blur(20px); } img에 cover-blur 클래스가 설정되어 있으면 20px의 blur 효과를 주는 필터를 건다. 이때, blur때문에 지정 사이즈 밖으로 이미지가 번지기에 overflow를 hidden으로 주어 지정한 사이즈 부분만 표시되게 하는 것이다.

Programming/Front-end

CSS / 이미지 사이즈 맞추는 방법

1. background background size 배경으로 들어갔을 때만 사용 가능 contain : 이미지의 가로세로 비율을 유지하면서, 이미지가 잘리지 않을 때까지만 채운다. cover : 이미지의 가로세로 비율을 유지하면서, 이미지가 잘리더라도 주어진 크기를 꽉 채운다. 사이즈 직접 입력 : (100%, 200px, 50em 등) 비율 무관, 입력한 값에 따른다. background-position background-position: top; background-position: bottom; background-position: center; background-position: left; background-position: right; background-position: 25% 75%;..

Programming/Front-end

JS / textContent와 innterText의 차이점

Node.textContent 와 요소를 포함한 모든 요소의 콘텐츠를 가져온다. 노드의 모든 요소를 반환한다. textContent는 XSS 공격의 위험이 없다. innerText 와의 차이점 innerText는 "사람이 읽을 수 있는" 요소만 처리한다. "숨겨진" 요소의 텍스트는 반환하지 않는다. innerText는 CSS를 고려하기에 리플로우가 발생한다. (피하는 게 좋다) Internet Explorer 기준으로 innerText를 수정하면 요소의 모든 자식 노드를 제거한다. 해당 텍스트 노드를 재활용하기 어렵다. innerHTML 과의 차이점 Element.innerHTML는 이름 그대로 HTML을 반환한다. HTML로 분석할 필요가 없다는 점에서 textContent의 성능이 더 좋다. HTML..

Software Engineering/SDLC

Crash Course의 소프트웨어 공학 개괄 정리

Crash Course: Computer Science를 정리했습니다. 소프트웨어 공학 소프트웨어 공학은 '마가렛 해밀턴'이 만든 용어이다. 예를 들어 MS오피스는 코드라인이 4천만개에 달한다. 이런 거대한 프로그램을 만들기 위해서는 소프트웨어 공학이 필요하다. Object oriented Programming 객체지향 프로그래밍이란 함수를 계층구조로 패키지화하는 것이다. 즉, 관련된 코드를 객체로 모으는 것이다. 여기서 객체는 다른 객체와 함수를 포함할 수 있다. 복잡성을 숨기고 선택적으로 그것을 드러내는 것이 본질이며, 크고 복잡한 프로그램을 만드는 대중적이고 강력한 방법이다. API (Application Programming Interface) 공동으로 작업하는 방식이다. 적절한 접근 권한을 알 ..

Computer Science/Operating System

Crash Course의 운영체제의 역사 정리

Crash Course: Computer Science의 운영체제 부분을 정리했습니다. 운영체제(Operating System)는 컴퓨터가 스스로 프로그램을 실행할 수 있는 능력이 필요해짐에 따라 탄생하게 되었다. 다른 프로그램을 실행하고 관리할 수 있는, 컴퓨터 전원 켰을 때 시작하는 프로그램이다. Batch Processing 일괄 처리 1950년대에 시작되었다. 처음에는 수동 작업(직접 펀치카드 넣는..)의 보강 용도로 고안되었다. 한 작업을 완료하면 자동으로 다음 작업을 즉시 시작하는 것을 뜻한다. Device Drievers 초기 프로그래머들의 고통을 덜어주기 위해, 운영체제는 소프트웨어 프로그램과 하드웨어 주변 장치의 중개자로서의 단계를 밟았다. 구체적으로, Device Drievers 라고 ..

Programming/Java

Java / 상속 : 이름이 같은 변수, 메서드

A를 B가 상속받았을 때 A와 B가 같은 이름의 변수를 가지고 있는 경우 A→B 상속관계에, A의 int a =10 , B의 int a =20 인 경우 A obj1 = new B(); B obj2 = new B(); 이렇게 인스턴스를 생성해주었을 때, obj1, obj2은 a와 부모에게 상속받은 a를 둘 다 갖고 있다. 이 경우 obj1.a, obj2.a를 각각 출력하면 10, 20이 출력된다. 이유는 obj1은 A클래스로 만들어진 것이고, obj2는 B클래스로 만들어졌기에 해당 클래스에 해당되는 변수를 호출하게 되는 것이다. 이 경우 obj1에서 주의할 것 1. 메서드 super의 메서드만 사용 가능하다. sub만 갖고있는 메서드는 사용 불가하다. 이 경우에도 오버라이딩 된 메서드는 오버라이딩이 적용된..