diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/ja/learn/common_questions/what_software_do_i_need | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/ja/learn/common_questions/what_software_do_i_need')
-rw-r--r-- | files/ja/learn/common_questions/what_software_do_i_need/index.html | 222 |
1 files changed, 222 insertions, 0 deletions
diff --git a/files/ja/learn/common_questions/what_software_do_i_need/index.html b/files/ja/learn/common_questions/what_software_do_i_need/index.html new file mode 100644 index 0000000000..9b042b3c06 --- /dev/null +++ b/files/ja/learn/common_questions/what_software_do_i_need/index.html @@ -0,0 +1,222 @@ +--- +title: Web サイトを作成するのにどんなソフトウェアが必要か? +slug: Learn/Common_questions/What_software_do_I_need +tags: + - NeedsActiveLearning + - WebMechanics + - 初心者 +translation_of: Learn/Common_questions/What_software_do_I_need +--- +<div class="summary"> +<p>この記事では、Webサイトを編集、アップロード、または閲覧するときに必要なソフトウェアについて説明します。</p> +</div> + +<table class="learn-box nostripe standard-table"> + <tbody> + <tr> + <th scope="row">学習の前提:</th> + <td><a href="/ja/docs/Learn/Common_questions/Pages_sites_servers_and_search_engines">Web ページ、Web サイト、Web サーバ、検索エンジンの違い</a>を理解しておいてください。</td> + </tr> + <tr> + <th scope="row">学習の目的:</th> + <td>Web サイトを編集、アップロード、閲覧するときに必要なソフトウェアについて学びます。</td> + </tr> + </tbody> +</table> + +<h2 id="Summary" name="Summary">概要</h2> + +<p>Web 開発に必要なほとんどのプログラムは無料でダウンロードできます。この記事では、いくつかのリンクを提供します。</p> + +<p>次のようなツールが必要です。</p> + +<ul> + <li>Web ページの作成と編集</li> + <li>Web サーバにファイルをアップロードする</li> + <li>Web サイトを見る</li> +</ul> + +<p>ほぼすべてのオペレーティングシステムには、デフォルトでテキストエディタとブラウザが含まれており、Web サイトの閲覧に使用できます。結果的には、通常はファイルを Web サーバに転送するためのソフトウェアを入手するだけで済みます。</p> + +<h2 id="Active_Learning" name="Active_Learning">アクティブラーニング</h2> + +<p><em>実習はまだありません。<a href="/ja/docs/MDN/Getting_started">あなたの力をお貸しください</a>。</em></p> + +<h2 id="Dig_deeper" name="Dig_deeper">より深く掘り下げる</h2> + +<h3 id="Creating_and_editing_webpages" name="Creating_and_editing_webpages">Webページの作成と編集</h3> + +<p>Webサイトを作成したり編集したりするために、テキストエディターが必要です。テキストエディターは、形式を持たないテキストファイルの作成や修正を行います。 <strong>{{Glossary("RTF")}}</strong> のような他の形式では、太字や下線のような書式を追加することができます。しかし、これらの形式はWebページの作成には適していません。Webサイトを構築する際に幅広い作業に使用するので、どのテキストエディターを使用するかを考えておきましょう。</p> + +<p>すべてのデスクトップ OS には、基本的なテキストエディターが付属しています。これらのエディターはすべて簡単なものですが、Webページのコーディングのための特別な機能は持っていません。そこで、お望みなら、利用可能なサードパーティのツールがたくさんあります。サードパーティのテキストエディターには、構文の色付け、自動補完、セクションの折りたたみ、コード検索などの便利な追加機能がよくついています。エディターの簡単なリストを挙げておきます。</p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">OS</th> + <th scope="col">内蔵エディター</th> + <th scope="col">サードパーティのエディター</th> + </tr> + </thead> + <tbody> + <tr> + <td>Windows</td> + <td> + <ul> + <li><a href="https://ja.wikipedia.org/wiki/%E3%83%A1%E3%83%A2%E5%B8%B3" rel="external">メモ帳</a></li> + </ul> + </td> + <td> + <ul> + <li><a href="http://notepad-plus-plus.org/">Notepad++</a></li> + <li><a href="https://visualstudio.microsoft.com/ja/">Visual Studio Code</a></li> + <li><a href="https://www.jetbrains.com/webstorm/">Web Storm</a></li> + <li><a href="http://brackets.io/">Brackets</a></li> + <li><a href="https://shiftedit.net/">ShiftEdit</a></li> + <li><a href="https://www.sublimetext.com/">Sublime Text</a></li> + </ul> + </td> + </tr> + <tr> + <td>Mac OS</td> + <td> + <ul> + <li><a href="https://ja.wikipedia.org/wiki/%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%E3%82%A8%E3%83%87%E3%82%A3%E3%83%83%E3%83%88" rel="external">TextEdit</a></li> + </ul> + </td> + <td> + <ul> + <li><a href="http://www.barebones.com/products/textwrangler/">TextWrangler</a></li> + <li><a href="https://visualstudio.microsoft.com/ja/">Visual Studio Code</a></li> + <li><a href="http://brackets.io/">Brackets</a></li> + <li><a href="https://shiftedit.net/">ShiftEdit</a></li> + <li><a href="https://www.sublimetext.com/">Sublime Text</a></li> + </ul> + </td> + </tr> + <tr> + <td>Linux</td> + <td> + <ul> + <li><a href="https://ja.wikipedia.org/wiki/Vi" rel="external">Vi</a> (All UNIX)</li> + <li><a href="https://ja.wikipedia.org/wiki/Gedit" rel="external">GEdit</a> (Gnome)</li> + <li><a href="https://ja.wikipedia.org/wiki/Kate" rel="external">Kate</a> (KDE)</li> + <li><a href="https://ja.wikipedia.org/wiki/Leafpad" rel="external">LeafPad</a> (Xfce)</li> + </ul> + </td> + <td> + <ul> + <li><a href="http://www.gnu.org/software/emacs/">Emacs</a></li> + <li><a href="http://www.vim.org/" rel="external">Vim</a></li> + <li><a href="https://visualstudio.microsoft.com/ja/">Visual Studio Code</a></li> + <li><a href="http://brackets.io/">Brackets</a></li> + <li><a href="https://shiftedit.net/">ShiftEdit</a></li> + <li><a href="https://www.sublimetext.com/">Sublime Text</a></li> + </ul> + </td> + </tr> + <tr> + <td>Chrome OS</td> + <td></td> + <td> + <ul> + <li><a href="https://shiftedit.net/">ShiftEdit</a></li> + </ul> + </td> + </tr> + </tbody> +</table> + +<p>こちらは、高度なテキストエディターのスクリーンショット例です。</p> + +<p><img alt="Notepad++ のスクリーンショット" src="https://mdn.mozillademos.org/files/8221/NotepadPlusPlus.png" style="height: 311px; width: 450px;"></p> + +<p>こちらは、オンラインのテキストエディターのスクリーンショット例です。</p> + +<p><img alt="ShiftEdit のスクリーンショット" src="https://mdn.mozillademos.org/files/15837/shiftedit.png" style="height: 311px; width: 475px;"></p> + +<h3 id="Uploading_files_on_the_Web" name="Uploading_files_on_the_Web">Web上へのファイルのアップロード</h3> + +<p>Web サイトを公開する準備が整ったら、Web ページを Web サーバにアップロードする必要があります。さまざまなプロバイダからサーバ上のスペースを購入できます (<a href="/ja/docs/Learn/Common_questions/How_much_does_it_cost#Publishing_tools.3A_FTP_client">Web で何かをするためにどのくらいコストがかかりますか?</a>を参照)。どのプロバイダを使用するかが決まったら、プロバイダは通常、SFTP URL、ユーザ名、パスワード、およびそれらのサーバへの接続に必要なその他の情報の形式で、アクセス情報をメールで送信します。(S)FTPは今や幾分時代遅れになっていて、<a href="https://ja.wikipedia.org/wiki/Rsync">RSync</a> や <a href="https://help.github.com/en/articles/using-a-custom-domain-with-github-pages">Git/GitHub</a> のような他のアップロードシステムが普及し始めていることを覚えておいてください。</p> + +<div class="blockIndicator note"> +<p><strong>メモ: </strong>FTP は本質的に安全ではありません。ホスティングプロバイダが安全な接続、例えば SSH を介した SFTP または RSync の使用を許可していることを確認してください。</p> +</div> + +<p>Web サーバを作成する際、Web サーバにファイルをアップロードすることは非常に重要なステップなので、<a href="/ja/docs/Learn/Common_questions/Upload_files_to_a_web_server">別の記事</a>で詳しく説明します。ここでは、単純な機能に限った無料 (S)FTP クライアントの例を示すにとどめます。</p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">OS</th> + <th colspan="2" rowspan="1" scope="col" style="text-align: center;">FTP ソフトウェア</th> + </tr> + </thead> + <tbody> + <tr> + <td>Windows</td> + <td> + <ul> + <li><a href="http://winscp.net" rel="external">WinSCP</a></li> + <li><a href="http://mobaxterm.mobatek.net/">Moba Xterm</a></li> + </ul> + </td> + <td colspan="1" rowspan="3"> + <ul> + <li><a href="https://filezilla-project.org/">FileZilla</a> (すべての OS)</li> + </ul> + </td> + </tr> + <tr> + <td>Linux</td> + <td> + <ul> + <li><a href="https://live.gnome.org/Nautilus" rel="external">Nautilus</a> (Gnome)</li> + <li><a href="http://dolphin.com/" rel="external">Dolphin</a> (KDE)</li> + </ul> + </td> + </tr> + <tr> + <td>Mac OS</td> + <td> + <ul> + <li><a href="http://cyberduck.de/">Cyberduck</a></li> + </ul> + </td> + </tr> + <tr> + <td>Chrome OS</td> + <td> + <ul> + <li><a href="https://shiftedit.net/">ShiftEdit</a> (すべての OS)</li> + </ul> + </td> + <td colspan="1"></td> + </tr> + </tbody> +</table> + +<h3 id="Browsing_websites" name="Browsing_websites">Webサイトの閲覧</h3> + +<p>ご存知の通り、Webサイトを閲覧するためにはWebブラウザが必要です。 私用でブラウザ使う時には、<a href="https://ja.wikipedia.org/wiki/%E3%82%A6%E3%82%A7%E3%83%96%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%81%AE%E4%B8%80%E8%A6%A7">たくさんのブラウザ</a>の選択肢がありますが、あなたがWebサイトを開発している時には、あなたのWebサイトがほとんどの人々のために働くことを確認するために、少なくとも以下のブラウザで動作確認、テストをする必要があります。</p> + +<ul> + <li><a href="https://www.mozilla.org/ja/firefox/new/" rel="external">Mozilla Firefox</a></li> + <li><a href="https://www.google.co.jp/chrome/" rel="external">Google Chrome</a></li> + <li><a href="http://windows.microsoft.com/ja/internet-explorer/download-ie" rel="external">Microsoft Internet Explorer</a></li> + <li><a href="http://www.apple.com/safari/" rel="external">Apple Safari</a></li> +</ul> + +<p>特定のグループ (技術プラットフォームや国など) を対象にする場合は、追加で <a href="http://www.opera.com/" rel="external">Opera</a>, <a href="http://www.konqueror.org/">Konqueror</a>, <a href="http://www.ucweb.com/ucbrowser/" rel="external">UC Browser</a> などブラウザでサイトをテストする必要があります。</p> + +<p>しかし、ブラウザによっては特定のオペレーティングシステムでしか動作しないものがあるため、テストをすることは複雑になります。 Apple Safari は iOS と Mac OS 上で動作し、 Internet Explorer は Windows 上でのみ動作します。 <a href="http://browsershots.org/" rel="external">Browsershots</a> や <a href="http://www.browserstack.com/" rel="external">Browserstack</a> のようなサービスを利用するのが最善です。 Browsershots は、様々なブラウザで見た場合のWebサイトのスナップショットを提供します。 Browserstack は実際には仮想マシンへの完全なリモートアクセスを提供し、最も一般的な環境でサイトをテストすることができます。他にも、独自の仮想マシンをセットアップする方法もありますが、それにはいくらかの専門知識が必要です。 (もしこの方法を使うのであれば、 Microsoft は <a href="https://modern.ie" rel="external">modern.ie</a> ですぐに使える仮想マシンを含む開発者のためのいくつかのツールを提供しています。)</p> + +<p>是非、実際のデバイス、特に実際のモバイル機器でいくつかのテストを実行してください。モバイル機器のシミュレーションは、進化中の新技術であり、デスクトップのシミュレーションよりも信頼性が低いです。もちろん、モバイル機器はお金を必要としますので、 <a href="http://opendevicelab.com/">Open Device Lab</a> の取り組みを見てみることをお勧めします。多くのプラットフォームでテストする場合は、過度な出費を抑えて機器を共有することもできます。</p> + +<h2 id="Next_steps" name="Next_steps">次のステップ</h2> + +<ul> + <li>一部のソフトウェアは無料ですが、すべてではありません。<a href="/ja/docs/Learn/Common_questions/How_much_does_it_cost">Web上で何かをするのにいくらのコストがかかるかを調べましょう</a>。</li> + <li>テキストエディターについてさらに学びたいのなら、<a href="/ja/docs/Learn/Common_questions/Available_text_editors">テキストエディターの選び方とインストール方法</a>に関する記事をお読みください。</li> + <li>Web上にWebサイトを公開する方法が分からないのであれば、<a href="/ja/docs/Learn/Common_questions/Upload_files_to_a_web_server">"Webサーバにファイルをアップロードする方法"</a>を参照してください。</li> +</ul> |