Webアプリをネットで公開!「どうやる?」の流れと最初の一歩を徹底的に解説します!

※本サイトにはプロモーション・広告が含まれています。

(最終更新月:2021年10月)

「せっかくWebアプリを作ったのに公開ができない!?」

「Webアプリは作れるようになったけど、サーバーって何を使えばいいの!?」

などと疑問をお持ちの方へ、当記事では、

  • Webアプリを公開するまでの流れについて
  • Webアプリを公開するための土台(OS)について

を解説します。

当記事での準備が済んだ上で、Webサーバーの構築へ進むことで、Webアプリ公開へグッと近づきます。

Webアプリをネットに公開するまでの全体的な流れを見ていきましょう。

✔YouTube解説動画

当記事の内容は動画を見ながら進めると、約15分程度で完了します。

動画ならではの情報も解説しているので、記事と一緒にご覧ください。

動画の概要欄には、単元ごとのコードを紹介しているgithubページも載せています。

筆者プロフィール

筆者プロフィールアイコン

【現職】プロダクトマネージャー

【副業】ブログ(月間20万PV)/YouTube/Web・アプリ制作

「プログラミング × ライティング × 営業」の経験を活かし、30後半からのIT系職へシフト。現在はプロダクトマネージャーとして、さまざまな関係者の間に入り奮闘してます。当サイトでは、実際に手を動かせるWebアプリの開発を通じて、プログラミングはもちろん、IT職に必要な情報を提供していきます。

【当ブログで紹介しているサイト】

当サイトチュートリアルで作成したデモ版日報アプリ

Django × Reactで開発したツール系Webアプリ

✔人に見せても恥ずかしくないコードを書こう

「リーダブルコード」は、わかりやすく良いコードの定義を教えてくれる本です。

  • 見るからにきれいなコードの書き方
  • コードの分割方法
  • 変数や関数の命名規則

エンジニアのスタンダートとすべき基準を一から解説しています。

何回も読むのに値する本なので、ぜひ手にとって読んでみてください。

Webアプリ公開までの流れ

Webアプリ公開までのステップは下記のとおりです。

  1. ネット上でアクセスできるUbuntu搭載のコンピューターを準備する
  2. Ubuntu上にWebサーバーを構築する
  3. WebサーバーにWebアプリを搭載する
  4. ドメインと紐付ける

Webアプリは一般的なHTMLで構成されたウェブサイトとは違いますので、通常のレンタルサーバーでの公開は難しいです。

そのため、自作した環境で上記1, 2の工程を経る必要があります。

実際にはUbuntuでなくてもWebサーバーは構築できますが、当ブログではUbuntuで話を進めていきます。

Linuxのサーバーをお使いの方であれば、当記事の内容から大きくずれることはないでしょう。

Ubuntu環境さえ準備すれば、残りの2から4はほとんど同じ作業です。

次章にて、Ubuntu環境を準備する方法を解説していきます。

Webサーバー構築のためのOS環境を準備する方法

大きく分けて2つの方法があります。

  • 【パターン①】自前のコンピューターを使う
  • 【パターン②】クラウドサービスを使う

それぞれのメリット・デメリットを見てみましょう

【パターン①】自前のコンピューターを使う

メリットは既にお持ちのパソコンを使えば導入時のコストがかからないことにあります。

また日々のランニングコストもかかりません。(電気代はかかりますが、、)

ただし、こんなデメリットがあります。

  • コンピューターの容量など、スペックをいじれない
  • 固定IPアドレスを取得する必要がある(Webサーバーとしてアクセスする必要があるため)
  • バックアップ機能などを自分で追加していく必要がある
  • 普段パソコンとして使用しているフォルダもネットからアクセスできてしまう危険がある

とくに最後のは普段使っているパソコンでよくわからずやると危険ですね。

ですので自前で準備をするならせめてWebサーバー専用のコンピューターを用意する必要があります。

その際も購入費はかかるもののランニング費用は電気代くらいですむのが良いところです。

対して、クラウドサービスの特徴を見てみます。

【パターン②】Web上のクラウドサービスを使う

デメリットはサービス使用量が毎月 /毎年定額でかかってしまうことです。

ただし、こんなメリットがあります。

  • Webサーバー以外のバックアップ機能などはボタン一つで準備可能
  • アクセス数などに応じてスペックが自由に選べる
  • 固定IPアドレスと紐付けられている

月額かかるとはいえ、今回ご紹介するサービスは月額500円程度で使用可能です。

結局オススメの方法は?

最初から本番環境!というならパターン②クラウドサービスがセキュリティ上なども良いでしょう!

ただ、「Webサーバーについて詳しく知りたい!」とか「失敗するかもしれないから色々と試したい!」という方はパターン①自前のコンピューターで遊んでみても良いかと思います!

それぞれの方法でOSを準備するには下記の記事でご説明しています。

とりあえずいじって遊んで見る「自前で用意する」

パソコンとして使うためにいろいろ揃えても3万円程度です。

サーバーで使うだけなら最低限揃えて始めてみましょう!↓

セキュリティ重視で「クラウドサービスを使う」

クラウドサービス「DigitalOcean」を使って、簡単にネット上でUbuntu環境が準備できます

↓からリンクをたどって約1万円のクレジットをGETして始めてみましょう!

どちらかでOS環境を準備したら「Webサーバーの構築」へ進みますので、まずは自身のお好きな方法でWebサーバーを構築するための土台を準備しましょう!

もしドメインの取得をしておきたいなら、こちらの記事を参考にお好きなものをお選びください。

タイトルとURLをコピーしました