アシアルブログ

アシアルの中の人が技術と想いのたけをつづるブログです

フロントエンド(HTML5)

SVGを画像化する

はじめに 昨今のクライアントサイドでは、動的な画像のレンダリング、アニメーション、拡張・縮小を求められることが多々あります。そのような際にSVGは利用しやすい形式です。一方で、画像として内容を保存したくなることもあります。そのような場合に使え…

Onsen UIが生まれたきっかけ

本記事はOnsen UI Advent Calendar 2016のエントリーです。Onsen UIが生まれたきっかけについて、簡単に紹介したいと思います。

WebdriverIOを使ってみました

最近、「WebdriverIO がいい」という話を耳にしたので使ってみました。 軽く実案件の自動テストにも組み込んでみたのですが、かなり使いやすいと感じたので簡単に使い方をご紹介します。 WebdriverIOとは UI操作を自動化するためのJSライブラリです。(執筆…

jQuery 3.0βリリース。2系と3系の違いについて

jQuery 2系と3系の違いについて。なお3系はβ版の情報を元にしています。

色の処理に特化した軽量ライブラリ「Chroma.js」

色を補正したり、色空間の変換をしたり、カラースケールを設定して色を得る事ができる、色に関する振る舞いに特化した軽量JSライブラリ「Chroma.js」の紹介。

jQueryから離れるためのJavaScript代替ライブラリまとめ

jQueryの代わりに使えるJavaScriptライブラリを紹介します。

「マテリアルデザイン」に対応 Onsen UI 2.0 !!

Android向けのハイブリッドアプリを開発されている皆さんに嬉しいニュースがあります。なんとOnsenUI2.0では、マテリアルデザインを追加中です!

Babelを使って次期JavaScript、ES6を体験しよう

ES6をいち早く体感できるBabelを試しました

NVD3を使って、AngularJSで作ったハイブリッドアプリのグラフを統合しよう

ハイブリッドアプリにグラフを表示する方法はいくつもあります。ハイブリッドアプリは基本的にHTML,Javascript,CSSで動くウェブアプリケーションなので、JavaScriptのグラフライブラリならなんでも使うことができますし、バックエンドでグラフを作成して静止…

Monaca/Cordovaですぐに使えるアニメーションライブラリまとめ

ハイブリットアプリ開発に使えるスマートフォン対応のアニメーションライブラリをまとめました。

Onsen UIをタブレットデバイスでも使おう

Onsen UIをタブレットで扱います。デバイスの向きによってメニューの表示方法を変えています。

GapDebugを使えばWindowsでもiOSアプリの実機デバッグができます

GapDebugはWindows/Mac OSX用のソフトウェアで、Monaca/PhoneGap/Cordovaアプリの実機デバッグをサポートします。

AngularJSとOnsen UI で作るGoogle Mapsのサンプルアプリ

以下のツールを使用して、このサンプルを構築します。

Onsen UI を使用して、HTML5ハイブリッドアプリを作ってみよう

ハイブリッドアプリ開発のお話を、あちらこちらで、最近は、耳にするようになりました。プログラム知識が乏しい初心者マークの方、手っ取り早くアプリを開発したい方には、ネイティブアプリ開発のハードルは、高いのが現状です。ネイティブアプリを開発する…

Ajaxによるmultipart/postでの画像ファイルアップロード その3

こんにちは。内藤です。 前回および前々回に、FormおよびCameraプラグインで画像を取得し、それをFormDataオブジェクト経由でAjaxでサーバーにアップロードする方法について紹介しました。今回は、FormDataを使わず、手動でMultipart Postを生成してアップロ…

ng-japanに参加しました

日本初のAngularJSのカンファレンス、ng-japanのレポートです。

AndroidでカードUIの実装に便利なプラグイン

カードUIをAndroidで実装する際に便利なプラグインとして「ListViewAnimations」と「StaggeredGridView」を紹介します。

Onsen UI version 1.2.2リリースのお知らせ

Onsen UI version 1.2.2がリリースされました。その中で追加された2つの機能について解説します。

Onsen UIとjQueryを組み合わせてスマートフォンWebサイト/ハイブリッドアプリを作ろう

Onsen UIはAngularJSが必須ですが、動作については他のJavaScriptライブラリで動作させることもできます。そこで今回はjQueryとOnsen UIを組み合わせて使う方法を紹介します。

Onsen UIをカスタマイズするOnsen Theme Rollerの紹介

Onsen UIのカラーリングをカスタマイズできるOnsen Theme Rollerの使い方を紹介します。

透過がサポートされたnode-webkit(NW.js)でガジェットを作ろう

2014年末、node-webkitに透過がサポートされました。 ウィンドウの透過により、デスクトップガジェットのようなモノが作れるようになったので、試してみようと思います。

Onsen UI v1.2がやってくる! 新機能を紹介。

HTML5でモバイルアプリを開発するためのフレームワーク、Onsen UI(http://onsen.io)のバージョン1.2.0がリリースされました。このリリースには、アラートダイアログ、ダイアログ、ポップオーバー、カルーセルなどの新しいUIコンポーネントが追加されました。…

第一回Apache Cordova勉強会で「Cordovaで作るHTML5ハイブリッドアプリ 〜開発ベストプラクティスを学ぶ〜」という題で発表しました

Cordovaで作るHTML5ハイブリッドアプリ 〜開発ベストプラクティスを学ぶ〜」という題で発表しました。Cordovaでアプリを開発する上で、開発プロセスの中で留意する点についておおまかに説明しています。

AngularJS 1.3のフォームまわりの機能強化

こんにちは中川です。 先日、AngularJS 1.3 がリリースされましたね。 動作速度の改善や、メモリ消費量の削減などパフォーマンス面での改善もうれしいところですが、 機能的にはフォーム関連の機能強化が特にうれしく感じましたので、紹介したいと思います。

「最新SPA開発を学ぼう!ウェブエンジニアのためのAngularJS入門」という題でPHPカンファレンス2014で登壇してきました

10月11日に開催されたPHPカンファレンス2014にて、「最新SPA開発を学ぼう!ウェブエンジニアのためのAngularJS入門」という題で登壇してきました。

外部コンテンツをiframeサイズで拡大縮小させたり、固定幅コンテンツをウィンドウサイズでピッタリ表示させる方法

iframeを使って外部サイト(自分で更新できない)を表示したいときに、 iframe内のコンテンツを拡大縮小する方法 サイトコンテンツを固定幅のまま、あらゆるブラウザで、 ウィンドウサイズに合わせてピッタリに拡大縮小する方法

お絵描きアプリと画像の保存処理の実装

HTML5のキャンバス機能を利用すると、簡単にお絵描きアプリが作れます。 ここでは、それをさらにpng画像にしてアプリ内に保存する機能を実装してみます。

HTML5プロフェッショナル認定試験のセミナー資料を公開します

こんにちは!生形です。 先日、ヒカ☆ラボというイベントでHTML5プロフェッショナル認定試験の無料セミナーを行ってきました。 そのときに使用したセミナー資料を公開いたします。

HTML5+CSS3+JSでネイティブGUIアプリが作れる、node-webkitを触ってみる

Chromiumとnode.jsベースで作られたランタイムで、HTMLとJavascriptでネイティブアプリが作れるnode-webkitを触ってみました。 導入の仕方から、簡単なサンプルを使った動作、配布の仕方などを紹介します。

Protractorでハイブリッドアプリを自動テスト!

開発中も気軽にテストを実行できる環境があれば、既存コードのリファクタリングや使用しているフレームワークのバージョンアップなども安心して行えます。 というわけで今回は「Cordova + AngularJS + Onsen UI でハイブリッドアプリを作り、それをProtracto…