Corredor

ウェブ、プログラミングの勉強メモ。

Angular CLI

Express + Passport と Angular でセッション管理するアプリを作ってみる

サーバサイドは Express で、クライアントサイドは Angular で作り、クライアントでログイン処理をしたユーザのみが、ある API にアクセスできるようにしたいと思った。よくあるログイン処理とセッション管理をサーバサイドで行いたい、ということだ。 Expre…

Angular CLI で作ったアプリを Heroku にデプロイして動くようにした

Angular CLI で生成したアプリを Heroku にデプロイして動作するようにするには、いくつか設定変更が必要だったので紹介。 環境情報 Angular プロジェクトを作る package.json の devDependencies を dependencies に移動する package.json に engines を記…

「Web 版 VSCode」な StackBlitz が超優秀だった

StackBlitz という Web サービスを発見した。「Web ブラウザ上で動作する VSCode」といったところで、Angular や React などのプロジェクトを作成してその場で動作させられる Playground だ。 The online code editor for web apps. Powered by Visual Studi…

Angular 7 と Angular Material と Material Design Icons を試した

Angular7 がリリースされたので、そのお試しがてら、Angular Material と Material Design Icons を導入して遊んでみた。 Angular7 とは Angular Material とは Material Design Icons とは Angular7 アプリを新規作成する Angular Material を導入する Mate…

Angular アプリを Electron で動かす事始め

Electron (エレクトロン) は、HTML・CSS・JavaScript で構築した Web アプリケーションを Windows や Mac 向けのネイティブアプリとしてビルドしてくれるフレームワーク。ハイブリッドスマホアプリとしてビルドしてくれる Apache Cordova と似たようなモノで…

ngx-onsenui を使って Angular6 + OnsenUI + Cordova なプロジェクトを立ち上げてみる

HTML・CSS・JavaScript でスマホ向けアプリを作成することを「ハイブリッドアプリ」と呼ぶが、そんなハイブリッドアプリで Android や iOS のネイティブっぽい UI を実現してくれる、OnsenUI というフレームワークがある。 Onsen UI 2: HTML5モバイルアプリ…

Angular アプリを GitHub Pages に公開する際、ルーティングによる 404 を回避する、具体的な実装方法

以前書いた以下の記事の詳説。 neos21.hatenablog.com 事象のおさらい アプリのビルド時は Base Href を変更する 404.html からリダイレクトする AppComponent でリダイレクト処理を行う そもそも HashLocationStrategy を使う? 事象のおさらい Angular ア…

Angular In Memory Web API の実用性を上げるための Tips

以前 Angular In Memory Web API というライブラリを紹介した。Angular アプリ内に API サーバのモックを構築できるライブラリだったが、色々と癖があって扱いが大変だった。 neos21.hatenablog.com 今回はこの In Memory Web API の実用性を向上させるため…

Angular 4.4.5 だったアプリを ng update で 6.0.3 にバージョンアップした

Angular 6 からの新機能で、バージョンアップ時のマイグレーション作業を自動化してくれる ng update コマンドがある。今回はコレを使って、拙作の Angular Utilities を Angular 6 にバージョンアップしてみた。 コマンドに合わせて、公式サイトに Update G…

Karma を使ったユニットテストの結果を Jenkins 上で綺麗に表示するための設定

経験ゼロでもできるプログラミング現場の単体テスト作者: 片桐一宗出版社/メーカー: 翔泳社発売日: 2009/05/29メディア: 単行本(ソフトカバー)購入: 11人 クリック: 564回この商品を含むブログ (25件) を見る Angular CLI 製のプロジェクトなどで、Karma …

Angular In Memory Web API を使ってモックサーバを立てる

Angularデベロッパーズガイド 高速かつ堅牢に動作するフロントエンドフレームワーク作者: 宇野陽太,奥野賢太郎,金井健一,林優一,吉田徹生,稲富駿,丸山弘詩出版社/メーカー: インプレス発売日: 2017/12/15メディア: 単行本(ソフトカバー)この商品を含むブロ…

Angular5 にアップデートして「Metadata version mismatch for module」エラーが出た

Angularアプリケーションプログラミング作者: 山田祥寛出版社/メーカー: 技術評論社発売日: 2017/08/05メディア: Kindle版この商品を含むブログを見る まさに以下の記事どおりの事象に遭遇し、記事どおりの対応方法で修正できた話。 参考:Angular4 -> 5のア…

Angular のユニットテストでモジュールが存在しなくてもエラーにしない方法

JavaScript関数型プログラミング 複雑性を抑える発想と実践法を学ぶ【電子書籍】[ LuisAtencio ]ジャンル: 本・雑誌・コミック > PC・システム開発 > インターネット・WEBデザイン > その他ショップ: 楽天Kobo電子書籍ストア価格: 3,672円 JavaScript関数型…

Angular CLI プロジェクトでグローバル CSS をどう管理するか

Angularアプリケーションプログラミング【電子書籍】[ 山田祥寛 ]ジャンル: 本・雑誌・コミック > PC・システム開発 > インターネット・WEBデザイン > その他ショップ: 楽天Kobo電子書籍ストア価格: 3,996円 Angularアプリケーションプログラミング 開発の勘…

cordova-plugin-bluetoothle を使って iOS 同士で Bluetooth 通信する Cordova アプリを作る : 6 モック化編

テスタブルJavaScript作者: Mark Ethan Trostler,牧野聡出版社/メーカー: オライリージャパン発売日: 2013/09/21メディア: 大型本この商品を含むブログ (2件) を見る 前回の続き。最終回。 neos21.hatenablog.com neos21.hatenablog.com neos21.hatenablog.c…

Angular4 + Cordova なアプリを作る時の注意点

HTML5とApache Cordovaで始めるハイブリッドアプリ開発 (CodeZine BOOKS)作者: 小林昌弘,山田祥寛出版社/メーカー: 翔泳社発売日: 2017/08/09メディア: オンデマンド (ペーパーバック)この商品を含むブログを見る Angular4 + Cordova なアプリを作る時の注意…

tsconfig.json を切り替えてビルドする方法

TypeScript実践プログラミング JavaScriptを使いやすくスケーラブルな言語 (Programmer’s selection) [ スティーブ・フェントン ]ジャンル: 本・雑誌・コミック > PC・システム開発 > その他ショップ: 楽天ブックス価格: 3,456円 TypeScript を使っている…

Angular4 + TypeScript ことはじめ

はじめてのAngular4 「TypeScript」で開発する、オープンソースの「Webフレームワーク」 (I/O)[本/雑誌] / 清水美樹/著 IO編集部/編集ジャンル: 本・雑誌・コミック > PC・システム開発 > 入門書 > インターネット入門書ショップ: CD&DVD NEOWING価格: 2,48…