JavaScriptとHTML5を使い、スマホアプリを 作ってみよう

JavaScriptやHTML5を用いたスマホアプリ開発の流れ

さまざまなプラットフォームを紹介しましたが、基本的な開発の流れは変わりません。
ここでは、スマホアプリの開発の流れについて確認していきましょう。

1.JavaScriptでコーディング/HTML5

どのようなスマホアプリを作るかを決めたら、コーディングに入ります。
多くのプラットフォームでは、リアルタイムプレビュー機能が付いているので、打ち込んだコードがどんな風に見えるかをすぐに確認することができます。

2. 実機で確認＆デバッグ

ほとんどのプラットフォームでは実機確認用のアプリケーションが配布されています。
通常はApp Storeなどに提出してスマホアプリをダウンロードしなければ確認できませんが、実機確認用のアプリケーションによって、開発段階で実機での見え方や操作性、画面遷移がうまくいっているかなどを確認することができます。

3. ビルド (デプロイ)

実機での操作を確認することができたら、HTMLやJavaScriptで組み込んだコードをハイブリッドアプリにも理解できる言語で変換していきます。
この作業を、ビルドやデプロイと言ったりします。

4. ストアに提出

iOS・Android用にファイルが生成されたら、AppleやGoogleのアプリストアに必要事項を入力し、ファイルを提出します。
開発環境にもよりますが、審査や掲載に概ね4〜10日はかかりますので、余裕を持って提出しましょう。

JavaScriptやHTML5があればスマホアプリは作れる

スマホアプリ開発はホームページ作成に比べると敷居が高いように思えますが、実はJavaScriptやHTMLといった既知の言語を使って開発することもできるのです。
また、X-CodeやAndroid Studioと違って、１つのコードでiOS・Android両対応のスマホアプリを作成できるのも大きなメリットですね。

ぜひ、JavaScriptやHTML5を使って世界でひとつだけのスマホアプリを作ってみてください。

この記事を読んだ方におすすめ

非エンジニアも知っておきたい！HTMLとCSSの基礎知識

WebやITを取り扱う仕事の中でたびたび耳にする「HTML」と「CSS」という言葉。聞いたことはあるけど、いまいちよくわからない人も多いでしょう。 エンジニアでなけれWebサイトの制作や運営はCMS（コンテンツ管理システム）に任せることができますが、それでもHTMLとCSSの仕組みを知っているといろいろな面で便利ですし、Webサイト運用にも自信を持てるようになります。 今回は非エンジニアでも覚えておきたい、HTMLとCSSの基礎について解説します。

CSS

Webページを構築する際、テキストへの下線配置や矢印など、コンテンツをよりわかりやすくする工夫をしたくなるものです。CSSを使うと、簡単なコードを書くだけでテキストの装飾などが思いのままにできます。今回ご紹介するCSSの書き方は、コンテンツの中でユーザーに注目してほしいところを示せる便利なものです。矢印や三角の作り方など、この機会にチェックしてみてください。