10cm さん プロフィール

  •  
10cmさん: Sierですがなにか?
ハンドル名10cm さん
ブログタイトルSierですがなにか?
ブログURLhttp://shinji-at-programmer.hatenadiary.jp/
サイト紹介文Sierとして働いている自分が、気になった技術など使ってみて紹介するブログです。
参加カテゴリー
更新頻度(1年)情報提供20回 / 37日(平均3.8回/週) - 参加 2016/10/16 06:22

10cm さんのブログ記事

  • 過去の記事 …
  • 【Angular2】ng2-chartsを使ってみた
  • 10cmです。こんにちは。今回は"ng2-charts"と言うものを使って、棒グラフを表示しようと思います。環境は、angular-cliで作成したプロジェクトを使います。angular-cliのインストールについては、下記を参照してください。angualr-cli【Angular2】Macに開発環境を構築してみた ng2-chartsのインストール ng2-chartの設定 angular-cli.jcon app.module.ts 実際に表示してみた 参考ng2-charts [続きを読む]
  • 【Angular2】簡単なWebアプリ制作(その3)
  • 10cmです。こんにちは。今回は、WebSQLを用いて購入物の管理を行います。GitHabはこちらになります。以下のような機能を実装しました。 購入物をDBから取得 購入物をDBに追加 購入物をDBから削除Angular2でWebSQLを使うようにするのは別記事で説明いたします。 データを追加 データを取得、表示 データを削除 まとめデータを追加まずはデータのを追加するための機能です。ComponentがWebSQL用のServiceのメソッドを実行して [続きを読む]
  • 【Angular2】ハンズオンに参加してきました
  • 10cmです。こんにちは。先日、ng_japan主催のAngular2ハンズオン勉強会#3に参加してきました。勉強会に参加するのは今回が初めての私ですが、Angular2は事前に学習していたため、内容はすんなりと入ってきました。細かい質問にも丁寧に答えてくださったスタッフの方々、ありがとうございました。前起きはこれくらいにして、今回はハンズオンの内容と、個人的にためになった内容を幾つか記載していこうと思います。ハンズオンの内容ハンズオンで [続きを読む]
  • 【Angular2】簡単なWebアプリ制作(その2)
  • 10cmです。こんにちは。前回に続きとなります。GitHabはこちらになります。開発環境は以下の用になっていますOS: MacEditor: VisualStudioCode@angular: 2.0.0angular-cli: 1.0.0-beta.17今回は、追加する画面を作成しました。以下のような感じになっています。ではでは、上記の画面でちょっと手こずったところを記載していきます。 チェック処理 バリデーションチェック 追加ボタン押下OKチェックチェック処 [続きを読む]
  • 【Angular2】Chromeでangular-cliのプロジェクトをデバッグする方法
  • 10cmです。こんにちは。今日は、angular-cliのプロジェクトをChrome上でデバック実行する方法をご紹介します。自分は開発環境として"VisualStudioCode"を使っているのですがどうにもデバッグ方法がわからず、行き着いた結果がChrome上でデバッグをする方法でした。もし、"VisualStudioCode"でデバッグできるやり方を知っていたら教えて欲しいです。。。。前提条件自分の開発環境は、ざっと以下の通りです。 Mac Chrome angular-cliMacを使用 [続きを読む]
  • 【Angular2】簡単なWebアプリ制作日記(その1)
  • 10cmです。こんにちは。今回から、Angular2の練習がてら、Webアプリ制作を行いたいとおもいます。ざっくりではありますが、以下の点について記載していこうと思います。作るWebアプリはお小遣い帳をイメージして作成する。進捗報告のような形で記事を書く。作っている最中で気になった点などをその都度記載する。ソースコードは、GitHubで公開する。GitHub環境など開発環境は以下の用になっていますPC: MacEditor: VisualStudioCode@angular: 2 [続きを読む]
  • 【Angular2】routerLinkActiveを使ってみた
  • 10cmです。こんにちは。今回は、Angular2にある"routerLinkActive"を使って、ナビゲーションバーの制御を行います。routerLinkActiveは、現在のURLからrouterLinkを設定しているタグに対して、指定したクラスを有効にします。以下にナビゲーションのHTMLとその結果を記載します。ul class="nav nav-tabs"> li *ngFor="let nav of navList" routerLink="{{nav.link}}" routerLinkActive="active"> a {{nav.title}} /a> li>ul>'n [続きを読む]
  • MacにAngular2の開発環境を構築してみた
  • 10cmです。こんにちは。今回は、MacにAngular2の開発環境を構築してみました。PCの環境と導入するものをは以下となります ■PCの環境 macOS Sierra v10.12 node v6.8.1 ・・・ 重要 VisualStudioCode v1.6.1 ■導入するもの angular-cli Angular 2 Snippets "angular-cli"は、ターミナル上でangular2の開発に役立つコマンド"ng"を提供してくれます。"angular-cli"は、nodeのバージョンが6.X.Xでないとインストールを行えないので注意して [続きを読む]
  • 【Aurelia】MacでAureliaのインストールからUnitテストまで
  • 10cmです。こんにちは。今回は、AureliaというJavaScriptのフレームワークについて、インストールの仕方からUnitテストの実行までを記載していきます。まず、『Aureliaってなに?』という方は、『参考』にホームページを記載しておきますので詳しくはそちらを。ざっくり言ってしまえばAngularJSと同じような特徴を持っており、ES6/7を取り込むフレームワークということです。 1.Aurelia-cliのインストール 1.1前準備 [続きを読む]
  • 【Node.js】ERRNO -4058が起きたときの対処
  • 10cmです。こんにちは。仕事場でNode.jsを使っていたのですが、久しぶりに環境の整備をしたときにエラーが出てきました。今回の記事は、そのときの現象と対処法を示します。っと言っても、ログファイルとかはないです。(さすがに会社のPC4で記事を書くわけにもいかないため。。)現象をざっくり書くと下記のような感じです。package.jsonを他のプロジェクトを流用してinstallしようとした管理者権限で実行せよと怒られた管理者で [続きを読む]
  • 俺得ブログの書き方について
  • この記事は、"俺が"得するためのブログの書き方について記載していきます。・・・ん?俺得?見に来たみなさんやないのかって?この記事は、あくまで自分なりに調べまとめたものです。この記事は、みなさまからビシバシとご指摘頂いて、より良いものにどんどん更新していくことが目的です。『こいつ何いってんの?』とか『うっはwwwwダメだこいつwwww』ってなった方はどうかアドバイスをお願い致します。また、HOWTOを求めてやってきた方は、いいね的 [続きを読む]
  • 【AngularJS】angular-ui-routerを使えるようになるまで
  • この記事は、以下の開発環境のもと行っています。AngularJSの記事を書いていく上での開発環境 10cmです。こんにちは。今回はAngularJSのライブラリの一つ、"angular-ui-router"について記載していきます。(以下、ui-router)"ui-router"はルーティング機能を実現するためのライブラリです。AngularJSでは、標準で"ngRoute"というルーティング機能があるのですが、これはその強化版だと考えて良いでしょう。 1.ui-routerをイ [続きを読む]
  • 報連相と職場の空気について
  • 先日、弊社の研修を受けてきた。内容は社会人ならよく聞くほうれんそうについてである。えっ?ほうれん草?違います。報連相です。(茶番乙)ツッコミどころ満載のPVをみて、何がおかしいか答える、ありきたりな研修である。そんな中、ふとこんな話が出てきた。『職場の空気=報連相の質』この2つがイコールになるのはなんとなくわかる。では、『職場の空気が悪いから報連相の質が下がる』のか、『質の悪い報連相が続くから職場の [続きを読む]
  • 【AngularJS】Webアプリケーション作成(概要)
  • 本記事は、今後AngularJSを用いて作成するWebアプリの概要を記載する。概要日付ごとの購入物、金額を管理するWebアプリの作成を行う。(簡単にいえばお小遣い帳)入力は、カテゴリーと金額、個数、日付とする。出力は、リスト表示、グラフ表示を選択できるようにする。また、購入物の検索を行えるものとする。以下に、リスト表示のイメージを記載する。(あくまでイメージ)開発環境本アプリケーションは、以下の環境のもと開発を行う。 CentOS 7.0 An [続きを読む]
  • 【AngularJS】ng-appとモジュールについて
  • この記事は、以下の開発環境のもと行っています。AngularJSの記事を書いていく上での開発環境 ng-appとはAngularJSの機能を有効/無効の切り替えを行うためのもの。以下に、"ng-app"を記述しているとしていない場合のソースコードと結果を示す。記述していないソースコード:body> p>{{ 3 + 4}}p>body>出力結果:記述しているソースコード:body ng-app> p>{{ 3 + 4}}p>body>出力結果:{{…}}は"Angular式"と呼ばれる。 [続きを読む]
  • 【AngularJS】記事を書いていく上での開発環境
  • 注意このブログはへっぽこ主の学んだことをまとめていくブログです。間違いが多々あるかと思いますが、その場合は遠慮なく指摘をお願いいたします。この記事は、AngularJSの開発環境をまとめていく。今後、AngularJSに関する記事はここに記載されている開発環境を参考にする。使用するツールCentOS 7npm 1.3.8AngularJS 1.5.8CentOSはVagrantを用いて、仮想環境で実行する。Node.jsやAngualrJSのインストール方法は本記事では割愛 [続きを読む]
  • 過去の記事 …