Node-Webkit 및 AngularJS를 사용하여 탭 브라우저를 만듭니다

' '' }; })

우리가 여기서하는 일은 Angular를 사용하여 동적으로 만들 수있는 재사용 가능한 템플릿을 만드는 것입니다. iframe SRC 속성의 TrustSrc () 메소드는 컨트롤러에서 생성됩니다. angular에서 지침이 어떻게 작동하는지 설명하는 것은이 기사의 범위를 벗어납니다. 새로 고침이 필요한 경우 : AngularJS 지시에 대한 실용적인 가이드. 일부 지원 서비스 Angular는 코드 조직, 재사용 성, API와의 의사 소통 및 컨트롤러 간 논리 공유에 서비스를 사용합니다. URL 입력을 얻기 위해 프롬프트를 사용하고 다른 하나 (GUI 및 창)을 사용하여 NW.JS의 GUI 및 Window API와 통신하여 사용자 정의 최소화, 전체 화면을 만들 수 있도록 하나의 프롬프트를 사용하여 하나의 프롬프트를 만들어야합니다. 버튼을 닫습니다 : 컨트롤러 마침내 컨트롤러는 이름이 다가 오면서 응용 프로그램의 데이터 흐름을 제어합니다. 우리는 다음의 종속성을 주입합니다 : $ scope, $ sce (Angularjs에 엄격한 상황에 맞는 탈출 서비스를 제공하는 서비스), 프롬프트, 창 (위에서 만든 두 서비스).

먼저 우리는 리소스 URL을 신뢰하는 메소드를 생성합니다 (디렉토리에서 이미 구현 한) :

Sitepoint를 홈페이지로 만드는 것이 굉장 할 것입니다. 그래서 우리는 itepoint의 URL을 첫 번째 값으로 통과 할 수있는 지시문을위한 다양한 탭을 만들 것입니다.

.

이제 프롬프트 서비스를 사용하여 새 탭을 시작하여 사용자로부터 URL을 얻을 수 있습니다. 활성 속성을 true로 설정하여 새 탭이 초점을 받도록합니다.

닫기 탭에는 배열#스플 라이스 함수를 사용하여 다음과 같이 탭의 배열에서 값을 제거합니다.

나머지 컨트롤러는 최소화, 전체 화면을 활성화/비활성화하고 창을 닫기위한 컨트롤에 동작을 추가하는 데 사용됩니다.

구현을 추가하더라도 아직 마크 업에 이러한 컨트롤을 추가하지 않았습니다. 이제 (앱/뷰/index.ejs에서) 지금 해 보겠습니다

그리고 그게 다야! 이제 터미널에서 Grunt 명령을 사용하여 브라우저를 시작할 수 있습니다.

.factory("prompt", function ($window, $q) {
  function prompt(message, defaultValue) {
    var defer = $q.defer();
    var response = $window.prompt(message, defaultValue);
    if (response === null) {
      defer.reject();
    } else {
      defer.resolve(response);
    }
    return (defer.promise);
  }
  return (prompt);
})
.factory('GUI', function () {
  return require('nw.gui');
})
.factory('Window', function (GUI) {
  return GUI.Window.get();
});

플랫폼을위한 건물 기사가 시작될 때 마음을 다시 던지면 모든 주요 운영 체제에 nw.js 앱을 배포 할 수 있다고 언급했습니다. NW.JS 프로젝트 페이지 에서이 작업을 수행하는 방법에 대한 광범위한 지침이 있거나 Generator-Wean의 사전 구성된 빌드 작업 (이제 시연 할 것입니다)을 사용할 수 있습니다.

.controller('main', function ($scope, $sce, prompt, Window) {
  //implementation here
})

. 프로젝트 루트에서 Grunt 빌드를 실행하면 구축 된 OS 용 앱을 빌드하는 반면 Grunt 빌드는 모든 플랫폼에 대해 빌드됩니다. Grunt Build : {Platform} (예 : Grunt Build : Mac)는 특정 OS를 위해 빌드됩니다. 가능한 옵션은 Win, OSX, Linux32, Linux64입니다. 자세한 내용은 Generator-Wean Readme을 참조하십시오.

예를 들어, 64 비트 리눅스 시스템에 있고 실행하는 경우 :

이것은 프로젝트 이름에 해당하는 실행 파일이 포함 된 빌드/테스트/Linux64 디렉토리를 생성합니다.

결론 그와 함께 나는 NW.JS의 힘뿐만 아니라 네이티브 애플리케이션을 만드는 데 웹 기술의 힘을 보여주기를 희망합니다. 우리는 기본 브라우저를 만드는 방법을 배웠을뿐만 아니라 NW.JS, Yeoman 및 기타 도구를 보았습니다. 이 자습서의 소스 코드는 GitHub에 있습니다. 다운로드하고 실험하는 것이 좋습니다.

. NW.JS를 사용하고 있습니까? 기본 응용 프로그램에 심각한 도전을 겪을 수 있다고 생각하십니까? 아래의 의견에서 당신의 생각을 듣고 싶습니다.

.factory("prompt", function ($window, $q) {
  function prompt(message, defaultValue) {
    var defer = $q.defer();
    var response = $window.prompt(message, defaultValue);
    if (response === null) {
      defer.reject();
    } else {
      defer.resolve(response);
    }
    return (defer.promise);
  }
  return (prompt);
})
.factory('GUI', function () {
  return require('nw.gui');
})
.factory('Window', function (GUI) {
  return GUI.Window.get();
});

Node-webkit 및 AngularJs 에 대한 질문 (FAQS)이 자주 묻습니다

node.js와 Angularjs의 주요 차이점은 무엇입니까?

node.js와 angularjs는 모두 JavaScript 기반 기술이지만 다른 목적을 수행합니다. Node.js는 서버 측에서 JavaScript를 실행할 수있는 런타임 환경이며 AngularJS는 동적 웹 응용 프로그램을 구축하는 데 사용되는 클라이언트 측 프레임 워크입니다. Node.js는 확장 가능하고 효율적인 서버 측 애플리케이션을 작성하는 데 이상적이며 AngularJS는 풍부하고 대화식 기능을 갖춘 단일 페이지 응용 프로그램을 작성하는 데 탁월합니다. AngularJS와 함께 Node.js를 어떻게 사용할 수 있습니까?

node.js 및 angularjs는 함께 사용하여 풀 스택 JavaScript 응용 프로그램을 만들 수 있습니다. Node.js는 응용 프로그램의 서버 측 부분을 작성하는 데 사용될 수 있으며 데이터베이스 작업, 파일 I/O 및 네트워크 통신과 같은 작업을 처리 할 수 ​​있습니다. 반면에 AngularJS는 응용 프로그램의 클라이언트 측 부분을 생성하여 동적 및 대화식 사용자 인터페이스를 제공하는 데 사용될 수 있습니다.

Node-webkit 란 무엇이며 AngularJS와 어떤 관련이 있습니까?

JavaScript 및 Node-WebKit을 사용하여 데스크톱 응용 프로그램을 빌드 할 수 있습니까?

예, JavaScript 및 Node-Webkit을 사용하여 데스크톱 응용 프로그램을 빌드 할 수 있습니다. Node-Webkit을 사용하면 웹 기술을 사용하여 데스크탑 응용 프로그램을 만들 수 있습니다. 즉, HTML 및 CSS와 함께 JavaScript를 사용하여 응용 프로그램의 사용자 인터페이스를 만들 수 있습니다. 브라우저에서 Node.js 모듈을 직접 사용하여 파일 I/O 및 네트워크 커뮤니케이션과 같은 강력한 기능에 액세스 할 수 있습니다.

AngularJS를 통해 Node.js를 사용하는 장점은 무엇입니까? AngularJS보다 Node.js의 주요 장점은 데이터베이스 작업, 파일 I/O 및 네트워크 통신과 같은 서버 측 작업을 처리하는 기능입니다. 따라서 확장 가능하고 효율적인 서버 측 응용 프로그램을 작성하는 데 이상적입니다. 반면에 Node.js를 통한 AngularJS의 주요 장점은 동적 및 대화식 사용자 인터페이스를 만들 수있는 능력이므로 단일 페이지 응용 프로그램을 작성하는 데 이상적입니다.

Node-Webkit로 시작하는 방법 ?

Node-Webkit을 시작하려면 먼저 다운로드하여 설치해야합니다. 이 작업을 마치면 package.json 파일과 기본 HTML 파일을 만들어 새 프로젝트를 만들 수 있습니다. package.json 파일은 응용 프로그램의 기본 HTML 파일 및 기타 설정을 지정하는 데 사용되는 반면, 기본 HTML 파일은 응용 프로그램의 사용자 인터페이스를 작성하는 곳입니다.

Node-WebKit과 함께 다른 JavaScript 프레임 워크를 사용할 수 있습니까? ?

예, Node-webkit과 함께 다른 JavaScript 프레임 워크를 사용할 수 있습니다. Node-Webkit을 사용하면 React, Vue.js 및 Ember.js와 같은 프레임 워크를 포함하여 브라우저에서 실행할 수있는 JavaScript 프레임 워크를 사용할 수 있습니다. 이것은 애플리케이션에 적합한 도구를 선택할 때 많은 유연성을 제공합니다.

노드 webkit의 일반적인 사용 사례는 무엇입니까?

노드 webkit은 일반적으로 생성하는 데 사용됩니다. 웹 기술을 사용해야하는 데스크탑 응용 프로그램. 여기에는 텍스트 편집기, 음악 플레이어 및 사진 편집자와 같은 응용 프로그램이 포함됩니다. 또한 Node.js.

와의 통합 덕분에 파일 시스템이나 네트워크와 상호 작용 해야하는 응용 프로그램을 작성하는 데 사용됩니다. Node-Webkit은 데스크탑 응용 프로그램을 만드는 다른 도구와 어떻게 비교됩니까?

. Node-Webkit 및 AngularJS를 함께 사용할 때 직면 할 수있는 몇 가지 과제는 무엇입니까?

Node-Webkit과 AngularJS를 함께 사용할 때 직면 할 수있는 한 가지 과제는 서버 측과 클라이언트 간의 통신을 관리하는 것입니다. 응용 프로그램의 측면 부분. 풀 스택 JavaScript 개발에 익숙하지 않은 경우 특히 까다로울 수 있습니다. 그러나 Node.js 및 AngularJS의 특징을 신중하게 계획하고 잘 사용하면이 도전을 극복 할 수 있습니다.

위 내용은 Node-Webkit 및 AngularJS를 사용하여 탭 브라우저를 만듭니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!