2014-05-01 2 views
1

저는 서버 측 소프트웨어 개발자입니다. 작년 정도에 프런트 엔드 - 서버 프레임 워크에 대한 Ajax 호출

은 내가 꽤 큰 웹 응용 프로그램의 일환으로 일부 프론트 엔드 개발하기 시작 (스프링 프레임 워크, 스프링 MVC, 그리고 순수 자바 스크립트 \ HTML)이 프로젝트에서

는 내가 HTML 레이아웃을받은 다른 누군가에 의해 만들어졌고 나는 모든 js 로직을해야만했다.

1)의 onclick 기능 \이 2 트리거) 아약스는 자신을 호출 난 내 JS 파일은 다음 패턴을 가지고 코드의 20K 라인을 포함하고 있다는 것입니다 깨닫게되었다 어떤 (주로 아약스 호출)

매개 변수 3) 데이터를 반영하는 ajax 및 html (dom) 조작에 대한 콜백

그래서 buttom 줄에는 위에서 언급 한 많은 기능이 포함 된 극단적 인 스파게티 괴물이 있습니다.

function createAccountButtonClicked() { 

    // get input 
    doCreateAccountAjax(params); 

} 
    function doCreateAccountAjax(params) { 

    ajax.(...) //define callbackFunc(params) 

} 

function callbackFunc(params) { 

    // set dom stuff. 

} 

프레임 워크 괴물 (서버)로서 나는 이것을 믿을 수 없었다. 여기서 소개 한 방법론에 대한 제어와 흐름을 개선 할 수있는 프론트 엔드 프레임 워크가 있어야한다는 것을 알았습니다.

나는 참고 문헌의 일부를 주셔서 감사합니다.

감사합니다.

답변

4

실제로 프런트 엔드 개발에 사용할 수있는 몇 가지 프레임 워크가 있습니다. 기본 로직에서 뷰를 추상화하기 위해 MVC 또는 MVVM 디자인 패턴을 기반으로합니다. 다음을 확인하십시오

구글

  • Ember.js
  • Knockout.js
  • 에 의해 개발
  • Angular.js
  • , 나는 그것이 가장 깨끗한 HTML 템플릿 메커니즘을 가지고 있다고 생각합니다 주로하기 때문에, Knockout.js이다. 사용자의 애플리케이션의 HTML/CSS 뷰를 독점적으로 디자인하는 누군가와 의사 소통해야 할 필요가 있다면 이것이 중요하다고 생각합니다. 물론, 선택은 크게 응용 프로그램에 따라 다릅니다, 그래서 당신이 어떤 읽고 추천 할 것입니다 :

    은 물론 웹에서 이러한 프레임 워크를 비교하는 리소스 목록의 일부분입니다.

    는 별개로 MVC 프레임 워크에서, 당신은이뿐만 아니라 사용을 고려 수 있습니다

    • jQuery : 나는 거의 모든 사람들이 jQuery를 사용하여 생각합니다. DOM 조작을 추상화하고, 브라우저 간 AJAX 지원, 이벤트 핸들링 및 기타 많은 것을 제공합니다. 나는 그것 없이는 살 수 없었다.
    • Bootstrap : 매우 자주 사용되는 패턴으로 CSS를 "부트 스트랩"하고 일부 멋진 UI 구성 요소도 제공합니다.
    • Require.js : 자바 스크립트 코드를 모듈로 분할하여 강력한 종속성을 제공하십시오. 프런트 엔드 코드가 크고 복잡 해지면 정말 유용합니다. 초기부터이 코드를 사용하는 것이 좋습니다. 그러면 코드 구조가 훨씬 단순해질 것입니다.

    내가 도와줬으면 좋겠다.

    관련 문제