코딩 일지

■ 부트스트랩(Bootstrap): HTML, CSS, JavaScript 반응형 웹 사이트, 모바일 우선 웹 사이트를 쉽게 작성할 수 있도록 해주는 무료 프레임워크.>> CSS, JS에 사용 ■ 특징1. 반응형 디자인 (Responsive Design) □  PC, 태블릿, 스마트폰에서도 자동으로 화면 크기 조정□ 미디어 쿼리를 직접 작성하지 않아도 된다.2. 다양한 UI 컴포넌트 제공 □  부트스트랩은 이미 디자인된 다양한 요소들을 제공□  버튼, 네비게이션 바, 모달 창, 카드, 폼 요소 등등을 바로 사용할 수 있음3. 그리드 시스템(Grid System) □  12개의 컬럼을 활용해 레이아웃을 손쉽게 구성할 수 있음4. 스타일이 깔끔하고 직관적□  추가적인 CSS 작업 없이도 예쁜 디자인 가능 1..

1. NewFile3.jsp 사과 1000원 바나나 2000원 키위 500원 개 사과 1000원 바나나 2000원 키위 500원 개 단지 HTML 폼의 형태.NewFile4.jsp에서는 한 가지만 선택할 수 있는 radio 속성을 넣었고,NewFile5.jsp에서는 여러 가지를 선택할 수 있는 checkbox 속성을 넣었다.여기서는 사용자가 입력한 후 결제 요청을 보낸다. NewFile4.jsp로 데이터 전송 (product, cnt)NewFile5.jsp로 데이터 전송 (product[], cnt) 개기본 개수는 1개이다. 사과 1000원 바나나 2000원 키위 500원 동일한 name을 설정하면 같은 범위 내에 들어가 저 중 하나만 선택할 수 있게 된다.value는 각각 버튼이 갖는 값...

그냥 개념이 좀 헷갈려서 찾아본 추상 클래스 1. 추상 클래스의 주요 사용 목적 1. 공통적인 기능을 제공하면서, 일부 기능을 하위 클래스에서 강제 구현하도록 할 때: 부모 클래스가 정한 틀을 벗어나지 않도록 함. 코드의 일관성을 유지하고 개발자가 기능을 빼먹지 않도록 막아주는 역할을 한다. 2. 객체를 직접 생성하지 못하도록 막고, 상속을 통해서만 사용하도록 만들 때: new() 사용 불가. 객체 생성은 반드시 하위 클래스에서 상속을 받아서만 가능하다. 왜냐하면 추상 클래스는 설계의 틀을 제공한다는 목적을 갖고있기 때문에 직접 객체를 만들 필요가 없기 때문이다. 하위에서 상속받아서 구체적인 객체를 만들도록 한다. 3. 일반 메서드와 추상 메서드를 같이 사용해야 할 때: 일반 메서드는 모든 하위 클래스에..

서블릿은 Java로 웹 요청(HTTP)을 처리하는 API.원래 자바는 웹 개발과는 거리가 멀었다 (HTTP 요청/응답이 불편) 그때, 서블릿이라는 API가 등장하면서 자바로도 웹 개발을 할 수 있게 되었다. (HTTP 요청이 편해짐)서블릿은 웹 서버에서 동작하며, HTTP 요청을 받아 처리하고, 클라이언트(웹 브라우저)로 응답을 보내는 역할을 한다.서블릿에서 진화한 JSP가 등장했고, 그 이후에 Spring이 등장했다. (서블릿보다 jsp가 편하고 jsp는 서블릿으로 자동 변환된다. 확장자는 .java)  서블릿의 HTTP 요청/응답 과정클라이언트(웹 브라우저)가 요청을 보내면, 웹 서버(Tomcat)가 요청을 서블릿으로 전달하고, 서블릿이 그 요청을 처리한 후, 서블릿이 응답을 생성해서 응답을 보내고,..

자바 스크립트 문법보다 AJAX를 사용하면 코드를 더 간략하게 사용할 수 있다.  jQuery 라이브러리에 있는 $.ajax() 메서드 사용하기. □ $.ajax() == 비동기 처리를 구현할수있게하는 메서드 ■ AJAX : 비동기적으로 데이터를 주고받는 기술. 즉, 페이지를 새로고침하지 않고도 서버와 데이터를 주고 받을 수 있음. □ AJAX는 jQuery가 만든 것이 아니고, 자바스크립트의 원래 기능이다. jQuery는 AJAX를 더 쉽게 사용할 수 있도록 도와주는 라이브러리일 뿐이다. >> AJAX는 자바스크립트의 기본 기능이며, jQuery에 의존하지 않음. $.ajax()를 사용하면 XMLHttpRequest보다 쉽게 AJAX를 사용할 수 있다! 최근에는 JQuery대신 fetch API를 많이..

1. Advanced CSS(CSS3)공식적으로 CSS3 모듈의 표준 규격이 존재하지 않아, 브라우저 벤더들이 독자적으로 자신들의 브라우저에 맞게 기능 구현 -> 벤더 프리픽스(vendor prefix)가 포함된 브라우저별 코드를 모두 나열해야 한다는 불편함 존재브라우저별 벤더 프리픽스를 알고 있어야 하고, 표준 규약은 브라우저별로 나열한 코드 마지막에 작성해 주어야 한다.모두 나열하기 힘들기 때문에 가장 많이 쓰는 브라우저 위주로 쓰도록 하자※ 대표적 벤더 프리픽스-ms-인터넷 익스플로러-o-오페라-moz-파이어폭스-webkit-크롬, 사파리 2. 테두리와 배경에는 border-radius, box-shadow, border-image, background-size 속성, 배경 이미지 중첩 기능 등이 ..

1. 미디어 쿼리 : 미디어 및 화면의 크기에 따라 다른 스타일시트가 적용되도록 지원화면의 크기가 다르면 보이는 내용도 화면 크기에 맞게 보여야 함웹 사이트를 1개만 만들고 화면 크기에 따라 알맞게 자동으로 배치되거나 글자크기나 콘텐츠 크기 등을 자동으로 변환시킬 수 있도록 함 ==> "N스크린 대응"※ 반응형 웹 사이트 : 미디어 쿼리를 이용해 유동형 레이아웃을 구현한 것 사이트.2. 미디어 쿼리 사용법미디어 쿼리는 CSS로 구현된다.작성 순서는 태그에 공통적으로 적용할 내용, 특정 태그에만 적용할 내용, 그리고 마지막으로 미디어 쿼리를 기술함1) 작성 위치 : HTML 파일 속에 태그로 기술하거나, CSS 파일에 추가한다. 외부/내부 모두 여러 화면 크기에 대응해서 여러 개의 미디어 쿼리를 설정해준..

======1일차======MYSQL 설정 mysql은 workbench라는 에디터를 사용 schemas -> DB. 이 안에 테이블들이 존재 드럼통모양 DB생성 그 오른쪽 테이블 생성 가장 오른쪽은 새로고침 가장 왼쪽은 SQL 파일 추가 테이블 옆에 버튼 3개 : 정보 보기, 구조 보기, SQL문.. DB 프로그램마다 함수, 자료형이 조금씩 다르다. 다만, 큰 틀은 같음. sys 데이터는 시스템이 관리하는 데이터. 건들지 마셈 administration : 권한 설정, 서버 상태, 데이터 내보내기 등.. root(관리자)는 모든 권한을 가진다. root가 user를 생성해서 권한을 부여함 시스템 환경 변수 설정하기! > cmd 창을 사용하기 위해서? C:\Program Files\MySQL\MySQL..

1. CSS의 주요 속성과 값1) 색상과 배경 지정■ color 속성, background-color 속성, background-image 속성, background-repeat 속성, background-attachment 속성, background-position 속성, background 속성 등이 있음 2) 폰트 지정■ font-family 속성, font-style 속성, font-variant 속성, font-weight 속성, font-size 속성, font 속성 등이 있음 3) 텍스트 지정■ text-indent 속성, text-align 속성, font-decoration 속성, letter-spacing 속성, word-spacing 속성, text-transform 속성, white..

[ CSS ] : HTML 태그를 화면상에 어떻게 표현할지 설정. 즉, 문서의 내용을 디자인하는 방식을 말한다.>> 브라우저에 표시되는 문서의 형태를 다르게 표현함. 1. CSS 사용 이유: □ CSS를 통해 화면의 크기에 반응하여 자동으로 내용이 최적화되어 보이도록 설정할 수 있다.(=반응형 웹)□ HTML은 웹 페이지의 서식 설정을 위한 태그를 사용하지 않는 것이 좋다.>> CSS 라는 단일 체계에서 서식을 통합적으로 관리하여 체계적인 웹 사이트 개발과 이에 따른 개발 비용 감소를 이끌어내고자 함. 2. CSS 기본 사용 규칙1) 작성 위치 (3가지 방법 존재)(1) 인라인 스타일 시트 : 스타일을 적용할 HTML 파일 태그의 속성에 직접 지정한다. □ 한번에 여러 태그에 효과를 줄 수 없어 비효율..