Tiny Bunny 'WEB' 카테고리의 글 목록 - 솜님의 블로그
솜님의 블로그

WEB 38

카테고리 설명
  • 데이터 객체를 이용한 통신 실제 데이터를 가져와서 가져온 데이터를 화면에 적용하는 통신 방법에 대해 알아보자!  먼저 Outline 탭 하위의 Head 탭을 클릭하면 Submission이 보인다.Submission을 우클릭 -> Submission 추가를 선택!   그럼 아래와 같은 창이 뜨는데,ID : 고유 ID를 의미한다.그리고 submission에서 제일 중요한 부분은그 아래에 있는 Reference / Target / URL Action 이다! Reference : Request 정보. 이미 만들어진 데이터 객체 중 하나를 선택해서 지정!Target : Response에 해당. 직접 입력하는 것이 아니라 실제로 내가 사용할 데이터 객체를만들어서 지정해 주는 것!URL Action : 내가 직접 데..

  • 컴포넌트 제어  컴포넌트는 속성 / 이벤트 / API를 통해 제어가 되고 있다.제어를 하기 위해 가장 먼저 할 일은? 내가 제어할 컴포넌트의 id를 적용하는 것!id 만들 땐 공백 사용 x, 특수문자는 언더바 외에 다른 것은 쓰지 말자! 이렇게 id를 지정해 줘야 해당하는 아이디가 이 페이지에서 전역변수처럼 사용이 된다.    $p 객체 사용 id 지정을 했다면API를 사용해 컴포넌트의 설정을 해보자! Script 탭으로 이동한다.  현재 설정하고자 하는 컴포넌트는 날짜를 나타내는 input 창이다.기본으로 오늘 날짜를 띄우고 싶은 상태.이때 웹스퀘어의 유틸성 자원을 이용해 설정해 줄 수 있다.  // 오늘날짜 가져오는 함수 // yyyyMMddHHmmss, 패턴 안넣으면 yyyyMMdd임! var cu..

  • 테이블 그리기 테이블(표) 형태를 그리고 싶다면?tableLayout을 사용한다! Palette 뷰어에서 TableLayout을 찾아 클릭해 준다. 그럼 위와 같은 창이 뜨는데,열과 행, 테이블 모양 등을 지정할 수 있다.   테이블을 만들고 난 뒤 상단 메뉴에서 행/열 추가, 삭제 등 기능을 사용할 수 있다. 그리고 각 칸마다 안쪽에 자식노드로 컴포넌트를 넣어줄 수 있다.이때 퀵 툴바를 사용할 수 있는데, 원하는 컴포넌트를 클릭하고 스페이스 바 누르기!(모든 컴포넌트가 다 나오진 않음)  현재 상태에서 웹 브라우저를 실행시키고,웹 페이지 크기를 줄여보면 자식 노드로 들어있는 컴포넌트들이 크기가 변하지 않아이상한 형태로 보이게 된다. 사이즈에 따라 테이블 모양이 바뀌는 형태 > 적응형 UI를 사용해 위 ..

  • 웹스퀘어에서 컴포넌트를 생성하게 되면 크기 조절은 가능하지만 위치 변경은 불가능하다.이 컴포넌트 위치 변경하는 방법을 알아보자! 컴포넌트 사용법 먼저, 웹에서의 CSS 방법은- Static / Relative / Absolute / Fixed / Sticky Position 이 있다.이 중 Static과 Absolute가 가장 많이 쓰인다. Static : 지정된 포지션 없음, 크기만 지정되어서 사용됨, 화면에 그려준 컴포넌트의 순서대로배치하는 방식. 절대적인 좌표값을 가지지 않고 그려진 순서대로(순차적으로) 그려나가는 방법이다.Absolute : 정해진 포지션이 있음. top/left 등과 같이 정해진 포지션이 따라 화면을 배치한다.흔히 말해 절대 좌표값  상단 툴메뉴에서 아래의 드롭다운 버튼을 클릭한..

  • WebSquare의 컴포넌트 활용법 WebSquare에서는 다양한 컴포넌트를 손쉽게 만들 수 있다.컴포넌트들의 종류와 특징에 대해 간략하게 알아보쟈!   입력 컴포넌트  SearchBox : 창 안에 x 버튼이 있는 input ( x 버튼을 누르면 입력한 내용 사라짐)Secret : 비밀번호 입력과 같은 경우 사용함입력값 자체를 보이지 않게 하기 때문에 input 컴포넌트에 비해 속성 등이 더 적음!InputCalendar : 달력을 통해 날짜 선택 가능속성에서 calendarValueType이 default로 yearMonthDate로 되어있지만, 연월/연단위 등으로 변경 가능하다.Spinner : 숫자의 증감 표시할때 사용Textarea : 여러 줄의 텍스트 입력 시 사용Editor (CKEditor..

  • 컴포넌트 사용법  웹스퀘어에서 컴포넌트를 사용하려면 3가지 방법을 이용하면 된다. 1. 컴포넌트가 지니고 있는 속성2. 이벤트3. API  1. 속성 1) 원하는 컴포넌트 선택  2) 우측을 보면 Property 탭이 있음.Property - 속성탭 선택!  3) 해당하는 컴포넌트의 속성과 적용방법을 볼 수 있다.내용은 마우스오버 (마우스 가져다 대기), 더 자세히 보고 싶다면 F1 웹스퀘어의 컴포넌트는 id 중심이다.그래서 이곳에서 id를 반드시 입력해줘야 사용할 수 있다.설정 후 디자인 탭에서 컴포넌트에 마우스를 가져다 대면 툴팁이 나오는데,▼ 이 툴팁은 상단 버튼을 선택해 표시하거나 숨길 수 있다.  property 설정 내용 (간략)initValue : 초기값 설정dataType : 데이터 타입 ..

  • WebSquare WebSquare란?웹 표준을 준수한 UI 프레임워크.ActiveX를 사용하지 않도고 웹 표준에서 동작할 수 있는 기반의 UI 개발 도구이다. 화면 소스는 xml로 되어있고, 해당하는 xml 파일이 웹 브라우저에서 로딩될 때 웹스퀘어의 엔진을 통해 html 형태로 변경되어브라우저로 표현되는 방식으로 구현된다. 그러나 sp5 버전부터는 xml을 바로 html로 바꾸지 않고,wpack이라는 변환 기술을 거쳐 한 번 더 xml을 경량화해주는 구조를 가지고 있다. 웹 표준이기 때문에 JavaScript나 CSS 등의 기법들을 사용할 수 있다.    웹스퀘어 화면파일 만들기  1) WRE (프로젝트) 하위 > Web 루트 이하에서 생성 및 관리가 필요함.따라서 현재 프로젝트 하위의 WebCont..

  • REST란?먼저 REST (Representational State Transefer) 란?웹 서비스가 어떻게 동작해야 하는지에 대한 아키텍처 스타일 또는 설계 원칙이다.쉽게 말해 웹에서 데이터를 주고받는 규칙을 의미한다. REST는 클라이언트와 서버 간의 상호작용을 규정하며,기본적으로 웹의 기존 기술과 HTTP 프로토콜을 그대로 활용하기 때문에 웹의 장점을 최대한 활용할 수 있는아키텍처 스타일이다. 자원을 이름(자원의 표현)으로 구분해 해당 자원 상태(정보)를 주고받는 모든 것을 의미한다. 어떤 자원에 대해 CRUD 연산을 수행하기 위해서 URI (Resource)로 GET, POST 등의 방식 (Method)을 사용하여요청을 보내며, 요청을 위한 자원은 특정한 형태(Representation of R..

  • webapp 하위에 login.jsp파일 생성여기서 submit 버튼을 누르면 2개의 데이터가 Controller로 간다. Controller에서는 넘어온 데이터를String mid = request.getParameter("mid");String password = request.getParameter("password");를 통해서 처리를 하는데, 이 request는 new 하지 않았는데도 사용이 가능하다.이는 request가 JSP 내장객체이기 때문이다. 받은 데이터를 selectOne해서 확인이 필요하다.DTO = new DTO(); 이때 DTO는 매 번 왔다갔다 하므로 쓸 때마다 new 해주는 것이 맞다.DAO.selectOne(DTO);인자를 DTO로 주는 이유는, 결합도를 낮춰 유지보수를 용..

  • 이번 중간 프로젝트를 진행하며 새롭게 알게 된 방식이 있다.바로 "종단처리" 와 "횡단처리" 이다. 기존의 우리는 M V C 패턴을 활용하여 기능 구분 없이 Model / View / Controller 세 파트로 나뉘어 코드를 작성하고 기능을 구현했다.이렇게 기존처럼 파트를 나눠 처리하는 것을 횡단처리라 한다. 반대로 종단처리는특정한 하나의 기능을 한 명의 개발자가 M V C 파트를 구분하지 않고 기능을 구현하는 것을 의미한다. 횡단처리의 경우각자 파트의 기능에 대해 집중할 수 있어서 조금 더 각자의 관심사에 맞는 코드가 나올 수 있고종단처리의 경우한 사람이 M V C 코드를 모두 작성하기 때문에 일관성있는 코드가 작성될 수 있다.

  • 필터- 서블릿을 상속받은 클래스 중 하나이며, 대표적인 특수 형태 서블릿이다.- 서블릿을 상속받은 클래스 : 리스너, 필터 자바의 일반 클래스 :  POJO대표적인 NOT POJO == 서블릿 (import가 처음부터 달려있어서 무겁다)1) 리스너 : 모니터링, 특정 상황을 감시  >> 서버가 동작을 했니? 그럼 수행할게~2) 필터 : 모든 특정 요청에 대해 항상 수행되는 서블릿을 의미한다.   >> 보안 / 인가, 허가, 인증, 권한확인 / 인코딩  - 필터 파일 생성마우스 우클릭 → New → Filter   ▼ 필터 파일 새로 생성 시 나오는 화면리스너와 비슷한 형태의 파일을 볼 수 있다. 필터는 총 4개의 메서드가 있는데,1) 기본 생성자2) 사라질때 3) 항상 수행되는 메서드4) 시작될때 3) ..

    WEB/백

    [WEB] 필터 NEW

    2024.09.06
    댓글
  • 모달창, 스위트 알랏, alert() >> 이런 것들을 통하여 웹에서 안내창을 볼 때가 있다. 안내창- 로그인 실패시의 기능으로 살펴보자! 기존 방식LoginAction.java에서 if / else if를 통해 로그인 성공 / 실패 코드를 구분해서 작성한다.실패 시에는 로그인 실패라는 알랏창을 띄워주는데,  out 객체를 사용한다.out 객체는 JSP 내장객체이기 때문에 java 파일에서는 불러와서 사용해야 한다.PrintWriter out = response.getWriter().println(""); 하지만 실제로 웹 페이지를 동작시켜보면 정상적으로 동작하지 않는 것을 확인할 수 있다. 동작하지 못하는 이유는?script는 해당 페이지에 머물러 있을 때에만 실행이 된다.그런데 현재 : 로그인 실패시..

    WEB/백

    [WEB] alert NEW

    2024.09.06
    댓글