山梨県でホームページの制作をしています。コンテンツを重要視した使いやすいWebサイトを提供します。
2020-11-13

HTML5で作るスマートフォンアプリケーション

この記事は2020年11月に書かれたもので、内容が古い可能性がありますのでご注意ください。

Monacaを使ってみよう

最近、Webサイトのアプリ化を進めています。
以前からMonacaを使ってみたいなあ、と思っていたのですがなかなか機会がなくて着手できずにいたのですが、やっと触ることができましたので書いてみます。

Monaca

https://ja.monaca.io/


Monacaは、「スマートフォン向けアプリ」を作成することができるWebサービスです。
ちょっと勉強すれば誰でも簡単にアプリケーション開発が出来るんです。

正確には開発ができるのはハイブリッドアプリです。
「iOS」「Android」「Web」と様々なデバイスで動作するアプリケーションのことです。

HTML5で作れるスマートフォンアプリケーション

正確に言うとCSSやJavaScriptの知識があると更に出来ることが膨らむのでホームページを作るノウハウがわかっている方だと開発がスムースになるかもしれません。

このサイトをアプリ化してみました

HTMLが使えるのでiframeタグで自サイトをまるっと読み込んじゃえばいいんですけど、それじゃあ芸がないのでWordpressのWP REST APIをJavaスクリプトで読み込んでテンプレート内に表示する方法です。
WP REST APIっていうのは外部のシステムでWordPressのコンテンツデータを読み込むことが出来るようになる仕組みです。

こんな感じになりました。
公開できる段階にはなったのですが未公開です。まずはAmazonでの公開を検討中です。

親切すぎるYoutube

難しそうだなぁ、と思っているあなた(笑)
YoutubeでMonacaアプリ作成とか調べてみてください。着手のヒントになる動画がいっぱいありますよ。
Monacaを開発したアシアルさんの公開している動画を貼っておきます。
では。

Monacaで学ぶはじめてのプログラミング 第1章 アプリ開発入門

Monacaで学ぶはじめてのプログラミング 第2章 HTML入門

Monacaで学ぶはじめてのプログラミング 第3章 CSS入門

Monacaで学ぶはじめてのプログラミング 第4章 JavaScript入門

Monacaで学ぶはじめてのプログラミング 第6章 関数

Monacaで学ぶはじめてのプログラミング 第7章 イベント

Monacaで学ぶはじめてのプログラミング 第8章 DOM

Monacaで学ぶはじめてのプログラミング 第9章 フォーム

Monacaで学ぶはじめてのプログラミング 第10章 いろいろな演算子

Monacaで学ぶはじめてのプログラミング 第11章 配列

ごくろうさまでした。

関連記事