튜토리얼 출처: JavaScript30 튜토리얼 이름: Day 18 - Adding Up Times with Reduce 튜토리얼 분류: JavaScript 튜토리얼 설명: 여러 동영상의 길이가 표시되어 있을 때, 전체 재생 시간을 합산하기 진행기간: 2020년 4월 30일 Array.prototype.reduce( ) 메서드로 배열 원소 합치기 JavaScript 배열의 reduce( ) 메서드는 다양한 곳에 활용될 수 있다. 형태 우선 reduce( ) 메서드의 형태를 살펴보자. callback 함수와, initialValue(초기값) 을 인자로 실행된다는 것을 알 수 있다. callback 함수는 다음 4개의 매개변수를 받아 실행된다. accumulator(누산기): 계속 누적되는 callback ..

강의: [edwith 부스트코스] 웹 프로그래밍 챕터 3, 웹 앱 개발: 예약서비스 1/4 학습일: 2020년 4월 30일 9. Spring MVC - BE Spring MVC 실습 - 웹페이지 1 기능 구현 웹 브라우저는 http://localhost:8080/mvcexam/plusform URL로 요청을 보내고, 서버가 웹 브라우저에게 2개의 값을 입력받을 수 있는 입력창과 버튼이 있는 화면을 출력 웹 브라우저가 2개의 값을 입력하고 버튼을 클릭하면 http://localhost:8080/mvcexam/plus URL로 서버에게 2개의 입력값이 POST 방식으로 전달됨 서버는 2개의 값을 더하고 결과값을 JSP에게 request scope로 전달해 출력 Spring MVC 실습 - Spring MVC..

강의: [edwith 부스트코스] 웹 프로그래밍 챕터 3, 웹 앱 개발: 예약서비스 1/4 학습일: 2020년 4월 30일 9. Spring MVC - BE Spring MVC 실습 - 프로젝트 기본 설정 Maven Project 생성 File > New > Maven Project Maven Project 설정 Archetype: maven-archetype-webapp 선택 Group Id (회사명): kr.or.connect 입력 Artifact Id (프로젝트명): mvcexam 입력 java 폴더 생성 Navigator 탭 > mvcexam > src > main 디렉토리에 java 폴더 생성 pom.xml 수정 JDK 1.8 사용을 위해 plugin 추가 (참고: Maven (Back End)..

튜토리얼 출처: JavaScript30 튜토리얼 이름: Day 17 - Sort Without Articles 튜토리얼 분류: JavaScript 튜토리얼 설명: 문자열로 이루어진 배열에서 정관사 The, A, An을 제외한 기준으로 정렬하기 진행기간: 2020년 4월 29일 Array.prototype.sort( ) 메서드의 특징 sort( ) 메서드의 인자로 들어가는 함수의 반환값에 따라 동작이 달라짐 함수의 반환값 0인 경우: 비교되는 두 값 중 후자가 앞의 순서로 옴 함수의 반환값 = 0인 경우: 두 값에 대해 별도의 변경을 적용하지 않음 참고자료: Array.prototype.sort() - JavaScript | MD..

튜토리얼 출처: JavaScript30 튜토리얼 이름: Day 15 - LocalStorage and Event Delegation 튜토리얼 분류: JavaScript 튜토리얼 설명: localStorage로 값을 저장하고, 이벤트 위임을 활용해 동적으로 추가된 요소에 이벤트 연동시키기 진행기간: 2020년 4월 27일 HTML submit 타입 태그에 이벤트 설정하기 해당 태그에 click 이벤트를 연동하는 방식과, submit 이벤트를 연동하는 방식으로 나뉨 click 이벤트는 키보드 입력으로 발생하는 submit 이벤트에 반응하지 않는다는 한계가 있음 submit 이벤트를 통해 연결하는 것이 확실함 예시 코드 참고자료: SubmitEvent - Web APIs | MDN 특정 HTML 태그로 인한 ..

튜토리얼 출처: JavaScript30 튜토리얼 이름: Day 14 - JavaScript References VS Copying 튜토리얼 분류: JavaScript 튜토리얼 설명: JavaScript 데이터의 종류별 전달 방식 진행기간: 2020년 4월 26일 숫자, 문자열과 데이터 복사 예시 코드 한 변수에 다른 변수를 지정한 후, 한 변수를 바꿔도 다른 변수의 값은 유지됨 배열과 데이터 참조 예시 코드 한 변수에 다른 변수를 지정한 후, 한 변수의 데이터를 바꾸면 다른 변수의 데이터도 바뀜 배열의 데이터를 복사하는 방법 전통적 방식: slice( ) 메서드, [ ].concat( ) 메서드 새로운 방식 (ES6) 객체와 데이터 참조 예시 코드 한 변수에 다른 변수를 지정한 후, 한 변수의 데이터를 ..