팀프로젝트 작업중 다른 부분들은 기존에 배운 js로 가능했지만 현재 날짜를 가져와 달력을 만드는 것은 배우지 않았다. 지금 바닐라스크립트로 작성중인 반응형 웹들도 대부분 플러그인으로 쉽게 사용하는 것으로 알고있지만, 단순 불러오는 것이 아닌 알고있는 코드와 메서드들로 달력을 만들어 보고 싶었다. 순수 자바스크립트로 달력을 만드는 것은 검색해 보아도 자료가 많지 않았다. (대부분 제이쿼리 혹은 플러그인) 그 중 한 블로그의 글을 보고 참조하여 만들어 보았다. https://sirius7.tistory.com/35 [Javascript] 자바스크립트를 이용하여 달력 만들기 날짜를 입력하는 웹 사이트를 만들기 위해 먼저 만들어본 달력 다른 라이브러리 등을 사용하지 않고 자바스크립트만 이용해서 만들어 봤다. 날..
🔥 부트캠프-웹 개발 🔥
INSTR CONVERT / CAST ROUND / CEIL / FLOOR / ABS LEAST / GREATEST MAX / MIN / SUM / AVG / COUNT POW / POWER / SQRT TURNCATE md5 NOW() DATE_ADD DATE_FORMAT 1) INSTR 해당 값이 몇 번째에 있는지 알고 싶을 때 사용한다. 2) CONVERT / CAST 자료형을 바꿀 때 사용한다. 3) ROUND / CEIL / FLOOR / ABS ROUND : 반올림 CEIL : 올림 FLOOR : 내림 ABS : 절댓값 4) LEAST / GREATEST LEAST : 가장 작은 값 (MIN : 컬럼) GREATEST : 가장 큰 값 (MAX : 컬럼) 5) MAX / MIN / SUM / A..
DESC DISTINCT NULL 우선순위 데이터 검색 예제 1) DISTINCT table의 필드 구조를 출력할 때 사용한다. 2) DESC 중복을 제거할 때 사용한다. 3) NULL NULL은 =, !=, 가 사용 불가능하다. 따라서 NULL값을 조건으로 하고 싶다면 IS NULL이나 IS NOT NULL을 사용하면 된다. 4) 우선순위 1. () 2. 비교연산자 =, >, =, DESC student; +-----------+-------------+------+-----+---------+----------------+ | Field | Type | Null | Key | Default | Extra | +-----------+-------------+------+-----+---------+--..
정의어 조작어 조건 SELECT WHERE 1) 정의어 CREATE: db 또는 table 생성 CREATE TABLE aaa ( id INT NOT NULL, name CHAR(10) NULL, age INT NULL, addr CHAR(20) ); aaa라는 table 안에 id와 age는 INT형식으로, name과 addr은 CHAR형식으로 저장되게 된다. DROP : db 또는 table을 삭제 DROP TABLE aaa; ALTER : table의 컬럼 수정 ALTER TABLE aaa CHANGE COLUMN id num_id INT; ALTER TABLE aaa CHANGE COLUMN name num_name CHAR(10); ALTER TABLE aaa CHANGE COLUMN age n..
1) 주제 선정 주제 목록 : 대학교, 관공서, 병원, 여행사 주제 선정 : 여행사 메인 사이트 : 제주닷컴 https://www.jeju.com/ 제주여행 No.1, 제주닷컴 실시간 항공, 숙박, 렌터카, 관광지, 단체/MICE, 패키지 등 제주여행의 모든 것! www.jeju.com 참조 사이트 https://www.hanatour.com/ 하나투어 : 꿈꾸는 대로, 펼쳐지다 www.hanatour.com https://www.ybtour.co.kr/ 여행을 가볍게! 노랑풍선 해외패키지, 자유여행, 허니문, 국내여행, 항공권, 실시간 예약 등 각종 여행 정보를 제공하는 직판여행 NO.1 www.ybtour.co.kr http://jejumania.com/ 제주매니아|제주도여행사 jejumania.co..
footer 높이 따라오기 사진 슬라이드 1) footer 높이 따라오기 제목1 제목2 제목3 제목4 제목5 제목1 Lorem ipsum dolor sit amet consectetur adipisicing elit. Minima expedita autem harum officia debitis, ullam sapiente itaque nulla beatae eius molestiae excepturi non repellendus doloremque nam, temporibus consequatur vero. Voluptatibus? 제목1 Lorem ipsum dolor sit amet consectetur adipisicing elit. Minima expedita autem harum officia..
window.height / width window.open location window.scrollY window.scrollTo header fixed 1) window.height / width 웹 페이지의 높이와 가로의 px을 출력할 수 있다. 2) window.open window.open을 사용하면 새로운 웹 페이지가 열리게 된다. ('주소', '이름', '옵션') 3초 뒤에 열리는 구글 창은 가로 300, 세로 300 크기로 열리게 된다. 3) location window.open은 새로운 페이지가 열리고 반면 location은 현제 페이지가 바뀌게 된다. 4) scrollY window.scrollY는 현재 열려있는 페이지의 가장 윗부분이 몇 px인지 나타내 준다. 5) scrollTo w..
상품리스트 상품 : 뽀로로 담기 삭제 상품 : 악어 담기 삭제 상품 : 펭구 담기 삭제 상품 : 루피 담기 삭제 상품 : 누렁이 담기 삭제 상품 : 곰 담기 삭제 장바구니 장바구니 비우기 상품리스트로 const get = (target) => { return document.querySelector(target) } const getAll = (target) => { return document.querySelectorAll(target) } // 재할당 함수 const re = () => { $l_li = getAll('.left ul li'); $r_li = getAll('.right ul li'); $add = getAll('.left ul li .add'); $del = getAll('.left ..