My First Mac

Mac Pro 購入しました。
Macなので、何をしたかメモしておきます。

まずはここのサイトを参考に設定。

【Mac初心者必見!】Mac買ったら誰もが必ずやる13の厳選された初期設定2015 - NAVER まとめ

メニューバー右上のユーザー名表示をアイコンに変更。

ASCII.jp:Macのメニューバーのユーザー名を非表示にするテク

ターミナルのデザインを変更。

Macのターミナル.app のデザインをカスタマイズする方法 / Inforati

ホットコーナーの設定。

ホットコーナーを駆使してMavericksの操作効率をアップさせちゃえ|Mac - 週アスPLUS

プレーンテキストのコピー設定

OS_X、プレーンテキストでコピーする方法 - りんごが好きなのでぃす


インストール

コマンド

  • curl オプション

resume方法
curl -C - -o [保存ファイル] http://xxxx/archive.gz

Dropwizard + SQLServer

Dropwizardの公式HPにあるサンプルを実行してみました。

Githubにある「dropwizard-example」を動かしてみます。
dropwizard/dropwizard · GitHub

まずは、NetBeansmavenプロジェクトをインポート。

SQL Serverを利用するため、pom.xmlに下記を追加。

<dependency>
    <groupId>com.microsoft.sqlserver</groupId>
    <artifactId>sqljdbc4</artifactId>
    <version>4.0</version>
</dependency>

SQL ServerJDBCドライバは、セントラルリポジトリから持ってこれないため、
ローカルリポジトリにインストールする必要があります。
MSのサイトから、sqljdbc4.jarを落としてきて任意の場所に置きます。

コマンドプロンプトでsqljdbc4.jarを置いている場所に移動し、以下のコマンドを実行。
mvn は、NetBeansの内部のものを利用しています。

"C:\Program Files\NetBeans 8.0.1\java\maven\bin\mvn" install:install-file -Dfile=sqljdbc4.jar -Dpackaging=jar -DgroupId=com.microsoft.sqlserver -DartifactId=sqljdbc4 -Dversion=4.0

参考
http://claude.betancourt.us/add-microsoft-sql-jdbc-driver-to-maven/


サンプルプログラムで使用されているpeopleテーブルを作成します。
以下、practiceデータベースに作りました。

USE [practice]
GO

SET ANSI_NULLS ON
GO

SET QUOTED_IDENTIFIER ON
GO

CREATE TABLE [dbo].[people](
	[id] [bigint] IDENTITY(1,1) NOT NULL,
	[fullName] [nvarchar](50) NOT NULL,
	[jobTitle] [nvarchar](50) NOT NULL,
 CONSTRAINT [PK_Person] PRIMARY KEY CLUSTERED 
(
	[id] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]

GO

適当にデータを追加すればデータベースは完成です。

最後にexample.ymlのデータベース設定を変更します。

database:

  # the name of your JDBC driver
  driverClass: com.microsoft.sqlserver.jdbc.SQLServerDriver

  # the username
  user: sa

  # the password
  password: XXXXX

  # the JDBC URL
  url: jdbc:sqlserver://localhost:1433;databaseName=practice


これ終了です。

http://localhost:8080/people
を実行すれば、テーブルに追加した内容がjsonで表示されます。

NetBeans + RESTful + Angularjs

今日は、YoutubeにあったNetBeansでのAngularjs開発チュートリアル
まとめます。

https://www.youtube.com/watch?v=kFm45u1koOI

  • バックエンド

MavenでWebアプリケーションのプロジェクトを作成します。
プロジェクト名はYoutubeにならって「CustomerBackend」としました。

Java DBのCustomerテーブルから、RESTful Webサービスを新規追加します。

f:id:dokyou3:20140810014757j:plain

f:id:dokyou3:20140810015128j:plain

そして、Cross-Origin Resource Sharingフィルタも作成します。

f:id:dokyou3:20140810015425j:plain

f:id:dokyou3:20140810015642j:plain

Filterクラスができているのを確認できるか思います。

f:id:dokyou3:20140810015914j:plain

次に、CustomerFacadeREST.javaを開いて、@Pathを「customers」に書き換えます。

f:id:dokyou3:20140810020946j:plain

ApplicationConfig.javaを開いて、ApplicationPathが「webresources」となっていることを確認。

f:id:dokyou3:20140810021118j:plain


それを踏まえて、プロジェクトのプロパティから実行設定を変更します。
相対URLを下の図のように入力してください。
ついでにブラウザを埋め込みkitブラウザに変更します。
※ブラウザの変更は任意です。

f:id:dokyou3:20140810021236j:plain

バックエンドはこれで終了です。

実行するとブラウザにxmlが表示されます。

f:id:dokyou3:20140810021624j:plain

  • フロントエンド

HTML5アプリケーションのプロジェクトを作成します。
プロジェクト名はまた、Youtubeにならって「CustomerFrontend」としました。

f:id:dokyou3:20140810021857j:plain

f:id:dokyou3:20140810021939j:plain

テンプレートから「Angular JS Seed」を選んで、終了ボタンを押します。

f:id:dokyou3:20140810022134j:plain

実行するとブラウザにはこのような画面が表示されます。

f:id:dokyou3:20140810022328j:plain


まず、プロジェクトのプロパティからJavaScriptファイルを追加します。
※最新の状態に更新するには「更新済~」のリンクをクリックしてください。

f:id:dokyou3:20140810023916j:plain

ライブラリフォルダはlibにして、angular.jsの1.2.20を追加しました。

ライブラリに合わせて、index.htmlを下のように変更します。
不要な場所もついでに削除しました。

<!DOCTYPE html>
<html lang="en" ng-app="myApp" class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>My AngularJS App</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/app.css"/>
</head>
<body>
  <div ng-view></div>

  <script src="lib/angular.js/angular.js"></script>
  <script src="lib/angular.js/angular-route.js"></script>
  <script src="lib/angular.js/angular-resource.js"></script>
  <script src="js/app.js"></script>
  <script src="js/services.js"></script>
  <script src="js/controllers.js"></script>
  <script src="js/filters.js"></script>
  <script src="js/directives.js"></script>
</body>
</html>

続いて、services.jsを下のように変更します。

'use strict';

/* Services */

var customerServices = angular.module('myApp.services', ['ngResource']);

customerServices.factory('Customers', function($resource) {
    return $resource('http://localhost:8080/CustomerBackend/webresources/customers', {}, {
        query: {method: 'GET', isArray: true}
    });
});

次に、controllers.jsを変更します。

'use strict';

/* Controllers */

angular.module('myApp.controllers', []).controller('MyCtrl1', function ($scope, Customers) {
    $scope.allcustomers = Customers.query();
    $scope.showSelectedElement = function (c) {
        $scope.selected = c;
    };
});

ほかのjavascriptは割愛。

もろもろここにあげておきます。
dokyou3/AngularJSMeetsJavaEE7 · GitHub


最後に、partial1.htmlです。

Filter: <p><input type="text" ng-model="customerfilter"></p>

<p>Selected item: <b>{{selected.name}} {{selected.city}}</b></p>

<table border='1'>
    <tr>
        <th>Name</th>
        <th>City</th>
    </tr>
    <tr ng-repeat="onecustomer in allcustomers | filter:customerfilter"
        ng-class-even="'even'"
        ng-class-odd="'odd'"
        ng-click="showSelectedElement(onecustomer)"
        >
        <td>{{onecustomer.name}}</td>
        <td>{{onecustomer.city}}</td>
    </tr>
</table>

app.cssも変えておきましょう。

.odd {
    background-color: aqua;
}

.even {
    background-color: pink;
}

tr {
    cursor: pointer;
}

実行すると下のような画面が表示されます。

f:id:dokyou3:20140810031810j:plain

Angularjsの知識が乏しいので見よう見まねで作りました。
フロントのjavascriptはもっとシンプルにできると思います。

Node.jsについて調べてみた

サーバサイドjavascript

 

特徴は、ノンブロッキングI/O方式。

http://itpro.nikkeibp.co.jp/article/COLUMN/20120725/411441/

http://www.tettori.net/post/293/

 

Node.jpはスレッドを1個しかもたないため、メモリ消費量を劇的に抑えることができる。

Apacheはユーザからのアクセスに対し、スレッドを作成するため、同時アクセス数が増えると使用メモリが増えてしまう。

ある時点から急にパフォーマンスが低下する。

 

フロントエンドもバックエンドもjavascriptになれば、言語の学習コストは減らせそう。