분류 전체보기(49)
-
[JSP] JSP 짧고 굵게 배워보기(시작페이지 만들기)
스크립트 태그 스크립트립 [ ] : 변수, 계산식, 메소드 호출 결과를 문자열 형태로 출력하는 데 사용. pageEncoding 속성 문자 인코딩 유형을 UTF-8 로 맞춰준다. import 속성 date를 불러오기 위해 해당 자바 패키지를 import한다. ③ 번에서 호출. ① 머리글: Home 부분 Home ② 본문: Welcome to Web Shopping 부분 Welcome to Web Shopping Mall ③ 본문: 현재 접속 시간 현재 접속 시각: ④바닥글: copyright 마킹 © WebMarket D.O.N.E!
2022.06.09 -
[JSP] JSP 짧고 굵게 배워보기(환경 구축 및 구동 확인)
Google에 jsp를 검색하면 뜨는 연관검색어 중 하나가 "jsp 안쓰는 이유" 이다. 실제도 그럴 것이 요즘은 jsp 잘 안쓴다고 한다. 요즘은 프론트앤드랑 서버기능 분리하는 추세이기 때문에 복합적인 기능이 있는 jsp는 잘 쓰지 않는다. 그래서 신규로는 jsp로 작업할 일은 없겠으나 기존의 것들을 유지보수하면서 한번은 꼭 마주치기 때문에 기초는 알고 있는 것이 좋겠다. 그래서 이번 포스팅은 JSP 개발 환경 구축 및 간단한 사용 예제만 실행해보려한다. JSP 개요 Java를 이용한 서버 사이드 스크립트 언어. Java Server Pages의 약자이며, 오라클에서 자바상표권 문제로 오픈소스인 jsp는 자카르타 서버페이지로 이름을 바꾸었다. Java의 점유율을 대폭 상승시킨 1등공신이다. 같은 부류에..
2022.06.08 -
[Bootstrap] container/bg/text/p 적용
Bootstrap 개요 트위터에서 시작된 오픈 소스 프론트엔드 트레임워크. 시작은 디자이너 한명과 트위터의 한 개발자였지만 지금은 트위터에서 주도적으로 개발하고 있지는 않다. 트위터에서 사용하는 각종 레이아웃, 버튼, 입력창 등의 디자인과 기능을 CSS와 JavaScript로 만들어 놓은 것이며, 초창기에는 웹 디자이너나 개발자 사이에서 웹 디자인의 혁명이라고 불릴 정도로 폭발적인 반응을 얻었던 프레임워크이다. 부트 스트랩 사용하기 위한 사전 작업 1. cdn 서비스 사용하거나 2. 직접 부트스트랩 서버에서 사용 1번을 하기 위해서는 인터넷에서 가져오면 된다. Choose a Bootstrap Version (3, 4 or 5) (w3schools.com) W3Schools Free Online Web ..
2022.06.08 -
[AJAX] xml/json 대한 AJAX 기본 동작
1. XML 읽기(기본동작코드) function loadDoc() { //XMLHttpRequest 생성 var xhttp = new XMLHttpRequest(); //응답이 왔을때의 콜백 함수 정의. 응답이 왔어? 그럼 뭘할거냐를 정해줌 xhttp.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xhttp.open("GET", "ajax_info.txt", true); xhttp.send(); } - this.readyState == 4 :정상완료 ( 응답이 왔으면) - this..
2022.06.08 -
[AJAX] AJAX와 CORS의 개념 및 기본 정보
Ajax (Asynchronous JavaScript and XML) JavaScript를 사용한 비동기 통신, 클라이언트와 서버간에 XML데이터를 주고 받는 기술 (비동기식이란 웹페이지를 리로드하지 않고도 데이터를 불러오는 방식으로, 서버와 통신하는 동안 다른 작업을 할 수 있다. 즉, Ajax은 새로고침없이 갱신할 수 있는 기술) 요즘은 XML 보다 JSON을 더 많이 사용하는 추세다. AJAX 장점 1. 웹페이지의 속도향상 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다.(새로고침안해도 되니깐) 2.서버에서 Data만 전송하면 되므로 전체적인 코드의 양이 줄어든다.(해당 데이터만 주고 받고 할 수 있으니깐) 3.기존 웹에서는 불가능했던 다양한 UI를 가능하게 해 준다. AJAX 단점 1...
2022.06.08 -
[JQuery] keyboard event 활용하여 캐릭터 움직이기
다음과 같이 키보드 방향키에 따라 캐릭터가 움직있게 하는 기능을 수행하고자 한다. keydown은 다음과 같이 작동한다.(w3school를 통한 예시) Enter your name: Enter your name in the input field above. It will change background color on keydown and keyup. 다음과 같은 $("변수").keydown(function(){~ 방법으로 풀면 되겠다. 1. 에서 테두리 지정 및 캐릭터 삽입 (캐릭터 크기 : width/height = 200px, 테두리 크기 : width/height = 600px, 2. 변수 지정 let bob = $('#bob'); const GAME_WIDTH = 600; const GAME_H..
2022.06.03