공부하는 디자이너

※ 정보처리기사 실기 대비 정리입니다. 개인적인 정리용도라 자세한 설명이 부족할 수도 있습니다. 1. SQL은 아래 3가지로 구성되어 있다. 총 2개 글로 나누어서 정리할 예정. 정의 (DDL: Data Definition Languae) 조작 (DML: Data Manipulation Languae) 제어 (DCL: Data Control Language) + TCL(Transaction Control Languae) 2. SQL은 대소문자를 구분하지 않는다. 그러나 예약어는 대문자로 작성하는 것이 좋다. (실제로는 MS-SQL이냐 오라클이냐에 따라 세부 문법이 다르다. 여기서는 일반적인 문법만 다룬다.) DDL이란? DDL은 테이블과 뷰 등을 생성하고 수정, 삭제한다. 데이터가 지켜야 할 제약조건도 ..

The Complete CSS Flex Box Tutorial Much like CSS Grid (my other Medium tutorial) Flex Box is quite complex because it consists of not one but two element types: The container… medium.com Flex Box에 대한 총정리 글을 발견했다. 글 하나에 한눈에 볼 수 있도록 깔끔하게 정리가 되어 있어서 시중에 나와있는 CSS 책보다 이 글이 훨씬 낫다. 예전에는 반응형페이지를 만들 때 float와 퍼센트 margin 값을 브레이크 포인트마다 조정해야 했는데, flex는 화면크기에 적응해서 스스로 크기와 위치를 조정할 수 있기 때문에 간단하고 유용하다. 아니 간단하다고는..

JSON(Javascript Object Notion)은 Javascript 객체 문법을 따르는 문자 기반 데이터 형식이다. 언어 종류에 상관없이 데이터를 제어하기 위해 만든 표준 규약 같은 것이다. 서버단과 클라이언트단에서 데이터 통신을 할 때 번거로움을 대폭 줄여주어 XML의 강력한 대체자로 급부상했다. 참고로 한국에서는 "제이슨"이라고 읽고 영어권에서는 "제이썬"이라고 읽는다. [관련문서] https://www.json.org/json-ko.html https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/JSON 1. JSON의 자료형식 String Number Obejct Array Boolean - true, false Null ※ Jav..

1. 심플한 오버레이 슬라이더 ▶[강의영상] 바닐라 자바스크립트로 "캐러셀 슬라이더" 만들기 (Vanilla JS : making Carousel slider) 화면전환에 중점을 둔 기본 형태이다. 방향 화살표나 페이징 기능은 없지만 안에 이미지나 컨텐츠를 풍부하게 넣으면 꽤 쓸만한 캐러셀이 될 것 같다. 또는 원페이지 디자인에서 백그라운드 요소로 활용해도 좋을 것 같다. 1) HTML & CSS 1 2 3 4 5 2) Javascript const SHOWING_CLASS = "showing"; const firstSlide = document.querySelector(".slider__item:first-child"); function slide(){ const currentSlide = docume..

jQuery를 이용한 Modal 을 제작해보았다. "보여진다", "감춘다" 두 가지 직관적인 기능만 구현하면 되기 때문에 jQuery 문법만 구조만 이해하면 쉽게 작성할 수가 있다. Modal은 활용도가 높기 때문에 꼭 익혀두길 추천한다. 1) HTML 레이어팝업입니다. 레이어팝업입니다. 레이어팝업입니다. 레이어팝업입니다. Close Modal 예시입니다 팝업창 열기 는 Modal 창이 떴을 때 배경을 블라인드처럼 어둡게 처리하는 역할을 하는 블록이다. 2) jQuery : Modal 기능 $(document).ready(function(){ $modal = $(".modal"); $(".modal--open").click(function(){ $modal.show(); return false; }); ..