전체 글
-
[부스트코스] JSP -BE부스트코스 코딩일지/DB 연결 웹 앱 2020. 3. 12. 21:56
JSP란? Java 언어를 기반으로 하는 Server Side 스크립트 언어입니다. HTML에 자바 코드를 넣어 동적인 웹 페이지를 생성하는 도구로 사용합니다. 예시를 보겠습니다. 3. 자바 주석 : // OR /* */ JSP 페이지에서 주석은 세 가지 모두 이용 가능합니다. 다만 차이점은, 1번은 변환된 소스코드가 html로 읽어질 때 주석으로 처리된다는 것 2번은 소스코드가 변환될 시에 주석으로 처리되어 소스 변환 처리가 되지 않는다는 것 3번은 변환된 소스코드가 실행할 때 주석으로 처리된다는 것입니다. [출처: https://www.edwith.org/boostcourse-web/lecture/16704/] JSP 내장 객체 _jspService() 메서드에 삽입된 코드의 윗부분에 미리 선언된 객..
-
[부스트코스] WEB UI 개발 -FE부스트코스 코딩일지/DB 연결 웹 앱 2020. 2. 24. 00:47
window 객체 브라우저에 내장되어 있는 객체인 window 객체를 브라우저 개발 시에 사용할 수 있습니다. window 객체는 여러가지 메서드를 제공합니다. 가장 기본적이고 대표적인 것이 alert()입니다. 경고창을 팝업형태로 보여주는 메서드입니다. window.alert("message") open()이라는 메서드는 새로운 창을 열 때 사용하는 메서드입니다. window.open("new URL","창이름","창의 특성") window.open("localhost:1234"."new page","width=300,height=200") 이전 화면으로 돌아가게 해주는 back() 메서드도 있습니다. window.back() 일정 간격으로 함수를 호출하여 수행하는 setTimeout()이라는 메서드가..
-
[부스트코스] JavaScript -FE(4)부스트코스 코딩일지/DB 연결 웹 앱 2020. 2. 22. 00:05
자바스크립트 함수의 호출에 대해 공부해봅시다! 함수 호출 스택 1) function printName(firstname) { var myname = "jisu"; return myname + " ," + firstname; } function run(firstname) { firstname = firstname || "Youn"; var result = printName(firstname); console.log(result); } run(); 예제의 실행 순서를 살피어 봅시다. 1. run()이 읽힙니다. 2. run() 함수가 실행되게 되고, firstname 인자에는 undefined라는 값이 할당됩니다. 3. firstname은 undefined이기 때문에 "Youn"으로 재할당됩니다. (>> u..
-
[부스트코스] JavaScript -FE(3)부스트코스 코딩일지/DB 연결 웹 앱 2020. 2. 21. 23:49
오늘은 JavaScript의 함수에 대해 알아보도록 하겠습니다 :) 함수 선언 function printName(firstname) { var myname = "jisu"; return myname + " " + firstname; } 위와 같이 function 함수이름(인자){내용} 으로 선언하면 됩니다. 위의 예제를 보면 의문점이 하나 있습니다. 바로 firstname이 정의되지 않은 것인데요. 이 함수를 호출하면 어떻게 될까요? 결과는 jisu undefined 라고 나오게 됩니다. 따로 오류가 나지 않는다는 특징이 있습니다. undefined는 선언은 됐지만 할당되지 않는 변수에 대해 출력되는 값입니다. 함수 표현식 function test() { console.log(printName()); v..
-
[부스트코스] JavaScript -FE (2)부스트코스 코딩일지/DB 연결 웹 앱 2020. 2. 21. 21:58
비교-반복-문자열 비교, 반복문을 만드는 자바스크립트 문법은 다른 언어와 유사합니다. if if("조건문"){ } else if("조건문~"){ } else switch switch(변수명){ case value1: 명령문; break; case value2: 명령문; break; case value3: 명령문; break; default: 명령문 } for 반복문 for(var i=0 ; i> 메서드 : length, search, slice, replace... [출처: https://www.edwith.org/boostcourse-web/lecture/16694/]
-
[부스트코스] JavaScript - FE (1)부스트코스 코딩일지/DB 연결 웹 앱 2020. 2. 14. 02:46
이번 포스팅에서는, 웹 프로그래밍의 필수 요소인 자바스크립트에 대해 공부해보도록 하겠습니다. 변수/선언/연산자/타입 변수는 var, let, const로 선언할 수 있습니다. 이 선언 방법에 따라서 변수의 유효 범위가 달라집니다. var / let, const로 나눌 수 있습니다. var은 지역 변수, let, const는 전역 변수라고 생각하면 됩니다. 또한 var은 변수 재선언이 가능한 반면, let, const는 변수 재선언이 불가능합니다. let과 const의 차이점은 const는 말 그래로 상수 변화를 줄 수 없는 변수입니다. 반면, let으로 선언된 변수의 값은 재할당이 가능합니다. - or 연산자 자바스크립트에서 신기한 것은 or 연산자로 default값을 정할 수 있다는 것입니다. 예를 들..
-
[부스트코스] Servlet -BE부스트코스 코딩일지/웹 프로그래밍 기초 2020. 2. 14. 01:45
JDK와 eclipse ee 그리고 WAS 종류의 하나인 Tomcat까지 설치하여 본격적으로 웹 애플리케이션을 동작할 준비를 마치었습니다. 웹 어플리케이션은 정적인 콘텐츠와 동적인 콘텐츠로 나누어 볼 수 있는데요. 프로그램을 수행해서 페이지를 동적으로 만들어 주는 것이 바로 서블릿입니다. 서블릿의 역할과 작성 방법에 대해 알아보도록 하겠습니다! Servlet 이란? 자바 웹 애플리케이션의 구성요소 중 동적인 처리를 하는 프로그램입니다. 서블릿은 WAS에 동작하는 JAVA 클래스인데요, HttpServlet 클래스를 상속받아 동작합니다. 웹페이지의 화면 자체를 JSP로 표현한다면, 그 안에서 이뤄지는 복잡한 프로그래밍은 서블릿으로 구현하는 것입니다. 서블릿은 요청이 들어오면 그때 코드가 실행되어 응답 결과..
-
[부스트코스] CSS layout부스트코스 코딩일지/웹 프로그래밍 기초 2020. 2. 2. 18:08
엘리먼트를 화면에 배치하는 것을 Layout 작업이라고 하고, Rendering 과정이라고도 합니다. 기본적으로 엘리먼트는 위에서 아래로 배치됩니다. 더 다양한 방식으로 배치할 수 있도록 다양한 속성이 제공되고 있는데요. 오늘은 이 속성에 대해 공부해보도록 하겠습니다! display - block / inline-block : 위에서 아래로 쌓이는 레이아웃 속성입니다. - inline : 왼측에서 우측으로 빈자리를 차지하며 흐르듯이 엘리먼트가 공간을 차지하는 속성입니다. 높이와 넓이를 지정해도 반영이 되지 않습니다. position 엘리먼트가 상대적/절대적으로 배치되도록 하는 속성입니다. -staitic (기본) : 순서대로 배치 - absolute : 기준점을 상위엘리먼트로 단계적으로 찾아가는데 sta..