전체 글

[TIL] Git 기초

📌 깃이란? git - 로컬에서 관리되는 분산 버전 관리 시스템(VSC), 소스코드 수정에 따른 버전을 관리해주는 시스템 github - 클라우드 방식으로 관리되는 분산 버전 관리 시스템(VSC), 소스코드 수정에 따른 버전을 관리해주는 시스템 간단히 보자면 git은 로컬(본인 컴퓨터)에서 버전 관리 시스템을 운영하는 방식이고 github는 깃허브에서 제공하는 클라우드 서버에서 버전관리리를 하는 방식이다. 📌 깃의 주요 개념 커밋(commit) : git에 파일을 추가하거나 변경 내용을 저장하는 작업 푸쉬(push) : github(원격저장소)에 파일을 추가하거나 변경 내용을 저장하는 작업 풀(pull) : github(원격저장소)에서 파일을 다운로드하는 작업 머지(merge) : 한 branch에서 완..

[TIL] 기초 리눅스

리눅스 1. 운영체제 운영체제란 사용자가 컴퓨터의 하드웨어를 쉽게 사용할 수 있도록 인터페이스를 제공하고 각종 하드웨어적인 자원과 소프트웨어적인 자원을 효율적으로 운영, 관리함으로써 사용자가 시스템을 이용하는데 편리함을 제공하는 소프트웨어이다. 대표적인 운영체제 : 윈도우, 맥, 리눅스 등 쉽게 생각하면 컴퓨터는 0과 1만 인식하기 때문에 사람의 말을 전달하기 위해 os를 통해 사람의 명령어를 컴퓨터가 알 수 있도록 바꿔서 실행. 즉 컴퓨터랑 사람이랑 대화를 할 수 있게 다리 역할을 한다. 커널과 쉘 커널(kernel) - 운영체제의 핵심으로서 프로세스(process) 관리, 메모리 관리, I/O 시스템 관리, 파일 시스템 관리 등을 수행. 쉘 (shell) - 사용자와 내부 커널 사이의 명령어를 해석해..

[TIL] 개발자 도구 Network

Network Network 해당 웹 사이트에서 통신하고 있는 모든 정보가 표시되는 곳 각 소스들을 불러올 때 속도, 요청, 응답을 확인 가능하며 네트워크 문제가 있을 시 비교/분석이 가능하다. (api 호출을 하였을 때 네트워크 탭을 통해서 제대로 호출,응답이 된 것인지 확인이 가능하다.) Network 탭 Filmstrip : 이미지 최상단에 위치한 그래프. 타임라인형태로 어떠한 데이터가 어떤 순서로 로드 됐는지 표시되는 곳. Name : 통신하고 있는 파일의 이름 status : HTTP 응답이 제대로 되었는지의 상태(200 ok, 40X client error, 50X server error) type : 파일의 종류 size : 파일의 사이즈 time : 해당 파일이 로드되는데의 시간 initi..

[CSS] Display, Position

레이아웃 Display 대부분의 엘리먼트에 대한 기본값은 보통 block이나 inline이다. block 기본적으로 width가 100%가 되게 하고 가로 한 줄을 다 차지하게 한다. div, h1, p, ul, ol, form 태그 등이 있다. inline 컨텐츠를 감쌀정도의 크기만 갖게 된다. 블락태그와 다르게 줄바꿈 X 크기를 변화시킬수 없다.(width, height 값 넣어도 적용되지 않음) span, a, img 태그 등이 있다. inline-block 기본적으로 inline 처럼 전후 줄바꿈 없이 한 줄에 다른 엘리멘트와 나란히 배치 inline에서 불가능하던 width, height, margin, padding 등의 속성 변경이 가능하다 button ,input, select 태그 등이 ..

시멘틱 웹과 시멘틱 태그

시멘틱 웹과 시멘틱 태그 시멘틱 웹 시맨틱 웹(Semantic Web)은 의미론적인 웹이란 뜻으로, 현재의 인터넷과 같은 분산환경에서 리소스(웹 문서, 각종 화일, 서비스 등)에 대한 정보와 자원 사이의 관계-의미 정보(Semanteme)를 기계(컴퓨터)가 처리할 수 있는 온톨로지형태로 표현하고, 이를 자동화된 기계(컴퓨터)가 처리하도록 하는 프레임워크이자 기술이다. 웹의 창시자인 팀 버너스 리가 1998년 제안했고 현재W3C에 의해 표준화 작업이 진행중이다. 쉽게 생각하자면 컨텐츠의 내용에 맞는 적절한 태그로 HTML을 작성하여 단순한 코드의 구성이 아닌 의미를 가진 사이트라는 것을 알려 주는 것이다. 시멘틱 태그 시멘틱 태그는 '의미를 가진' 태그를 말한다. 즉 태그 자체가 콘텐츠의 의..

[자바스크립트] this

this 1. this 키워드 객체 - 상태를 나타내는 프로퍼티와 동작을 나타내는 메서드를 하나의 논리적인 단위로 묶은 복합적인 자료구조 this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-referencing variable)다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this는 자바스크립트 엔진에 의해 암묵적으로 생성되며, 코드 어디서든 참조 가능하며, 함수를 호출하면 arguments 객체와 this가 암묵적으로 함수 내부에 전달된다. this가 가리키는 값, 즉 this 바인딩(식별자와 값을 연결하는 과정)은 함수 호출 방식에 의해 동적으로 결정된다. // 객체 리터럴의 메서드 내부에서는의 th..

[자바스크립트] 빌트인 객체

빌트인 객체 1. 자바스크립트 객체의 분류 표준 빌트인 객체 - ECMAScript 사양에 정의된 객체, 애플리케잉션 전역의 공통 기능을 제공 호스트 객체 - ECMAScript 사양에 정의되어 있지 않지만 자바스크립트 실행환경에서 추가로 제공하는 객체 사용자 정의 객체 - 사용자가 직접 정의한 객체 2. 표준 빌트인 객체 자바스크립트는 Object, String, Number, Boolean, Symbol, Math, Reflect, JSON, Proxy 등 40여 개의 표준 빌트인 객체를 제공한다. Math, Reflect, JSON을 제외한 표준 빌트인 객체는 모두 인스턴스를 생성할 수 있는 생성자 함수 객체다. 생성자 함수 객체인 표준 빌트인 객체는 프로토타입 메서드와 정적 메서드를 제공, 생성자..

[자바스크립트] strict mode

strict mode 1. strict mode란? strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. 'use strict'; // 하지 않으면 자바스크립트는 x 변수를 암묵적으로 전역 변수처럼 사용할 수 있기 때문에 콘솔에 10이 찍힌다 function foo(){ x = 10; } foo(); console.log(x); // x is not defined 2. strict mode의 적용 strict mode를 적용하려면 전역의 선두 또는 함수 몸체의 선두에 'use strict';를 추가한다. 'use stri..

[자바스크립트] 프로토타입

프로토타입 자바스크립트는 객체 기반의 프로그래밍 언어이며 자바스크립트를 이루고 있는 거의 "모든 것"이 객체다. 1. 객체지향 프로그래밍 객체지향 프로그래밍 - 여러 개의 독립적인 단위, 즉 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임 // 이름과 주소 속성을 갖는 객체 const person = { name : 'Lee', address : 'seoul' } 프로그래머(subject, 주체)는 이름과 주소 속성으로 표현된 객체(obejct)인 person을 다른 객체와 구별하여 인식할 수 있다. 객체 - 속성을 통해 여러 개의 값을 하나의 단위로 구성한 복합적인 자료구조 객체지향 프로그래밍은 독립적인 객체의 집합으로 프로그램을 표현하려는 프로그램이 패러다임이다...