PHP・MySQL入門

ゼロからはじめるPHP・MySQL入門 第1回「おすすめのテキストエディタとインストール方法」

ここまでの記事はこちら
 

今回は「おすすめのテキストエディタとインストール方法」を紹介します。

あなたのパソコンにも Windows ならば「メモ帳」、Mac ならば「テキストエディット」がインストールされていると思います。

もちろんメモ帳やテキストエディットでコードを書くこともできますが、黒一色でコードを書いても読みにくそうですよね。
 

今回インストールするテキストエディタには、色をつけてコードを読みやすくしてくれたり、コードの入力を補助してくれる機能がついています。
 

一般的なメモ帳

テキストエディタ

 
プログラミングを効率的に進めるには、大事なツールなので用意しておきましょう🙂

 


 

テキストエディタの種類

まずはどんなテキストエディタがあるのか、人気のテキストエディタを5つ紹介します。

無料

1. さくらエディタ(Windows)

ダウンロード:https://sakura-editor.github.io/
 

2. NotePad++(Windows)

ダウンロード:https://notepad-plus-plus.org/
 

3. Sublime Text

ダウンロード:https://www.sublimetext.com/

* この講座ではSublime Textを使用します。この後インストール方法を紹介しています。

 

4. Atom

ダウンロード:https://atom.io/

 

5. mi

ダウンロード:https://www.mimikaki.net/

 
 

他にも Eclipse, TeraPad, Visual Studio Code など多くの種類があります。

さらに調べたい場合は「テキストエディタ おすすめ」などで検索してみてください。

 

有料

私が長く使っているテキストエディタも紹介しておきます。

Coda 2 というテキストエディタで、Mac のみ対応・有料(9,800円)のものです。
 
ダウンロード:https://panic.com/jp/coda/
 

こちら動画でも使用しています。

PHPカレンダーの作り方 #1 HTMLとCSS

 
 

左側に書いた HTML が右側にリアルタイムで反映されるのが一番オススメの機能です🙂
 

また、コードをたくさん書くようになると「自動補完」という機能が重要になってきます。

自動補完というのは、HTMLタグやPHPの関数を途中まで書くと残りを自動で入力してくれることです。

例えばHTMLの場合、<h1>と書くと <h1></h1>と自動で入力してくれます。

PHPの場合だと strtostr() という関数があるのですが、strt まで入力すると strtostr() と表示されて簡単に入力できるようになります。
 

時間短縮にもなりますし、コードを書き間違えることも減る便利な機能です。

無料エディタでも自動補完が利用できるものは多くありますので、選ぶ時に参考にしてみてください。
 
 

テキストエディタの選び方

テキストエディタは後からいくらでも変更できます。

現時点では、とりあえず気になったものをインストールしてみて「フォントや画面の色・配置が心地良いと感じるもの」を選んでください。

複数のテキストエディタをその日の気分で使い分けるのもOKです。
 
 

Sublime Text をインストール

ここでは Sublime Text のインストール方法を紹介します。

このテキストエディタをオススメする理由は

  • 無料
  • シンプル
  • 先ほど紹介した自動補完が設定不要で利用できる

の3つです。
 

個人的な感想になりますが、無料の中では一番無駄がなく使いやすいと感じました。

どのテキストエディタにするか迷っている場合はぜひ Sublime Text を使ってみてください🙂
 

Windowsでのインストール方法、Macでのインストール方法、共通の設定の順番で紹介します。

Windows

https://www.sublimetext.com/ にアクセスして「DOWNLOAD FOR WINDOWS」を押します。


 

ダウンロードしたファイルを開いてセットアップ画面が出たら「Next」を押します。


 

インストール先を選んで「Next」を押します。


 

エクスプローラのメニューに追加したい場合はチェックを入れて「Next」を押します。


 

「Install」を押します。


 

インストールが終わったら Sublime Text を開いてください。

 

Mac

https://www.sublimetext.com/ にアクセスして「DOWNLOAD FOR MAC」を押します。


 

ダウンロードしたファイルを開きます。


 

「Sublime Text」アイコンを「Applications」フォルダにドラッグ&ドロップします。


 

以下のようなメッセージが出たら「開く」を押して、アプリケーションを開きます。

 

Windows・Mac 共通 エディタの設定

インストールが終わって Sublime Text を開くと何も書いていないファイルが表示されていると思います。

表示されていない場合はメニューの「File」→「New File」を選択します。
 

そこに以下のコードをコピペしてください。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="urf-8">
    <title>HTMLファイル</title>
</head>
<body>
    <h1>こんにちは</h1>
    <p>このページはHTMLで書かれています。</p>
</body>
</html>

 
 

テキストエディタの色を変える

私のパソコンでは、このように黒い背景のテキストエディタになっています。


 

これを白い背景に変えてみます。(すでに白い背景の方は他の色に変えてみましょう!)

Windows の場合は「Preferences」→「Color Scheme…」
Mac の場合は「Sublime Text」→「Preferences」→「Color Scheme…」

を選択してください。

 

エディターの色は

  • Breakers
  • Celeste
  • Mariana
  • Monokai
  • Sixteen

の5種類から選択できるようになっているので、好きな色を選んでください。
 

私は Breakers を選択したので、このようになりました。


 
 

文字サイズを変更する

次に文字サイズです。

Windows の場合は、メニューの「Preferences」→「Font」
Mac の場合は、メニューの「Sublime Text」→「Preferences」→「Font」

を選択します。

Larger だと大きく、Smaller だと小さくなりますので、見やすい文字サイズに調整してみてください。
 
 

Windows

Mac

 

次に行うこと

これでコードを書く準備は整いました!
次回はPHPを実行するためのサーバーの準備をします。

第2回「ローカルサーバーを用意する」に進む
 

ABOUT ME
Sara
Sara
「わかりやすく・シンプル」をモットーに、携帯アプリ・ウェブアプリの作り方を紹介します。 独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています🙂

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です