본문 바로가기

Programming173

[JSP] 태그 [JSP] 서버와 클라이언트👨‍💻웹 프로그래밍이란?- 웹 프로그래밍이란, 웹 어플리케이션을 구현하는 행위입니다. - 웹 어플리케이션이란 웹을 기반으로 작동되는 프로그램입니다. - 웹이란 1개 이상의 사이트가 연결hong-study.tistory.com👨‍💻JSP의 특징동적 웹 어플리케이션 컴포넌트 ( 자바 코드의 사용 가능 )JSP 확장자클라이언트의 요청에 동적으로 동작하고, 응답은 HTML을 이용한다.JSP는 웹 서버와 통신시에 자동으로 Servlet으로 변환된다.MVC 패턴에서 View로 이용한다.👨‍💻JSP 태그의 개념Servlet은 JAVA 언어를 이용하여 문서를 작성하고, 출력 객체를 이용하여 HTML코드를 삽입한다.JSP는 서블릿과 반대로 HTML코드에 JAVA언어를 삽입하여 동적문.. 2024. 5. 6.
[JSP] 서버와 클라이언트 👨‍💻웹 프로그래밍이란?- 웹 프로그래밍이란, 웹 어플리케이션을 구현하는 행위입니다. - 웹 어플리케이션이란 웹을 기반으로 작동되는 프로그램입니다. - 웹이란 1개 이상의 사이트가 연결되어 있는 인터넷 서비스의 한가지 형태입니다. - 인터넷이란 1개 이상의 네트워크가 연결되어 있는 형태를 말합니다👨‍💼 웹 어플리케이션의 장점사용자별도의 설치 없이 프로그램을 사용할 수 있기 떄문에 접근성이 용이하다.개발자사용자용 프로그램을 별도로 제작하지 않고, HTML을 이용하여 사용자UI를 구축하기 때문에, 개발 시간과 노력이 줄어든다.🎮 JSP 웹 어플리케이션의 장점풍부한 JAVA  API 를 사용하여 제작된다.JSP 기반의 웹 어플리케이션은 특정 운영체제가 아니더라도 호환성의 문제가 없다.실제 코드가 프로.. 2024. 5. 6.
[JavsScript] API 활용 [JavaScript] 비동기 AJAX [JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Fle hong-study.tistory.com API API는 정의 및 프로토콜 집합을 사용하여 두 소프트웨어 구성 요소가 서로 통신할 수 있게 하는 메커니즘이다. 예를 들어 카카오 소프트웨어 시스템에는 지도나 메신저 등의 데이터가 들어있고 이를 활용해 어려가지 기능을 구현 및 데이터를 받아서 사용할 수 있다. API는 Application Programming Interface .. 2024. 3. 7.
[JavaScript] 비동기 AJAX [JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 hong-study.tistory.com [JavaScript] 이벤트핸들러 ( BOM ) [JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Fle h.. 2024. 3. 7.
[JavaScript] 이벤트핸들러 ( BOM ) [JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 hong-study.tistory.com BOM ( Browser Object Model ) BOM은 앞 선 DOM 문서에서 한 번 소개했듯이 브라우저 객체 모델이라 하고, 내장 객체들을 의미한다. window, location, history, document 등이 포함된다. BOM은 자바스크립트의 두 번째 강력한 기능이다. window 객체는 웹브라우저에 대한 전반적인 정보 취득이나.. 2024. 3. 7.
[JavaScript] 이벤트 핸들러 ( DOM ) [JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 hong-study.tistory.com 이벤트 핸들러의 종류는 BOM과 DOM이 있는데, 해당 문서는 DOM을 먼저 다룬다. BOM ( Browser Object Model ) BOM은 브라우저 객체 모델로, 내장 객체를 의미한다. ▶ window, location, history, document 등이 포함된다. DOM ( Document Object Model ) DOM은 문서 객체 모델로, .. 2024. 3. 7.
[JavaScript] 자바스크립트 이벤트 핸들러 [JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리 hong-study.tistory.com 이벤트 핸들러 이벤트 이벤트란 화면에서 클릭이나 동작이 발생하는 동적인 기능이다. ▶ 자바 스크립트의 첫번째 강력한 기능이며, 사용방법만 암기한다면 충분히 적용이 가능하다. 태그와 스크립트의 이벤트를 연결하는 방식 ( 이벤트 앞에 ON 을 붙인다 ) 인라인 이벤트 모델 기본 이벤트 모델 표준 이벤트 모델 이벤트 종류 인라인 이벤트 모델 인라인 이벤트 모델은 HTML 요소에 직접 .. 2024. 3. 6.
[JavaScript] 자바스크립트 기본 2 [JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리합니다. 이를 통해 반응형 디자 hong-study.tistory.com 함수(선언적 함수) 자바스크립트에서 함수는 1급 최상위 함수이다. 객체지향 프로그래밍 언어에서 메서드의 기능보다 훨씬 더 많은 기능을 담당한다. 선언적 함수 반환 유형은 적지 않으며 매개변수도 적지 않을 수 있다. 매개 변수는 데이터 타입을 적지 않는다. 리턴은 적어도 되며 적지 않아도 된다. 선언적 함수는 함수 선언 이전에 호출하여도 에러를 발생시키지 않는다. 익명 함수 익명 함수는 변수에 .. 2024. 3. 6.
[JavaScript] 자바스크립트 기본 [HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리합니다. 이를 통해 반응형 디자인 레이아웃이 쉬워 hong-study.tistory.com 자바스크립트 자바스크립트란 프로토타입 기반의 객체 지향 언어이다. 스크립트 언어의 특성 상 플랫폼에 독립적이며 모든 웹 브라우저에서 동일한 실행 결과를 얻을 수 있다. 프로그램 코드가 직접 html 문서에 삽입, 브라우저에서 html 파일을 읽을 때 같이 해석되고 실행된다. 클라이언트에서만 실행 ▶ 정보를 서버에 보낼 필요 없이 처리가 가능하다. Type Check 가 철저하기 않다. ▶ 즉, 변수들의 타입에 있어서.. 2024. 3. 6.
[HTML, CSS] CSS 문법 FLEX Flex 참고 사이트 CSS Flex 완벽 가이드 CSS Flex는 효율적인 레이아웃 설계를 위한 기술로, 컨테이너 내 항목의 공간 배분과 정렬을 유연하게 관리합니다. 이를 통해 반응형 디자인 레이아웃이 쉬워지고 복잡한 계산 없이도 요소를 원하 www.heropy.dev FLEX 레이아웃을 구성할 때 float, position을 사용하지만, flex문법을 통해서도 레이아웃을 구성할 수 있다. ▶ flex layout은 부모박수에 flex를 선언하고, 내부에 자식 박스들을 유연하게 배치하는 속성이다. Container 적용 속성 display flex-direction flex-wrap justify-content align-items align-content 자식박스(item)에 적용하는 속성 orde.. 2024. 3. 2.
반응형