개발자 (16) 썸네일형 리스트형 2020년의 마지막날 작성하는 올해 회고 2020 나만의 3분기 올해를 크게 나누자면 영국 입국&탈출기 (1월 ~ 4월) 개발 취미기 (4월 ~ 7월) 개발자 전향기 (7월 ~ 12월) 로 나눌 수 있다. 영국 입국&탈출기 (올해 시작부터 4월까지) : 2019년 1월에 영국 워킹홀리데이 비자를 받고 6월에 퇴사를 하고 그 뒤부터 나는 영국에 갈 희망으로 부풀어서 영어공부와 근근한 알바만으로 인생이 가득 찼었다. 그리고 그것이 올해 초에도 계속 이어졌고 나는 원래 3월 말에 영국으로 도착해 새로운 인생의 전환점을 맞이할 예정이었다. 코로나만 아니었다면..... 영국행 비행기를 3월 말로 끊어 놓고 2주간 지낼 숙소까지 모두 마련해 놓은 상황에서 2월 말 갑자기 한국에 코로나가 급격하게 퍼지기 시작했다. 내가 예약했던 베트남 항공은 정말 누구보다.. Hoisting(호이스팅), Scope(스코프) Hoisting 어디에 선언을 했는지와는 상관없이 항상 제일 위로 끌어올려주는 것. scope 어떤 변수에 접근할 수 있는지를 정의하는 것. 전역 스코프와 지역스코프로 나뉘며 지역 스코프는 또 함수 스코프, 블록 스코프로 구분한다. const apple = 'red'; function print() { const lemon = 'yellow' console.log(apple); // 'red' } print(); console.log(lemon); //Uncaught ReferenceError: lemon is not defined 전역 스코프 변수 변수가 모든 함수에 속하지 않고 {}괄호안에도 들어있지 않다면 전역 변수라고 한다. 전역 변수를 선언하면 자바스크립트 코드 어디서든 불러서 쓸 수 있다. 전.. html에서 자바스크립트 불러오기 - script async 와 defer의 차이점 HTML에서 자바스크립트를 포함할 때 어떻게 포함하는 것이 좋은지 async와 defer의 차이점을 알아두면 효율적으로 사용할 수 있다. head 안에 포함되어 있을때 html 읽기(title까지) - script 다운로드 - script 실행 - 나머지 html 읽기 먼저 사용자가 html 파일을 다운로드하였을 때 브라우저는 그것을 한줄한줄 분석한다. 그러다가 스크립트를 만나면 그 스크립트를 다운로드하여야 된다고 읽기 때문에 html을 파싱 하는 것을 잠시 멈추고 필요한 자바스크립트를 서버에서 다운로드하여서 이것을 실행한 다음 html을 다시 파싱 한다. 이 과정에서 만약 자바스크립트 파일이 크기가 큰 파일이라면 다운로드하는 시간이 길어지고 그동안 html이 파싱 되지 못하고 브라우저에 보이지 않는 불.. [CSS] 텍스트 줄바꿈, 말줄임 처리, 글자 자르기 css 공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다. 재배포 수정하지 마세요. 웹페이지상에서 텍스트를 삽입할때 짧은 텍스트일경우는 문제가 없지만 block의 크기보다 넘치게 클 경우 넘치는 글을 잘라내거나 줄바꿈을 해야 하는 경우가 있다. 그럴때 유용하게 사용할 수 있는 것이 white-spacing, text-overflow, word-break 이다. white-space 공백 문자를 어떻게 다룰것인가를 지정한다. normal : 정상적으로 출력하도록 지정한다. 연속된 공백 문자나 줄바꿈을 통합한다. pre : 연속된 공백문자나 줄바꿈을 통합하지 않고 원문 그대로 출력한다. nowrap : 연속된 공백문자는 출력하지만 줄바꿈은 통합하지 않는다. 예제) 원문: 안녕하세요 크리벨로퍼의 블로그입니다... [CSS] 그림자 text-shadow , box-shadow 공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다. 재배포 수정하지 마세요. css로 문자나 박스의 그림자를 추가할 수 있다. 그림자를 추가할 때 쓰는 속성은 text-shadow와 box-shadow 두 가지이다. Text shadow text-shadow 속성으로 문자의 그림자를 추가 할 수 있다. 입력값으로는 수평값(px)과 수직 값(px)을 지정해주어야 한다. h1 { text-shadow: 2px 2px; } 또한, 색상도 지정 해 줄 수 있다. h1 { text-shadow: 2px 2px red; } 그림자의 크기와 색상 사이에 블러값도 넣어줄 수 있다. 블러값이 높아질수록 블러의 효과가 더 커진다. h1 { text-shadow: 2px 2px 5px red; } 그림자의 크기값을 .. [CSS] 그리드 - 자식 속성, 그리드 함수 공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다. 그리드 속성 그리드는 컨테이너(Container)와 아이템(item)들로 나뉜다. 컨테이너는 부모 요소이며 그 안에 자식 요소인 아이템들을 배치 시킬 수 있다. 자식 속성 (Item) grid-row-start : 그리드 아이템 행의 시작 위치를 지정한다. (아래내용과 동일) grid-row-end : 그리드 아이템 행의 끝 위치를 지정한다. 단축속성 : grid-row ( grid-row: 1 / 2; ) 숫자를 지정하거나, 선 이름을 지정하거나 span 키워드를 사용한다. 그냥 span만 쓰면 기본값이 span1 grid-column-start : 그리드 아이템 열의 시작 위치를 지정한다. grid-column-end : 그리드 아이템 열의 .. [HTML] 주요 태그 정리 공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다. 이전 글에서 설명한 태그들을 제외하고 html의 태그들 중 통계적으로 가장 많이 사용되는 태그들을 정리해보았다. 통계는 생활코딩 html 수업에 제시되어 있는 아래의 웹사이트를 참고하였다. https://www.advancedwebranking.com/html/ The average web page from top twenty Google results Apparently, an average web page uses twenty-eight different element types: The twenty-eight elements used on most pages, ordered by appearance frequency: www.advanced.. [HTML] 정보의 html, 의미론적인 태그 공부했던 내용을 정리하는 용도로 오류가 있을 수 있습니다. 안녕하세요. 웹페이지를 공부하고 있는 초보 개발자입니다. : 글의 본문에 표현되진 않지만, 그 웹페이지 혹은 본문을 설명해주는 태그 charset : 캐릭터 셋의 약자로, 우리가 파일을 저장한 형식을 표시해주는 것으로 그 형식으로 화면에 표시할 수 있게 해 준다. ( 만약 'utf-8'의 형식으로 파일을 저장한다고 가정하면 저장하는 것을 인코딩, 그 저장한 형식으로 파일을 해석해서 읽는 것을 디코딩이라고 한다. ) name, content : 웹 페이지 상에서 표시되지는 않지만, 웹페이지에 대한 요약된 자료로도 이용가능하고, 검색될 때 그 요약자료로 쓰일 가능성이 높다. keywords : 웹페이지를 잘 설명하는 키워드들. 기계가 웹페이지를 분류.. 이전 1 2 다음