부스트코스 웹 프로그래밍(풀스택)

웹 프로그래밍 기초프로젝트 A-1.홈페이지BE프로젝트 A-2.홈페이지FEDB 연결 웹 앱프로젝트 B-1.TO-DO_BE프로젝트 B-2.TO-DO_FE웹 앱 개발: 예약서비스 1/4프로젝트 C-1.예약:메인:BE프로젝트 C-2.예약:메인:FE웹 앱 개발: 예약서비스 2/

저급언어는 2진수로 이루어진 기계어이다.2진수를 사용하는 이유는 전기의 연결, 연결해제로 1과 0을 표현할 수 있기 때문이다.숫자로만 이루어진 언어는 사용과 유지보수가 상당히 어렵기 때문에 숫자와 대응하는 기호를 만들고, 그 기호로 프로그래밍을 하게 되었다.기호로 작성

인터넷은 WWW(world wide web)이 아니다. www는 인터넷 기반 대표 서비스 중에 하나이다.인터넷은 TCP/IP 기반의 네트워크가 전세계적으로 확대되어 하나로 연결된 테크워크들의 네크워크, 즉 네트워크의 결합체이다.HTTP는 서버와 클라이언트가 인터넷 상에

웹 프론트엔드 사용자에게 웹을 통해 다양한 콘텐츠를 제공한다. 사용자의 요청에 반응해서 동작한다. 역할 웹 콘텐츠를 잘 보여주기위해 구조를 만들어야한다. - html 적절한 배치와 일관된 디자인을 제공해야한다. - css 사용자 요청을 잘 반영해야한다. - js 백엔

브라우저는 월드와이드웹(www)에서 정보를 검색, 표현하고 탐색하기 위한 소프트웨어이다.인터넷에서 특정 정보로 이동할 수 있는 주소 입력 창이 있고 서버와 HTTP로 정보를 주고 받을 수 있는 네트워크 모듈도 포함하고 있다.서버에서 받은 문서(HTML, CSS, JS)

웹 서버는 소프트웨어를 보통 말하지만, 웹 서버 소프트웨어가 동작하는 컴퓨터를 말한다.웹 서버의 가장 중요한 기능은 클라이언트가 요청하는 HTML 문서나 각종 리소스를 전달하는 것이다.웹 브라우저나 웹 크롤러가 요청하는 리소스는 컴퓨터에 저장된 정적(static)인 데

클라이언트는 서비스를 제공하는 서버에게 정보를 요청하여 응답받은 결과를 사용한다.다수의 사용자가 데이터베이스 내의 데이터에 접근할 수 있도록 해주는 소프트웨어이다.DBMS 등장 이전에는 개발자들이 파일의 데이터를 저장하고 읽어들이는 등의 기능을 모두 구현해야했었다.DB

종류링크 : a 태그 사용이미지 : img 태그 사용목록 : ul/li 태그 사용문단 : p 태그 사용제목 : h 태그 사용그 외에도 div 태그 등 다양한 태그가 존재한다.태그들을 모두 외울 필요는 없으며, 필요한 태그를 찾아서 적절한 의미에 맞는 태그를 사용하는 것

레이아웃이란 배치라는 뜻으로, HTML 태그로 감싸진 화면상의 어느 위치에 어떻게 자리 잡을지를 결정하는 것을 말한다.웹에서느 div에 클래스명으로 주는 방식으로 많이 사용하고, 모바일에서는 보통 태그명으로 구분지어서 사용한다.검색이 더 잘되고, 가독성 있는 코드를 위

현업에서는 presentation 문서 형태의 기획서나 디자인 파일을 받아서 그것을 기반으로 HTML 개발을 시작한다. 즉, 어떤 화면을 보면서 그대로 구현하는 것이다.먼저 영역을 나눠서 상단/본문/네비게이션 이런 식으로 큰 부분부터 분리한다. 그 뒤에 각 영역 안에

고유한 속성으로 한 HTML 문서에 하나만 사용가능하다. 하지만 중복으로 사용하더라도 문제가 발생하지는 않는다. 개발자가 의식적으로 사용해야한다.고유한 ID 값이 있으면 하나하나에 특별한 제어를 할 수 있으며 검색에도 용이하다.하나의 HTML 문서 안에 중복해서 사용

span : selector(선택자)color: propertyred : valueinlinehtml 태그 안에 적용한다.다른 css 파일에 적용한 것보다 우선순위가 높다.internalhtml 파일 head 태그 안에 style 태그로 지정한다.별도의 css 파일을

상위에서 적용한 스타일은 하위에도 반영된다. ex) 부모 태그에 color를 주면 자식 태그들에게도 적용됨.box-model이라고 불리는 속성들(width, height, margin, padding, border)과 같이 크기와 배치 관련된 속성들은 하위엘리먼트로 상

HTMl의 요소를 tag, id, html태그 속성 등을 통해 쉽게 찾아주는 방법이다.기본 선택자tag로 지정하기 : 태그명id로 지정하기 : - class로 지정하기 : .class명id, class요소 선택자와 함께 활용여러개 선택(,) : 여러 선택자에게 한번

color: red;color: rgba(255, 0, 0, 0.5); 끝에 a는 글자의 투명도를 지정한다.color: - font-size: 16px; 보통 16px이 기본값font-size: 1em; 기본값 대비 배율을 지정한다. 부모 태그로부터 폰트 크기를 상속받

엘리먼트를 화면에 배치하는 것을 layout 작업이라고도 하고, Rendering 과정이라고도 한다. display 값을 어떻게 주냐에 따라 위아래로 배치하거나 좌우로 배치할 수 있다.display: block - 벽돌을 쌓는 것처럼 위에서 아래로 배치된다.displa

개발자 도구로 코드를 수정하면 즉각적으로 결과를 볼 수 있다. 원래의 소스코드에는 영향을 주지않는다.css style을 인라인 형태로 수정하면 우선순위가 높기 때문에 빠르게 테스트가 가능하다.

Java Virture Machine자바에서는 소스코드가 컴파일 코드로 변환한 후 JVM이 바이트 코드를 기계어로 변환하는 작업을 한다. 작성된 자바 파일이 운영체제와 상관없이 작동하게 하기위해 고안되었다.운영체제마다 이해할 수 있는 언어의 형태가 다르며, 운영체제마다

자바로 작성된 프로그램을 실행하려면 JRE만 설치하면 됩니다. 이때는 환경변수를 설정할 필요가 없습니다.그런데, JDK를 설치할 때는 환경변수를 설정해야 합니다. 환경변수를 설정하는 이유가 무엇일까요?실행할 파일이 있는 해당 폴더가 아닌 어떤 곳이더라도 접근이 가능하게

프로젝트 : 첫 문자를 비롯해 모든 단어는 대문자로 시작하는 것을 권장 ex)HelloWorld패키지 : 모두 소문자로 사용하는 것을 권장클래스 : 첫 문자를 비롯해 모든 단어는 대문자로 시작하는 것을 권장

웹 사이트는 정보 제공의 목적을 가지고있다. 뉴스사이트와 같이 사용자와의 상호작용보다는 오로지 정보 그 자체를 전달하려는 성질을 지닌다. 웹 어플리케이션은 사용자와 상호작용한다. 사용자가 동영상을 올리거나 댓글을 다는 등의 기능을 가진 블로그, 페이스북, 유튜뷰 등 현

web.xml 파일을 사용하지 않는다자바 어노테이션(annotation)을 사용한다. 해당 코드로 url을 수정할 수 있다.앞에서 실습했던 first web에서 사용한다servlet을 등록할 때 web.xml 파일에 등록한다.servlet-mapping에 있는 url-

WAS는 서블릿 요청을 받으면 해당 서블릿이 메모리에 있는지 확인한다.if (메모리에 없음) {해당 클래스를 메모리에 올림. 객체가 생성되므로 생성자 호출init() 메소드를 실행}service() 메소드를 실행WAS가 종료되거나, 웹 어플리케이션이 새롭게 갱신될 경우

WAS는 웹브라우저로부터 Servlet 요청을 받으면 HttpServletRequest, HttpServletResponse 객체를 생성한다.생성된 두 객체를 서블릿에게 전달한다.http 프로토콜의 request 정보를 서블릿에게 절달하기 위한 목적으로 사용한다.헤더정

4) Request, Response 객체 이해하기

\--

자바스크립트 버전은 ECMAScript(줄여서 ES)의 버전에 따라 결정되고, 이를 자바스크립트 실행 엔진이 반영한다.ES5, ES6... 이런식으로 버전을 명명한다.ES6은 ES5 문법을 포함해서 하위 호환성 문제가 없다.다만, feature 별로 지원하지 않는 브라

if, else if, else를 통해서 다양한 비교문이 사용 가능하다.if문 말고도 switch문으로 비교문을 구현할 수 있다.expression과 case 값과 비교하여 같은 값이 있는 case부터 아래로 실행된다. break 문이 있으면 그 이후 코드는 실행되지

함수 선언식 : function 함수명(매개변수) {//내용} 형태이다.함수 표현식 : var 변수명 = function() {//내용} 형태이다.함수는 매개변수와 인자의 개수가 서로 달라도 에러가 발생하지 않는다.함수 선언식 구문 이전에 함수를 호출하면 해당 함수는

제일 먼저 anonymous가 호출스택에 기본적으로 쌓이고 console.log(bar(6))이 위로 쌓인다. 그다음 bar(6)이 쌓이고 bar y = 3이 실행된 후 foo(x\*y)가 쌓인다. foo 함수가 실행이 끝나면 호출스택에서 나간다. 다른 쌓여있는 함수들

window는 전역 객체여서 생략 가능하다.setTimeout 함수는 인자로 함수를 받고 있으며, 보통 나중에 실행되는 함수를 콜백함수라고 한다.setTimeout의 실행은 비동기이기 때문에 동기적인 다른 실행, 즉 호출 스택이 비워진 후에 실행된다.스택이 비워진 후에

브라우저는 HTML 코드를 DOM(Document Object Model)이라는 객체 형태의 모델로 저장한다.해당 형태로 저장된 정보를 DOM Tree라고 한다.해당 id를 가지고 있는 요소를 찾을 수 있다.document.getElementById('id 명');ge

브라우저에는 화면의 크기를 마우스로 조절하거나, 스크롤 하거나, 마우스를 이동하거나 등 다양한 이벤트가 발생한다.그리고 해당 이벤트가 발생하면 어떤 일을 하라고 할 일을 등록할 수 있다.addEventListener 함수를 사용해서 할 일을 등록할 수 있다.위의 식에서

이 기술은 웹에 데이터를 갱신할 때 새로고침 없이 서버로부터 데이터를 받기위해 개발되었다.Ajax 통신으로는 xml, Plain Text, JSON 등 다양한 포맷의 데이터를 주고받을 수 있지만, 일반적으로 사용이 편리한 JSON 포맷으로 데이터를 주고 받는다.XMLH

자바스크립트는 실행단계(런타임)에서 버그가 발견된다.디버깅 도구를 사용하면 에러의 원인을 쉽게 분석할 수 있다.Pause, Continue : 첫번재 버튼은 평소에는 Pause 버튼 상태인데, break 포인트가 잡힌 상태에서는 Continue버튼이 된다. 다른 bre

html 안에 자바언어로 프로그램을 실행시킬 수 있다.1998년 마이크로소프트에서 ASP라는 쉽게 웹을 개발할 수 있는 스크립트 엔진을 발표한 후 이에 대항하기위해 개발되었다.서블릿에 직접 코드를 작성하려면 PrintWriter 객체를 생성하고 html을 문자열 형태로

브라우저가 웹서버에 JSP에 대한 요청 정보를 전달한다.브라우저가 요청한 JSP가 최초로 요청했을 경우만 1) JSP로 작성된 코드가 서블릿으로 코드를 변환한다.(java 파일 생성)2) 코드가 변경될 경우 다시한번 변환 과정을 거친다.3) 서블릿 코드를 컴파일해서 실

사용 방법 : <%! 내용 %>전역변수 선언 및 메소드 선언에 사용. 서블릿 service 외로 포함된다.사용 방법 : <% 내용 %>가장 일반적으로 많이 쓰이는 스크립트 요소주로 프로그래밍 로직을 기술할 때 사용스크립트릿에서 선언된 변수는 지역변수. 서블릿

\_jspservice()에 삽입된 코드의 윗부분에는 미리 선언된 객체들이 있으며, 해당 객체는 jsp에서 사용 가능하다.response, request, application 등과 같은 변수를 내장객체라고 한다.

리다이렉트는 HTTP 프로토콜로 정해진 규칙이다.서버는 클라이언트의 요청에 대해 특정 URL로 이동을 요청할 수 있다. 이를 리다이렉트라고 한다.서버는 클라이언트에게 HTTP 상태코드 302로 응답하는데, 이때 헤더 내 Location 값에 이동할 URL을 추가한다.

forwardWAS의 서블릿이나 JSP가 요청을 받은 후 그 요청을 처리하다가, 추가적인 처리를 같은 웹어플리케이션 안에 포함된 다른 서블릿이나 JSP에게 위임할 수 있다. 이를 포워드라고 한다.리다이렉트와 다르게 request와 response 객체는 한번 생성된다.

서블릿은 로직을 구현하기에 알맞지만, HTML을 출력하기엔 불편하다. JSP는 로직을 구현하는 것은 불편하지만, HTMl을 출력하기엔 편리하다. 프로그램 로직은 Servlet에서 수행되고, 그 결과를 JSP에게 포워딩하고 출력한다면 장점을 극대화 할 수 있다. 이를 s

Applicatin : 웹 어플리케이션이 시작되고 종료될 때까지 변수가 유지되는 경우 사용Session : 웹 브라우저 별로 변수가 관리되는 경우 사용Request : http요청을 WAS가 받아서 웹 브라우저에게 응답할 때까지 변수가 유지되는 경우 사용Page : 페

지역변수가 중괄호 내에서만 사용 가능한 것처럼, page scope은 페이지 내에서만 사용 가능하다.PageContext 추상 클래스를 사용한다.JSP 페이지에서 pageContext라는 내장 객체로 사용 가능하다.forward가 될 경우 해당 Page scope에 지

http 요청을 WAS가 받아서 웹 브라우저에게 응답할 때까지 변수값을 유지하고자 할 경우 사용한다.HttpServletRequest 객체를 사용한다.JSP에서는 request 내장 변수를 사용한다.값을 저장할 때는 request객체의 setAttribute()메소드를

웹 브라우저별로 변수를 관리하고자 할 경우 사용한다.웹 브라우저간의 탭 간에는 세션정보가 공유되기 때문에, 각각의 탭에서는 같은 세션정보를 사용할 수 있다.HttpSession 인터페이스를 구현한 객체를 사용한다.JSP에서는 session 내장 변수를 사용한다.서블릿에

각각의 프로젝트가 웹 어플리케이션을 의미하며, 이들이 모여 서버를 구성한다. application scope는 웹 어플리케이션이 시작되고 종료될 때까지 사용할 수 있다.ServletContext 인터페이스를 구현한 객체를 사용한다.jsp에서는 application 내장

표현언어(EL)는 값을 표현하는데 사용되는 스크립트 언어로서 JSP의 기본 문법을 보완하는 역할을 한다.JSP의 스코프에 맞는 속성 사용집합 객체에 대한 접근 방법 제공수치 연산, 관계 연산, 논리 연산자 제공자바 클래스 메소드 호출 기능 제공표현 언어만의 기본 객체

JSP 안에 자바코드와 HTML 코드가 섞여있다면 프론트 개발자가 어려움을 느끼기 때문에 이를 해결하기 위해 등장했다.JSP 페이지에서 조건문 처리, 반복문 처리 등을 html tag 형태로 작성할 수 있다.이전에 배운 EL과 연동하면 강력하게 사용할 수 있다.http

데이터의 집합이다.(a set of Data)여러 응용 시스템(프로그램)들의 통합된 정보들을 저장하여 운영할 수 있는 공용 데이터의 집합효율적으로 저장, 검색, 갱신할 수 있도록 데이터 집합들끼리 연관시키고 조직화되어야한다.실시간 접근성(Real-time Accessa

SQL은 데이터를 보다 쉽게 검색하고 추가, 삭제, 수정 같은 조작을 할 수 있도록 고안된 컴퓨터 언어이다.관계형 데이터베이스에서 데이터를 조작하고 쿼리하는 표준 수단이다.DML(Data Manipulation language) : 데이터를 조작하기 위해 사용한다.IN

데이터 조작어는 모두 동사로 시작한다.SELECT : 검색INSERT : 등록UPDATE : 수정DELETE : 삭제칼럼명 대신 \*을 입력하면 해당 테이블의 모든 열을 출력할 수 있다.칼럼이 여러개일 경우 ,로 구분한다.ALIAS은 칼럼명과 공백으로 구분하며, 별칭,

테이블에 데이터를 삽입할 수 있다.필드명을 지정해주는 당식은 디폴트 값이 세팅되는 필드는 생략할 수 있다.필드명을 지정해주는 방식은 추후 필드가 추가/변경/수정 되는 변경에 유연하게 대처 가능하다.필드명을 생략했을 경우 모든 필드 값을 반드시 입력해야 한다.조건식을 통

데이터 형 외에도 속성값의 빈 값 허용 여부는 NULL 또는 NOT NULL로 설정DEFAULT 키워드와 합께 입력하지 않았을 때의 초기값을 지정입력하지 않고 자동으로 1씩 증가하는 번호를 위한 AUTO_INCREMENTPRIMARY KEY를 필드명 같은 라인에 줄 수

지금까지 애플리케이션을 개발하기위해 반복적으로 진행해왔던 작업들을 지원하기 위해 등장한 도구이다.빌드, 패키징, 문서화, 테스트와 테스트 리포팅, git, 의존성 관리, svn 등과 같은 형상관리서버와 연동(SCMs) 배포 등의 작업을 손쉽게 할 수 있다.Maven을

자바를 이용한 데이터베이스 접속과 SQL 문장의 실행, 그리고 실행 결과로 얻어진 데이터의 핸들링을 제공하는 방법과 절차에 관한 규약자바 프로그램 내에서 SQL문을 실행하기 위한 자바 APISQL과 프로그래밍 언어의 통합 접근 중 한 형태자바는 표준 인터페이스인 JDB

jdk 1.8 버전 사용을 위해 아래 코드를 추가한다.드라이버 사용을 위해 아래 코드를 추가한다. 강의 코드는 에러가 발생해서 8.0.26 버전 코드로 사용했다.maven update를 수행한다.데이터베이스에 있는 데이터 조회, 수정, 삭제 등의 작업을 할 수 있는 객

구현 방식을 모르더라도 응용 프로그램에서 사용할 수 있도록, 운영체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스를 뜻한다.내가 필요한 자원을 어디선가 제공하고 있다면, 우리는 그 자원을 가져온 후 다루는 방법만 알면 된다.자원을 주고받는 방법이

GET /members/del/1 (x) - 동사로 삭제를 표현하면 안된다. 다른 명령도 마찬가지이다.DELETE /members/1 (0)URI 마지막 문자에는 슬래시를 포함하지 않는다.하이픈(-)은 URI 가독성을 높일 때 사용언더바(\_)는 사용하지 않는다.URI

개발 환경 준비 1. Maven 프로젝트 생성 1) maven-archetype-webapp로 선택 후 next 클릭 2) Group Id와 Artifact id 입력 2. pom.xml 수정 1) JDK 1.8버전을 사용하기 위해 해당 코드 입력 2) 웹 ap

2) RestController를 이용하여 web api작성하기

자바스크립트에서 데이터를 보관하고 조작하는 방법은 배열과 객체를 다루는 것이다.배열은 가장 많이 사용되는 자료구조이다.new Array() 문으로 선언할 수 있지만, 보통은 간단히 '\[]'을 사용한다.배열의 length 속성으로 그 길이를 쉽게 알 수 있다.배열의 원

자바스크립트 객체는 key와 value로 이루어진 dictionary 자료구조이다.key, value 구조의 자료구조이다.javascript로 데이터를 표현하기 위해서는 Array, Object를 사용한다.Object형태는 {}로 그 자료를 표현하며, 서버와 클라이언트

document. 으로 사용할 수 있는 APIselement. 으로 사용할 수 있는 APIstagName : 엘리먼트의 태그명 반환textContent : 노드의 텍스트 내용을 설정하거나 반환nodeType : 노드의 노드 유형을 숫자로 반환childNodes : 엘리

addEventListener 함수는 비동기로 실행되며, 이벤트큐에 보관되다가 load 이벤트가 발생하면(서버로부터 데이터를 브라우저가 받으면) call stack이 비어있을 때 stack에 올라와서 실행된다.서버로부터 받아온 JSON 데이터는 문자열 형태이므로 자바스

웹 개발을 하다보면 Ajax와 같은 요청 처리에 대해 문제가 생길 수 있다.Ajax 통신에서 로직이 문제인지, 서버쪽의 문제인지 등 소스코드상으로 디버깅 할 수 없는 부분은 네트워크 통신과정에서 확인할 수 있다.녹화 기능을 통해 HTML, CSS, JS, image 파

애니메이션은 반복적인 움직임의 처리이다.간단하고 규칙적인 것은 CSS의 transition과 transform 속성으로, 세밀한 조작이 필요한 것은 Javascript로 구현한다.css가 자바스크립트보다 더 빠르며, 모바일 웹에서는 훨씬 빠르다.fram per seco

setTimeout이나 setInterval을 사용한 연속적인 함수 호출은 약간의 delay가 발생하는 문제가 있다.그 대안으로 requestAnimationFrame 메서드가 있다.재귀호출 방식이며, 특정 조건이 될 때까지(함수의 탈출 조건) 함수가 실행된다.

css 기법으로 애니메이션 구현 transition을 이용하여 즉시 변화하는 것에서 자연스럽게 변화하게 할 수 있다. https://thoughtbot.com/blog/transitions-and-transforms Javascript보다 빠르며, 특히 모바일 웹에서

서버를 개발할 때 JavaScript나 css 코드가 많아지면 관리하기 어려워진다.이럴 때 JS, CSS을 위한 파일을 따로 만든 후 html에 추가하는 방식이 관리하기 용이하다.간단한 내용이라면 한 페이지에 모두 표현해도 좋다. 그렇지 않다면 의미에 맞게 구분하는 방

크롬 개발자 도구의 Network panel을 열면 하단에 DOMConentLoaded와 load를 확인할 수 있다. DOMConentLoaded가 더 빠르다. DOM Tree 분석이 끝나면 DOMConentLoaded 이벤트가 발생하며, 그 외 모든 자원(이미지 등)

ul > li\*7 > img 구조for문과 addEventListener를 사용하면 각각의 책 리스트에 클릭 이벤트를 등록할 수 있다.list가 훨씬 많다면 브라우저는 기억해야할 이벤트 리스너도 그만큼 많아진다.또한 list가 동적으로 추가된다면 해당 list에도 이

위의 상품 리스트 데이터를 Ajax로 JSON 형태의 데이터를 받아와서 화면에 추가해야하는 상황이라고 가정해보자리스트의 구성은 유사하기 때문에 사용하는 tag 역시 비슷할 것이다. 이 때 templating이라는 개념을 도입하면 좋다반복적인 HTML 부분을 templa

var html = "<li><h4>{title}</h4><p>{content}</p><div>{price}</div></li>";위와 같은 html 문자열을 어딘가에 보관해야한다. javascript 코드 안에 이런 정적인

엔터프라이즈급 어플리케이션을 구축할 수 있는 가벼운 솔루션이자, 원-스탑-숍(여러 요구사항 충족 가능)이다. 원하는 부분만 가져다 사용할 수 있도록 모듈화가 잘 되어있다.IoC 컨테이너이다.Inversion of control : 제어의 주체가 뒤바뀜. 이전까지는 개발

컨테이너는 인스턴스의 생명 주기를 관리하며, 생성된 인스턴스에게 추가적인 기능을 제공한다.예컨대, servlet을 실행해주는 WAS는 Servlet 컨테이너를 가지고 있다고 말한다. 개발자가 서블릿 클래스만 작성하면, WAS는 웹 브라우저로부터 서블릿 URL에 해당되는

maven-archetype-quickstartgroup id, artifact id는 패키지가 될 것이기 때문에 소문자로 지정한다.artifact Id는 실제 프로젝트 이름을 기입한다.테스트가 성공하면 성공했다는 메세지와 함께 녹색 막대가 보여진다.나중에 따로 공부해

Car와 Engime이라는 두개의 클래스를 생성한다.spring을 사용하지 않는다면 우리는 Engine와 Car 클래스를 구현하고 new를 사용하여 객체를 생성한 후에야 해당 인스턴스를 사용할 수 있다.spring ioc 컨테이너가 이 역할을 해줄 수 있고 그러기 위해

@Configuration : 스프링 설정 클래스를 선언하는 어노테이션@Bean : bean을 정의하는 어노테이션@ComponentScan : @Controller, @Service, @Repository, @Component 어노테이션이 붙은 클래스를 찾아 컨테이너에

JDBC를 이용해서 프로그래밍을 하면 반복적인 코드가 많이 발생한다. 반복적인 코드는 개발자의 생산성을 떨어트리는 주된 원인이다.이런 문제를 해결하기 위해 등장한 것이 Spring JDBC이다.JDBC의 저수준 세부사항을 스프링 프레임워크가 처리해주고 개발자는 필요한

Data Transfer Object의 약자계층간 데이터 교환을 위한 자바빈즈이다.여기서의 계층이란 컨트롤러 뷰, 비즈니스 계층, 퍼시턴스 계층을 의미한다.일반적으로 DTO는 로직을 가지고 있지 않고, 순수한 데이터 객체이다.필드와 getter, setter를 가진다.

먼저 spring 컨테이너인 Application Context는 설정 파일로 ApplicationConfig라는 클래스를 읽어들인다.ApplicationConfig에는 @componentScan이 DAO 클래스를 찾도록 설정할 것이다. 찾은 모든 DAO 클래스는 Sp

maven-archetype-quickstartgroup id, artifact id는 패키지가 될 것이기 때문에 소문자로 지정한다.artifact Id는 실제 프로젝트 이름을 기입한다.@import를 이용하면 설정 파일을 여러개로 나누어서 사용 가능하다.데이터베이스

Model-View-Controller의 약자이다.원래는 제록스 연구소에서 일하던 트뤼그베 린즈커그가 처음으로 소개한 개념으로, 데스트톱 어플리케이션용으로 고안되었다.Model : 모델은 뷰가 렌더링 하는데 필요한 데이터이다. 예를 들어 사용자가 요청한 상품 목록이나,

Database를 제외한 파란색 부분들은 Spring MVC가 제공한다.요청을 보내면 모든 요청을 Dispatcher Servlet이라고 하는 서블릿 클래스가 받는다.Dispatcher Servlet은 요청을 처리해줄 컨트롤러와 메서드가 무엇인지 Handler Mapp

웹 브라우저에서 http://localhost:8080/mvcexam/plusform 이라고 요청을 보 내면 서버는 웹 브라우저에게 2개의 값을 입력받을 수 있는 입력 창과 버튼이 있는 화면을 출력한다.웹 브라우저에 2개의 값을 입력하고 버튼을 클릭하면 htt

쇼핑몰에서 게시판에서도 회원 정보를 보여주고, 상품 목록 보기에서도 회원 정보를 보여줘야 한다면, 해당 코드를 별도의 객체인 서비스로 구현하는 것이 좋다.서비스 객체는 보통 업무와 관련된 메서드를 가지고 있다. 이것들을 비즈니스 메서드라고 부른다.비지니스 메소드를 별도

Spring JDBC를 이용한 Dao 작성Controller + Service + Dao트랜잭션 처리Spring MVC에서 폼 값 입력받기Spring MVC에서 redirect하기Controller에서 jsp에게 전달한 값을 JSTL과 EL을 이용해 출력하기

Spring MVC를 이용한 웹 페이지 작성 실습와 같이 보면 좋음.maven-archetype-webapp으로 생성group id, artifact id는 패키지가 될 것이기 때문에 소문자로 지정artifact id는 실제 프로젝트 이름을 기입spring 버전은 5.

Spring 4에서 Rest API 또는 Web ApI를 개발하기 위해 등장한 어노테이션이다.이전 버전의 @Controller와 @ResponseBody를 포함한다.자바 객체와 HTTP 요청 / 응답 바디를 변환하는 역할@ResponseBody, @RequestBody

클래스 자체에 RequestMapping을 선언하면 안쪽의 것들을 공통으로 사용할 수 있다.내부의 Mapping어노테이션에 path를 안붙여도 된다.

3) 클린코드

ES6의 arrow함수를 사용하면 더 간단해진다.map 메서드는 함수에서 정의한 방법대로 모든 원소를 가공한 후 새로운 배열을 반환한다.filter 메서드는 함수에서 정의한 조건에 맞는 원소만 추려서, 새로운 배열을 반환한다.원본 데이터가 변경되면, 추적도 어렵고, 어

자바스크립트에서는 객체 리터럴이라는 표현식을 이용해 객체를 쉽개 만들 수 있다.객체 안에서의 this는 그 객체 자신을 가리킨다.ES6에서는 객체에서 메서드를 사용할 때 'function' 키워드를 생략할 수 있다.javaScript에는 전역 스크립트나 함수가 실행될

위처럼 showHealth 내부 setTimeout의 this는 window를 가리킨다.setTimeout이 없다면 healthObj를 가리킨다.기본적으로 this는 window를 가리킨다.객체를 통한 호출, new와 함께 호출, bind/call/apply 메서드 사

과거에 인기 많은 라이브러리였지만 다음의 이유로 인해 인기가 많이 줄었다.점차 브라우저 호환성 이슈가 줄었다.JS Framworks 들이 좀 더 추상화된 방법으로 DOM 접근을 도와준다.다른 라이브러리들도 사고의 흐름대로 프로그래밍할 수 있다.제공하던 유용한 기능들이

templating 작업은 ES2015에서 template literal로 좀 더 간단해지긴 했지만, 여전히 다양한 조건 상황에서의 처리 등은 복잡하다.templating 작업을 돕는 라이브러리는 꽤 다양하고 막강한 방법을 제공한다.강의에서는 handlebar 라이브러

airbnb javascript coding convention 참고하기클린코드란 읽기 좋은 코드, 가독성 있는 코드를 말한다.대표적인 예시가 아래에 나와있다.이름 짓는 것은 쉽지 않지만, 가독성에 있어 필수 요소이다.다음을 고려한다.함수는 목적에 맞게 이름이 지어져