Today I Learned

Today T Learned - 01. HTML

Java Script 다크모드 버튼 만들기 > 자바스크립트를 이용해 개인페이지를 꾸며볼 수 있는 기능이 뭐가 있을까 생각하다가 간단하고 스스로 해볼 수 있는 다크모드 버튼 만들기로 결정 1. 컨셉 구상 흰 배경에 검정 글씨였던 내 개인페이지에 가장 간단히 적용해볼 수

자바스크립트로 숫자야구게임을 만들던 도중 '정답'과 '사용자의 입력값'을 비교하는 과정에서 number, string, array, object 등의 값의 비교에 대해 의문이 생겨 알아보던 도중 기록을 남긴다.먼저 자바스크립트의 값의 종류를 알아봤다.1\. 원시값 (P

semantic : 의미의, 의미론적인semantic의 사전적 정의를 먼저 찾아보았다.직역하자면 의미론적인 Web 과 의미론적인 Tag인데 말이 선뜻 와닿지는 않았다.semantic web과 tag를 이해하기 위해선 일단 SEO(검색엔진 최적화: Search Engin

처음 개인페이지를 만들 때 여기저기 기웃거리며 이 코드 저 코드 갖다 쓰며 많이 봤던 position 속성에 대해 다시 한 번 공부하고 이해한 것을 정리한다.position 속성은 말 그대로 문서 안의 요소들의 위치를 지정할 수 있는 속성이다.속성값으로는 static,

display 속성의 대표적인 것들을 정리하고 넘어간다.1\. inline말 그대로 한 줄 안에 여러 요소들이 나란히 배치된다.inline으로 지정되면 태그에 담긴 컨텐트의 크기에 따라 공간이 차지된다.따라서 width나 height를 지정할 수 없다.padding이나

float에 대해 정확하게 알고 이해하기 위해 정리한다.float은 이미지를 텍스트 주위에 둘러 잘 어울리도록 하기 위해 만들어졌다.페이지의 레이아웃을 구성하는데도 자주 쓰인다. float은 뜨다 라는 의미이며 해당 요소를 띄워 원하는 곳에 배치한다.\-left, ri

하나의 div안에 두 button을 나란히 가운데 정렬을 하다가 문제가 생겼다. 이렇게 봐서는 눈이 안좋은가 싶었지만 개발자도구로 자세히 들여다보니 확연히 차이가 났다. 분명 같은 div 안에 같은 class를 가지고 같은 속성을 적용했는데도 높이에 차이가 보이는

위 그림에서 이해가 안되는 점이 발견됐다.console 창 첫째 줄의 '3, 김개발'은 어디서 나왔는가!궁금증을 해결하기 위해 밑에서 부터 한 줄씩 지워봤다.이렇게 했는데도 console창에서 '3, 김개발'이 찍혔다.function은 함수를 정의하는 것이니 conso

ES6부터 생긴 함수를 만드는 새로운 표현 ( => 화살표 모양의 기호를 쓴다.)이름이 없는 함수를 만들 때 사용하는 모양이름이 있는 함수를 만들 때 사용하는 모양인자가 하나일 때는 소괄호가 생략 가능하다.인자가 두 개 이상일 때는 소괄호가 생략이 불가능하다.만약 함수

이름(key)과 값(value)으로 구분된 프로퍼티(property)들의 집합.중괄호를 사용하며 각 프로퍼티(property)의 이름(key)은 중복될 수 없다. (값(value)은 중복 가능)예시)객체 plan1의 프로퍼티(property)는 총 5개이고 이름(key

영상이나 글, 이미지 등의 데이터들을 많이 모아놓은 베이스.컴퓨터 시스템에 저장된 정보나 데이터를 모두 모아 놓은 집합.\- 데이터를 오랜기간 저장 및 보존하기 위해.메모리에 존재하는 데이터는 오래 보존이 되지 않음.필요한 자료를 계속 오래 보존하기 위해 데이터베이스를

Hyper Text Transfer Protocol의 약자 Hyper TextHTML의 HT와 같은 Hyper Text는 문서와 문서가 링크로 연결되도록 하는 태그로 구성된 언어라는 뜻을 가지고 있다.Transfer사전적 의미로는 '전송하다'라는 의미를 가지고 있다.우

React Web Application이 발전하면서 규모가 커지고 이전의 방법으로는 코드를 개발하고 유지보수 하는 것이 어려워졌다. 그래서 이런 문제를 해결하기 위해 다양한 Frontend Framework(Library)가 등장하게 된다. Frontend Frame

react에서 맵 함수 사용시 key props를 지정해주지 않으면 이런 오류가 나는 모습을 볼 수 있다.동작하는데는 큰 문제가 없어보이지만 이 오류는 왜 나타나는 것이며 key props는 어떤 의미를 갖는 것일까?Key는 React가 어떤 항목을 변경, 추가 또는