Warp를 사용한 블로그 애플리케이션(계속)(2)

4461 단어

Warp를 사용한 블로그 애플리케이션(계속)(2)




Warp를 사용한 블로그 애플리케이션(계속)


먼저 블로그 응용 프로그램을 만드는 방법에 대한 이전 자습서를 확인하십시오.이 기사에서는 양식을 추가하는 방법과 약간의 상호 작용을 보여줍니다.다음 Warp 개념을 배우게 됩니다.

  • 이벤트 처리 및 탐색
  • 이벤트 및 버튼 구성 요소
  • TextField 및 TextArea 구성 요소
  • 페이지 범위

  • 이전 튜토리얼에서 계속해서 "compose new entry"페이지를 만들어 봅시다. 이것은 몇 가지 다른 구성 요소가 있는 다른 페이지와 매우 유사합니다.
    <html>

    <head w:component="meta">
    <title>Warp :: Compose New Blog Entry</title>
    </head>

      <body w:component="frame">

    <input w:component="textfield" w:bind="newBlog.subject" />
    <input w:component="textarea" w:bind="newBlog.text" />

    <input w:component="button" w:label="post blog" />
    </body>

    </html> 

    주목해야 할 첫 번째 중요한 부분은 태그가 Meta 구성 요소로 장식되어 있다는 것입니다. 이것은 의 Frame 구성 요소와 함께 실제로 매우 중요하며 Meta는 Warp 페이지 동작의 기초를 형성합니다.
    주의해야 할 다른 사항은 입력 구성 요소입니다. TextField는 간단한 텍스트 상자이며 w:bind 속성을 사용하여 사용자 입력을 바인딩할 위치를 Warp에 알려줍니다. 이 경우 newBlog 속성에 대한 경로를 지정합니다. 이것은 내 페이지 개체의 변수입니다. 자, 이 속성을 직접 생성해 보겠습니다.
    @URIMapping("/blogs/compose")
    public class ComposeBlog {
    private Blog newBlog = new Blog("", ""); //an empty blog

    @OnEvent
    public void save() {
    System.out.println(newBlog.getSubject() + " - "

    + newBlog.getText());
    }
    public Blog getNewBlog() {
    return newBlog;
    }
    }
    여기에서는 save()라는 이벤트 핸들러 메서드를 제공했습니다. @OnEvent 주석으로 태그를 지정하여 페이지에서 이벤트(이 경우 버튼 클릭)를 트리거할 때마다 이 메서드를 호출하도록 Warp에 지시했습니다. 먼저, 데이터가 입력 구성 요소(TextField 및 TextArea)와 바인딩된 속성 간에 동기화된 다음 해당 콘텐츠를 인쇄하는 이벤트 핸들러가 시작됩니다.
    블로그 목록(이전 자습서의)이 실제로 업데이트되는 기능을 더 추가해 보겠습니다. 이를 위해 먼저 새 블로그 항목을 지도에 저장하는 메서드를 ListBlogs에 추가해야 합니다. 이 부분은 충분히 쉽습니다.
    @URIMapping("/home")
    public class ListBlogs {
    private Map<String, Blog> blogs = new HashMap<String, Blog>();

    public ListBlogs() { .. }

    public void addNewBlog(Blog blog) {
    blogs.put(blog.getSubject(), blog);
    }

    //...

    이제 작성 페이지의 이벤트 핸들러에서 store 메소드를 호출해 보겠습니다(이전 자습서의 페이지 삽입을 기억하십시오).
    @URIMapping("/blogs/compose")
    public class ComposeBlog {
    private Blog newBlog = new Blog("", ""); //an empty blog

    @Inject @Page ListBlogs listBlogs;

    @OnEvent
    public void save() {
    listBlogs.addNewBlog(newBlog);
    }

    public Blog getNewBlog() {
    return newBlog;
    }
    }
    거의 다 왔습니다. 이제 항목을 저장할 때 블로그 목록으로 돌아가고 싶습니다. 이는 웹 개발에서 일반적인 포스트 및 리디렉션 디자인 패턴을 따릅니다. Warp는 이를 직관적이고 유형이 안전한 방식으로 지원합니다. 내 이벤트 핸들러에 블로그를 저장한 후 표시하려는 페이지 개체를 반환하기만 하면 됩니다.
        @OnEvent
    public ListBlogs save() {
    listBlogs.addNewBlog(newBlog);

    return listBlogs;

    }
    깔끔합니다! 이제 "블로그 게시"버튼을 클릭하면 save() 메서드가 실행되고 블로그 목록으로 다시 리디렉션됩니다. 페이지 개체( 또는 하나의 하위 클래스) 임의의 URL로 리디렉션하거나 사후 리디렉션 대신 JSP 스타일 전달을 사용할 수도 있습니다. 자세한 내용은 Wiki의 이벤트 처리 가이드를 확인하세요. 페이지 범위 지정과 관련된 마지막 단계입니다. 일반적으로, Warp는 모든 요청에 ​​대해 Guice 인젝터로부터 페이지 객체의 인스턴스를 얻습니다. 이것은 사실상 주어진 범위로 바인딩되지 않은 페이지 객체(범위에 대한 정보는 Guice 사용자 가이드 참조)가 요청당 한 번 인스턴스화된다는 것을 의미합니다. 이는 ListBlogs 페이지의 속성이며, 이는 (새 요청에서) 리디렉션할 때 Map이 날아가고 새 항목을 잃게 됨을 의미합니다. 이 문제를 해결하기 위해 ListBlogs 페이지 개체의 범위를 싱글톤으로 지정할 수 있습니다. ListBlogs는 웹 앱의 수명 동안 한 번만 생성됩니다. 항목 맵이 유지됩니다.
    @URIMapping("/home")
    @Singleton
    public class ListBlogs { .. }
    페이지 개체에 의존하여 상태를 유지하고 페이지에서 범위를 선언하기 전에 많은 생각을 해야 합니다.
    싱글톤 범위는 이 예제에서 쉽게 수정할 수 있지만 실제로는 블로그를 보다 영구적인 저장 매체(예: 데이터베이스 또는 영구 저장소)에 저장하고 싶을 것입니다. JPA와 최대 절전 모드를 사용하는 것뿐입니다.


     

    좋은 웹페이지 즐겨찾기