본문 바로가기

분류 전체보기77

Javascript - 주석 1. 주석이란 주석(Commenting)이란 코드를 작성하긴 했지만 브라우저에서 해당 코드를 무시하라는 뜻이다. 2. 주석을 사용하는 이유 코드를 볼 때마다 이해가 되지 않아 설명을 적어놓을 때 다른 사람에게 인수인계시 코드를 설명해 놓을 때 특정 코드를 다시 쓸 수도 있기 때문에 주석처리해놓고 설명을 적을 때 3. 주석의 형태 // 현재 줄은 주석, 브라우저에 나타나지 않는다. let hellow = []; // 빈 배열 선언 // 주석을 쓸 때는 slash 두개로 시작. 이렇게 slash 두 개를 사용해 //가 있는 줄만 주석 처리를 해줄 수도 있고, /* 이렇게 여러줄을 주석처리 해줄 수도 있다. */ 여러 줄을 한 번에 주석처리해주고 싶으면 위 코드와 같이 /*로 시작해서 */로 끝내면 된다. 2020. 6. 16.
Introduction to JavaScript 1. JavaScript 소개 웹 페이지의 구조를 정의하는 것은 HTML이다. 그런데 HTML만 있다고 해서 웹페이지가 돌아가는 것은 아니다. 우리가 알고 있는 거의 모든 페이지에는 JavaScript 코드가 들어가 있다. JavaScript는 웹 페이지와 상호작용하도록 만들어진 언어이다. 프런트 앤드 개발자의 역할이 여러 가지 있겠지만, 가장 큰 역할은 JavaScript를 사용하여 웹페이지를 dynamic 하고 interactive 하게 만드는 일이다. JavaScript는 브라우저에서 사용자의 행동을 처리하고, 데이터도 저장하고, 네트워크 응답과 요청을 처리하는 역할을 한다. JavaScript를 실행시키려면 1. 브라우저가 존재해야 하고, 2.HTML 파일이 있어야 하고, 3. HTML 파일에서 .. 2020. 6. 16.
CSS - 19. Media query 1. Media Query media query란 responsive Web을 구현하는 CSS technique이다. 특정 조건에서는 어떤 CSS를 적용하라는 규칙을 줄 수 있다. css에 @media라는 문법으로 작성하게 된다. @media only screen and (max-width: 480px) { body { font-size: 12px; } } 위 코드는 480px보다 작은 화면에서 body 태그 내의 font 크기를 전부 12px로 바꾸는 것이다. 위 코드를 해석해보자면, 1. @media - 이 키워드는 media 쿼리를 시작하겠다는 의미이다. 2. only screen - 어떤 디바이스에서 적용하는지 알려준다. 예를 들면 프린트를 하고 싶을 때 적용하려면 only print라고 작성하면.. 2020. 6. 15.
CSS - 18-2. 레이아웃의 모든 것 1. position 속성 static 요소를 문서 흐름에 맞추어 배치한다. relative 이전 요소에 자연스럽게 연결하여 위치를 지정한다. absolute 원하는 위치를 지정해 배치한다. fixed 지정한 위치에 고정하여 배치한다. sticky 위치에 따라서 동작방식이 달라진다. 요소가 임계점 이전에는 relative와 같이 동작한다. 그 이후에는 fixed와 같이 동작한다. static을 제외한 나머지 속성 값들은 top, right, bottom, left와 같이 어느 위치에 요소를 위치시킬 건지 지정할 수 있다. 각 값들은 그 방향에서 얼마만큼 떨어져 위치시킬 것인지를 나타낸다. (예. top: 10px 이면 기준 위치 위에서 10px 떨어져 위치시키라는 뜻이다.) static static은 p.. 2020. 6. 15.