icon
icon

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

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

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

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

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

 

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

 

目次

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

1時間でできる無料体験!

 

 

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

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

 

 

コラム

コスパとタイパ、両方結果的に良くなる良くなる学び方とは?

「スクールは高いし時間も縛られて効率が悪い」と考える方は多いと思います。
もちろん、時間も費用もかかることは間違いありません。
ただ 結果的に無駄な学びにお金も時間もかける方がリスクが高いという考えもあります。

コスパ・タイパ最適化の参考として、 テックアカデミー卒業生がスクールを選んだ理由 をご紹介します。

  • ・困ったときに、質問や相談できる相手がいるため挫折しなかった
  • ・プロとして必要なスキルのみを深く学べたので無駄がなかった
  • ・副業案件の提供と納品までのサポートがあったので目的を達成できた

安価・短期間で広く浅く学んでも意味がありません。 本当に自分の目的が達成できるか、それが重要です。
自分にどのスキルや学び方が合っているか、どんな学習方法かなど、お気軽に 無料相談 に参加してみませんか?

カウンセラー・現役のプロへ、何でも気軽に無料相談可能。 30分か60分お好きな時間が選べて、かつ3回まで すべて無料で ご利用できます。
無理な勧誘は一切ない ので、お気軽にご参加ください。

今なら相談した方限定の割引・参加特典付き! 無料相談はこちら

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週間でエンジニアになれるオンラインブートキャンプを開催しています。特別な開発環境の構築なしでプログラミングを学ぶことができます。

初心者・未経験でもできる。まずはテックアカデミーに相談しよう

プログラミングを独学で学習していて、このように感じた経験はないでしょうか?

  • ・調べてもほしい情報が見つからない
  • ・独学のスキルが実際の業務で通用するのか不安
  • ・目標への学習プランがわからず、迷子になりそう

テックアカデミーでは、このような 学習に不安を抱えている方へ、マンツーマンで相談できる機会を無料で提供 しています。
30分間、オンラインでどんなことでも質問し放題です。

「受けてよかった」と感じていただけるよう カウンセラーやエンジニア・デザイナー があなたの相談に真摯に向き合います。

「自分に合っているか診断してほしい」
「漠然としているが話を聞いてみたい」

こんなささいな悩みでも大丈夫です。

無理な勧誘は一切ありません ので、まずはお気軽にご参加ください。
※体験用のカリキュラムも無料で配布いたします。(1週間限定)

今なら参加者限定の割引特典付き! 無料相談を予約する