1. 깃허브에서 폰트 파일을 다운받아 작업 폴더에 넣어준다. https://github.com/innks/NanumSquareRound GitHub - innks/NanumSquareRound: 나눔스퀘어라운드 웹폰트입니다. NanumSquareRound webfont. 나눔스퀘어라운드 웹폰트입니다. NanumSquareRound webfont. Contribute to innks/NanumSquareRound development by creating an account on GitHub. github.com 2. 다운받은 파일 안의 nanumsquareround.css를 열어보면 아래와 같은 내용이 작성되어 있다. /* 나눔스퀘어라운드 웹폰트 v1.11 https://github.com/innks/N..

Bootstrap과 JavaScript 플러그인을 이용하여 클릭할 때마다 하단 컨텐츠 내용이 바뀌는 동적 탭메뉴를 구현하였다. 해당 모듈의 코드는 두 가지 부분으로 나눌 수 있다. Menu1 Menu2 Menu3 1) 첫번째 부분은 과 태그를 이용하여 nav의 구조를 만들어주는 부분이다. 부모 태그인 ul에 "nav nav-pills" 를, 자식 태그인 li에 "nav-item"을 작성하여 구조를 만든 뒤, 각 nav-item 안에 앵커 태그를 작성하여 각각 클릭 시 별도의 id를 가진 요소를 노출하도록 하였다. 오늘의 세트메뉴1 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labo..

먼저 html에 canvas 태그 작성해주고, 자바스크립트에서 getElementById로 canvas 태그 읽어준 뒤 canvas 변수에 getContext() 함수 사용하고, "2d" argument 주었다. const canvas = document.getElementById("jsCanvas"); const ctx = canvas.getContext("2d"); boolean 자료형의 painting 변수를 false값으로 선언해준 후, painting이 true가 되면 (onMouseDown함수 실행 === !painting ) canvas API에서 데려온 beginlPath()와 moveTo(x,y)를 실행한다. painting이 다시 false가 되면 (onMouseUp함수 실행) line..

부트스트랩으로 드롭다운 메뉴 구현! 뭔가 느낌있는 박스가 완성되었다. 부트스트랩을 이용하는 방법은 공식 문서에서 부트스트랩 stylesheet 링크를 복사하여 헤더에 넣어주는 것이다. 또 문서에서 jQuery library, Popper JS, bootstrap.js, 통합 js 번들도 데려올 수 있다. Dropdown button html css javascript bootstrap jsp/a>

Spread operator는 ES6에서 도입된 문법으로 array의 내용을 효과적으로 spread할 수 있다. 변수 앞에 '...'를 작성하여 spread 문법을 이용한다. spread 문법을 사용하여 기존 변수나 객체가 가지고 있는 값을 변경하지 않고도 추가적인 값을 넣어줄 수 있다. const lion = { name : 'lion', // key : value로 오브젝트 생성 size : 'big', isAggresive : true, weight : 200 } // spread 문법 사용하여 lion 변수가 포함된 새로운 변수를 생성 const animals = [ { ...lion, }, { name : 'cat', size : 'big', isAggresive : true, weight : ..

함수는 일련의 과정을 문(statement)으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것이다. 프로그래밍 언어의 함수도 입력을 받아서 출력을 내보낸다. 이때 함수 내부로 입력을 전달받는 변수를 매개변수(parameter), 입력을 인수(argument), 출력을 반환값(return value)이라 한다. 함수는 값이며, 여러 개 존재할 수 있으므로 특정 함수를 구별하기 위해 식별자인 함수 이름을 사용할 수 있다. 자바스크립트에서는 함수를 "일급 객체"로 분류한다. 일급 객체란 변수에 저장될 수 있는 모든 요소를 총칭하는 단어이고 아래와 함수를 변수에 저장해서 사용할 수 있다. ** 일급 객체 ** let foo = function() { return 1; } 1. 파라미터가 여럿인 경..