본문 바로가기

전체 글

(279)
[Position]누가 누가 더 높이 올라가나요? HTML은 사실 Ground floor와 1층으로 나눠진다. 간단히 Ground floor는 body tag라고 생각하면 되고 이외 tags들을 1층의 layer가 올라갔다고 생각해보자 CSS는 HTML의 style해 준다. 그중 POSITION은 층(floor), 다시 말해 layer를 통해 높이를 형성한다. 높이 형성은 점수 계산방식으로 사용하면 이해가 조금은 쉽다. POSITION 1. top, right, bottom, left 2. position 속성이 없는 경우 1 번의 value 사용(이동) 불가 3. Position이 absolute, fixed, sticky 일 경우 right, bottom 사용 가능 4. 기준의 속성명 위치에서 대상의 속성명 위치까지의 거리. 층(점수) : HTML ..
[수업1]홈페이지를 만드는 기본 개념 홈페이지라는 것은 결국 나의 피씨(My pc : server)에 있는 내용을 web world(internet)에 올리는 것을 의미한다. FTP File Transfer Protocold의 줄일말로써 내가 할당 받은 hosting (account)에 데이터를 올릴 수 있는 공간. 특징 1) 호스팅 업체마다 'root' 폴더 명칭이 다 다름 ex.html 특징2) root folder 밖에 내용은 web site에 반영 안됨. 번외 index.html로 파일을 만들면 대체적으로 --> main page로 자동 반영. browser는 browse라는 용어로써 뜻은 (가게 안의 물건, 책·신문 등 을) 대강 읽다, 둘러보다 라는 영어뜻을 가지고 있음. web은 책이라는 개념으로 출발한 것으로써 책에서 사용하는..
[JS]변수 이야기 제로조 유트브님의 영상을 정리한 내용입니다. (업데이트 : 20223.09.23) https://www.youtube.com/watch?v=LgYyP1PmKR0 프로그램 정의 뜻 let, var 변수 어떤 관계나 범위 안에서 여러 가지 값으로 변할 수 있는 수. conts 상수 변하지 아니하는 일정한 값을 가진 수나 양. 변수 - 선언, 선언문, 선언과 동시에 초기화 했다. 역할 console.log( ) => 화면에 그리는 역할 >>> undefined 변수 선언문자 'sting' => 값을 돌려주는 역할 >>> 메모리에 저장된 값 반환 > let change = "바꿔 봐"; change = '바꿨다'; < "바꿨다" 이는 let 의 역할 때문에 차이가 난다. let이 없을 ..
[JS] class 상속과 super ※이 자료는 생활코딩 영상을 보고 개인의 생각과 가미하여 작성한 글입니다.(업데이트 : 2023.09.16) 상속 : extends 상속은 새로 만든 class에 extends '기존 class'를 불러는 과정이다. 사용하는 이유는 새로운 method를 추가하고 싶은데 활용한다. 물론 기존 class를 수정해도 되지만 1) 내가 접근할 수 없거나, 2) 라이브러리가 업데이트 되면 내가 수정한 코드가 사라질 수 있다. 부모 바라봐 : super super는 코드를 단순화 하기 위한 방법으로 사용되는 함수로써(?) 부모(기존 class)를 불러와 코드를 작성한다. 나아가 나만(새롭게 만든 class) 가지고 있는 method 등을 작성할 수 있게 된다. class PersonPlus extends Perso..
[Front-End]시작 The class now has begun. I think I am a bit difference before the past me. You better move your ass faster than before.
[JS]ES6에 들어간 Class : 이전엔 prototype ES6에 들어간 class 를 확인해 보려고 한다. ※이 자료는 생활코딩의 영상을 보고 개인이 작성한 글입니다.(업데이트 : 2023.09.16) ES6이전와 이후로 코딩 작성 방법을 비교해보면 좋을꺼 같다. ES6 이전 ES6 이후 prototype class ES6 이전 : prototype 역시나 tistoryd에서 제공하는 '코드블럭' 기능이 안되서 사진을 활용하겠다. A : console.log('kim.sum()', kim.sum()); 1. New를 통해 새로운 객체 및 속성값 기본 세팅(name, first, second)을 한다 2. kim.sum을 통해서 sum이라는 method를 호출 한다. 여기 있는 kim object에서 sum이라는 method를 호출할때, 제일 먼저 그 객체 자..
[JS]매개변수와 인수 매개변수(parameter)는 함수 안에서의 정의 및 사용에 나열되어 있는 변수들을 의미 전달 인자(argument)는 함수를 호출할 때 전달되는 실제 값을 의미
[JS]선언과 함수의 이해 이 글은 드림코딩 영상을 보고 작성된 글입니다. 선언과 함수에 대한 전체 과정 : 선언 -> 호출 1. 우리가 어떤 값을 반을 건지 인자들 정의 2. 코드 블록 작성 ( curly brackets 안에 내용을 코드 블록이라 지칭 => { '코드블록' }) 단, 선언만으로 한다고 함수호출이 자동적으로 되는 것은 아님) 3. 함수이름 옆 '( )' 안에 정의된 인자값(1 번에서 작성한 내용) 호출 (※ 함수의 이름 자체는 함수를 가르키는 (add)함수자체가 된다. 즉 ()를 쓰지 않고 함수이름만 다른 함수 인자로 전달 또는 다른 변수에 할당하게 되면 함수 자체를 가르키게 됨.) 코드 블럭 삽입이 안 먹어서 이미지로 활용 선언(1~2) 빨간 박스 : 인자들 함수 호출(3번) 다른 예시 1번 화살표의 방향은 "..
[퇴직연금]퇴직연금 해지하는 방법.참조만 최근에 퇴직연금 해지를 해야할 일이 생겨서 순서를 알아보았다. ※이 작성된 글은 개인의 경험으로 작성된 글이기때문에 참조로만 하시길 바랍니다. 큰 줄기는 2가지 1. 회사에 퇴직연금 해지 신청은 전달 및 개인 IRP 통장 개설 2. 확정기여형(DC)에 돈이 들어왔는지 확인 개인형 IRP 해지의 경우는 앱으로 가능하다고 한다. 다시 말씀드리면 참조만 하시라. 1. 개인 경험으로 작성된 글이기 때문에 오차(오정보)가 존재 2. 2023년 9월 기준 작성된 정보(법은 언제나 바뀜)
[JS]function 안 this의 History? JS에서 function이 타입인지를 확인하여 현 this.명사 사용에서 this가 가르치는 의미를 알아보려고 한다. 이와같은 자료는 '드림코딩' 채널을 통해서 작성해 보았다. ※이와 같은 function 회기 아이디어는 전적으로 개인적인 생각을 바탕으로 구성되었기 때문에 참고로만 활용하기 바란다. 초기 function const person = makePerson('ellie', 30) // 아마도 초기 ES의 function은 아래와 같지 않았을까? function makePerson(name, age){ return { name : name, age : age, }; } 중기 function - 초기에서 key와 value의 명칭이 동일하다면 shorthand 원칙에 따라 아래와 같이 축약 func..
[JS]data type 별 Memory 할당 그리고 reference의미 Primitive data type, Special data types and Non-Primitive data types (new in ECMAScript 2015) Primitive data types number, string, boolean, null, undefined, symbol Special data types undefined, null Non-Primitive data types array, object, function, data, regex etc 변수 = 담다 = Container 변수를 선언하면 computer's memory에 선언 변수 공간 생김(할당) -> Memory에 특정 양 bite 공간 확보 변수를 할당할 때 복사할 변수긔 값을 그대로 복사(Object의 경우 ref..
[JS]데이터 타입 Var -> let - 사용 하지 말것 - 이유는 hoisting(선언 변수가 글로벌처럼 상단으로 가기 때문에) - NO block scope( '{ }'안 에서 선언한 것은 안에서만 쓸 수 있고 밖에서는 더 이상 사용할 수 없는데, var은 밖에서도 사용가능 = global variable) const(constants) - favor immutable data type due to some reasons(security, (hardware)thread safety, reduce human mistake) Variable Types - Primitive, single item : number, string, boolean, null, undefiedn, symbol - Object, box contai..