オーダーメイドコース
icon
icon

テキストエディタ「Notepad++」の使い⽅ 【初⼼者向け】

Windowsで使えるテキストエディタ「Notepad++」の使い⽅を初心者向けに解説した記事です。シンプルなエディタですので、これから使い始める人でもすぐに使いこなすことができます。インストール方法から、基本的な使い方まで紹介。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査

プログラミングに使えるテキストエディタは数多くありますが、今回はNotepad++(ノートパッド・プラス・プラス)の使い方を初心者向けに解説します。Notepad++はWindows上で動作する初心者にも使いやすい日本語での利用が可能なテキストエディタです。

インストールから、htmlを記述する簡単な例までを紹介しますので、ぜひ一度試してみてください。

 

なお本記事は、オンラインのプログラミングスクールTechAcademyの内容をもとに紹介しています。

 

目次

本記事は以下の流れでご紹介します。

 

 

Notepad++の特徴

使い始める前に、Notepad++の特徴を知っておきましょう。

Notepad++はWindowsのメモ帳と同じような操作方法ですので、初心者でも直感的に使うことができます。 その後、使い方に慣れてきて自分なりの使い勝手を求めるようになった場合にも応用力が高く、さまざまなカスタマイズが可能です。また、高機能でありながら動作も軽く、ノートパソコンでも軽快に使用することができます。

Microsoft Windows (95/98/NT/2000/XP/Vista/7), Windows, Windows 95/98/ME, Windows NT/2000, Windows XP)の32bit版で動作するとなっていますが、Windows7の64bit環境でも問題なく動作しました。
他には下記のような特徴があります。

  • さまざまな文字コードへの対応
  • ブックマーク
  • 拡張子ごとの強調文字指定(さらに括弧なども強調表示可能)
  • 画面分割(2画面同期スクロールも可能)
  • ズーム
  • 自動アップデート

 

 

ではインストールから始めて実際に使用してみましょう。

[PR] プログラミングで挫折しない学習方法を動画で公開中

Notepad++のインストール

ここからは、インストール方法について解説します。

※本記事のインストール環境はWindows7です

 

1.ダウンロードページへアクセス

ダウンロードサイトのリンクから、インストーラーパッケージをダウンロードしてください。

notepadpp_0001

 

画面を下にスクロールすると現れる緑のバーの「ダウンロードファイル一覧」をクリックして、全てのファイルを表示させてください。

notepadpp_0002

 

このなかから、npp.5.9.installer.exeをクリックしてダウンロードしてください。

ファイル名の数字はバージョンアップされると変化します。

notepadpp_0004b

 

2.インストール

ダウンロードしたexeファイルをダブルクリックします。

このようなメッセージが出るので「実行(R)」をクリックします。

notepadpp_0029

 

ここで下記のようなメッセージが出るので、日本語表示のメニューになるようにインストールしたい場合はJapaneseになっていることを確認して、「はい(Y)」をクリックします。

notepadpp_0006

 

下記のような画面が出るので「次へ(N)>」をクリックします。

notepadpp_007x

 

「次へ(N)>」と進んでいくとこのような画面が出るので、リストを下にスクロールし「Create Shortcut on Desktop」にチェックを入れて「次へ(N)>」をクリックします。これでインストールが始まります。インストールが終わるとデスクトップにショートカットが作成されます。

notepadpp_0011

 

インストールが終わると下記の画面になります。この画面のまま「完了(F)」をクリックしてください。初期設定と起動がおこなわれます。

notepadpp_0012

 

プラグイン(後から追加する機能)のアップデート画面が開きます。インターネットに繋がっている場合は、「Update Selected」をクリックしてください。インターネットに繋がっていない場合はアップデートできないので、「Cancel」を押してください。

notepadpp_0013

 

アップデートが終了し、Notepad++の再起動を確認する画面です。「はい(Y)」をクリックしてください。Notepad++が自動的に再起動します。

notepadpp_0014

 

再起動が完了するとNotepad++が自動的に起動します。下記のように簡単な説明が最初に表示されます。

これでインストールは終了です。この画面は一度閉じてください。

notepadpp_0015

 

また、デスクトップに下記のショートカットが作成されます。次回からは、このアイコンをダブルクリックするとNotepad++を起動することができます。

icon

 

 

Notepad++の使い方

Notepad++のインストールができたら、基本的な使い方を覚えていきましょう。

今回は必ず使用する、ファイルの新規作成、ファイルの保存、上書き保存の方法を紹介します。

 

ファイルの新規作成

ファイルを新規作成する場合は、[ファイル]メニュー →[新規作成]を選択します。

notepadpp_0017

 

ファイルの保存

ファイルを保存する場合は、[ファイル]メニュー →[名前を付けて保存]を選択し、[ファイルの種類]を選択し、ファイル名を入力します。画面では、c:sample というフォルダに保存しようとしている例になります。

notepadpp_0021

notepadpp_0030

 

上書き保存

ファイルを上書き保存する場合は、[ファイル]メニュー →[上書き保存]を選択(または、[上書き保存]ボタンをクリック)します。

notepadpp_0022

notepadpp_0024

まずはこれらの使い方だけおさえておきましょう。

 

 

HTML/CSSを入力してブラウザに表示する

少し応用編です。

実際にNotepad++を使って、HTMLファイルとCSSファイルを作成してみましょう。

 

1.Notepad++の起動

デスクトップにあるNotepad++のアイコンをダブルクリックして起動します。

 

2.HTMLファイルの作成と保存

[ファイル]メニュー →[名前を付けて保存]を選択して、ファイル名を[index.html]として保存してください。

下記の画像のようにHTMLを記述すると、タグが色分け表示されたことがわかります。また、htmlのタグで四角の記号が現れるので、どのように区切られているのかわかりやすく表示されます。

ここで上書き保存をしてください。図では、c:sampleのフォルダに保存しています。

notepadpp_0027

3.ブラウザで確

入力した内容をブラウザで確認しましょう。保存したindex.htmlをダブルクリックすると、デフォルトのブラウザで開くことができ、内容を確認することができます。また、保存したファイルをドラッグ&ドロップでブラウザに持っていくと確認することができます。

 

4.CSSファイルの作成と保存

CSSファイルもindex.htmlの場合と同じ方法で作成しましょう。

Notepad++に戻り、[ファイル]メニュー →[新規作成] を選択します。

一つの画面内にタブが新しく作られ、何も書かれていない空の画面が開きます。

[ファイル]メニュー →[名前を付けて保存]を選択し、ファイル名を[style.css]として保存してください。

※保存場所は、[index.html]と同じ場所にする必要があります。

※CSSのコードを記述し、上書き保存をします。図では、c:sampleに保存しています。

※この例では背景を水色にします。

notepadpp_0025

5.HTMLファイルにCSSファイルへのリンクを追記

[index.html]に戻り、HTMLファイルに下記のように追記し、上書き保存をします。

(※CSSファイル[style.css]へリンクするという内容の記述)

<link href=”style.css” rel=”stylesheet” type=”text/css”>

notepadpp_0026

6.再度、ブラウザで確認

先ほど保存した、index.htmlのファイルをダブルクリックしてください。

CSSが適用され、Webページの背景色が『水色』に設定されたことが確認できます。

notepadpp_0031

今回の記事は以上です。

ぜひ実際にインストールして使ってみてください。

 

他のWindows対応のテキストエディタを使ってみたい場合は、TeraPadの使い方も合わせてご覧ください。

[お知らせ]TechAcademyではプログラミング初心者でも最短4週間でエンジニアになれるオンラインブートキャンプを開催しています。特別な開発環境の構築なしでプログラミングを学ぶことができます。