전체 글

    [Bootstrap] #1 부트스트랩이란?

    1. 부트스트랩(Bootstrap)의 TMI 과거에 스마트폰이 생겨나고 그에 필요한 화면이 필요했을 때, 많은 사이트들은 데스크탑용, 그리고 모바일용의 사이트를 따로 제작을 했었다. 그러다가 모바일로 사이트에 접속하는 비율이 압도적으로 늘어나면서 사이트의 방향에 따라 사람들은 데스크탑용 사이트를 포기하는 시점까지 이르렀다. 포맷에 따라 구현해야하는 환경이 너무나 다른 이 웹 디자인의 한계를 해결하기 위해 등장한 것이 바로 부트스트랩이다. 부트스트랩은 트위터의 개발자와 UI 디자니어가 개발한 프레임워크이다. 트위터에서 사용하는 각종 레이아웃, 버튼, 입력창 등의 디자인을 CSS와 Javascript로 만들어 놓은 것이다. 웹 디자인너나 개발자 사이에서는 웹 디자인의 혁명이라고 불릴 정도로 폭발적인 반응을 ..

    [jQuery] #11 Ajax 알아보기

    1. Ajax(asynchronous Javascript and XML) Ajax란 Asynchronous Javascript And XML 의 줄임말이다. 자바스크립트를 이용하여 비동기식으로 서버와 통신할 수 있도록 돕는 것이며 비동기통신이기 때문에 서버에 요청이 가더라도 화면의 깜빡 거림이나 화면이 이동 된다는 느낌을 주지 않고 상당히 자연스럽고 빠르게 클라이언트의 화면을 변화 시켜줄 수 있다. 최근에는 XML형식이 아닌 JSON형식을 더 많이 사용하고 있다. Ajax는 한 페이지를 유지하면서 내용을 실시간으로 바꿔주는 기능을 구현할 수 있다(한개의 페이지에서 요청과 응답이 동시에 이루어짐). 즉, 전체 페이지를 요청하지 않고 내가 원하는 페이지만 요청을 시킨다(댓글 더보기를 눌러도 전체 페이지가 새..

    [jQuery] #10 offset()과 position()

    1. 위치값 제이쿼리에서 선택된 객체의 위치값을 설정해주는 함수는 두 가지 종류가 있다. 브라우저를 기준으로 할 때는 offset(), 포지셔닝 컨텍스트()를 기준으로 할 때는 position()이 있다. 더 쉽게 표현하자면 offset은 절대좌표값을, position은 상대좌표값을 리턴한다. offset은 페이지의 상단으로부터 선택된 요소가 보이는 현재 위치값을 설정, 리턴을 한다. position은 선택한 요소가 속해있는 부모 요소를 기준으로 떨어져있는 위치값을 설정, 리턴한다. 이 두 메서드의 리턴 자료형은 객체인 top, left의 값이 반환이 된다. 아래의 두 상자를 보자. 파랑 상자를 클릭할 때마다 값이 출력된다. 이 때 브라우저의 크기에 따라 offset의 값은 바뀌지만 position의 값..

    [JS] 날짜 데이터 자동 생성하기

    결과물 : HTML 삽입 미리보기할 수 없는 소스 코드 날짜 데이터 자동 생성 생년월일 : 년 월 일

    [JS] moment.js - JavaScript 날짜 관련 라이브러리

    1. Moment.js moment.js는 자바스크립트에서 날짜와 관련된 작업을 할 수 있게 모아둔 라이브러리이다. 자바스크립트의 내장 객체인 Date()의 복잡성을 단순화하고, 다양하게 사용할 수 있도록 만들어둔 라이브러리다. 다운로드는 아래 사이트에서 할 수 있다. https://momentjs.com/ Moment.js | Home Format Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format("MMM Do YY"); moment().format('YYYY [escaped] YYYY'); moment().format(); Relative Time moment("20111031", "YYY..