icon
icon

プログラミングにも使える!TeraPadの使い方【初心者向け】

テキストエディタの【TeraPad(テラパッド)】の使い方を初心者向けに解説した記事です。プログラミングがWebサイト制作にも使えるので、TeraPadを使ってHTML/CSSを入力する方法も紹介しています。

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

プログラミングに使えるテキストエディタは複数ありますが、そのうちの1つであるTeraPad(テラパッド)について初心者向けにご紹介します。

 

インストール方法から簡単な使い方まで紹介しているので、ぜひ使ってみてください。

 

目次

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

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

 

 

TeraPadの特徴

TeraPadは、Windows上で動くフリーのテキストエディタで、Microsoft Windows 95/98/Me/NT4/2000/XP/Vista/7/8の動作する環境で使用可能です。

Windows標準搭載の『メモ帳』にはない、多くの機能を備えています。

  • HTMLファイルのタグが自動的に色分け表示される
  • 行番号が表示される
  • 元に戻すの回数が多い (標準で64回可能。メモ帳は、やり直しが1回しか効かない。)
  • ブラウザでのプレビュー機能がある

 

 

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

TeraPadのインストール方法

次に、インストール方法について解説していきます。

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

 

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

ダウンロードページにアクセスし、下図を参考に枠内をクリックし、ファイルをダウンロードします。

01

 

このようなメッセージが表示されたら、『実行』をクリックします。

02

 

ここで『はい』をクリックします。

03

 

2.インストール

ダウンロードができたらインストールを行います。

[次へ]をクリックしてください。

31

 

さらに、[次へ]をクリックします。

32

 

インストール先を確認し、 [次へ]をクリックします。

(※インストール先を変更する場合は、ここで「参照」をクリックします)

33

 

「はい」を選択し、フォルダを作成します。

37

 

さらに、[次へ]をクリックしてください。

34

 

これでインストール完了です。

35

 

「Readme.txt」のファイルが表示され、デスクトップに次のようなTeraPadのアイコンが表示されます。

38

 

 

TeraPadの使い方

ここからは基本的な使い方について紹介します。

今回は基本となる、ファイルの新規作成、ファイルの保存、上書き保存の方法を紹介します。

 

ファイルの新規作成

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

 

ファイルの保存

ファイルを保存する場合は、[ファイル]メニュー →[名前を付けて保存]を選択し、[ファイルの種類]を選択し、ファイル名を入力します。

 

上書き保存

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

68

 

なお、HTMLやJavaScriptなどを入力する際は、「全角スペース」を区別できるように設定することをおすすめします。

表示 > オプション > 表示 にある「全角空白」にチェックを入れると、全角スペースを入力した際に、四角のマークが表示されるようになります。

全角余白

 

 

コラム

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

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

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

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

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

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

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

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

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

 

1.TeraPadの起動

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

 

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

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

62

上のように記述すると、タグが色分け表示されました。

上書き保存をします。

 

3.ブラウザで確認

入力した内容をブラウザで確認しましょう。

ツールバーの[InternetExplorer]ボタンをクリックすると、ブラウザが起動します。

63

 

ブラウザが開き、きちんと反映されたことがわかりますね。

66

 

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

続いてCSSファイルも作成しましょう。

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

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

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

 

CSSのコードを記述し、上書き保存をします。

(※Webページ全体の背景色を『水色』にするという内容の記述)

64

 

 

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

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

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

65

 

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

再度ツールバーの[InternetExplorer]ボタンをクリックして、ブラウザを起動しましょう。

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

67

今回の記事は以上です。

 

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

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

また、現役エンジニアから学べる無料のプログラミング体験会も実施しているので、ぜひ参加してみてください。

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

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

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

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

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

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

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

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

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