TechAcademy（テックアカデミー） Webアプリケーションコース プログラミング Ruby Rubyの文字化けを直す方法を現役エンジニアが解説【初心者向け】
icon
icon
Ruby

Rubyの文字化けを直す方法を現役エンジニアが解説【初心者向け】

初心者向けにRubyの文字化けを直す方法について現役エンジニアが解説しています。文字コードとは、アスキーコードから派生したShift-JISやUTF-8のことです。文字化けは表示に指定した文字コードと違う場合に起こります。Rubyでファイルに文字コードを指定する方法について解説します。

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

Rubyの文字化けを直す方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。

そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を読むとさらに理解が深まります。

 

なお本記事は、TechAcademyのオンラインブートキャンプRuby講座の内容をもとに紹介しています。

 

田島悠介

今回は、Rubyに関する内容だね！

大石ゆかり

どういう内容でしょうか？

田島悠介

Rubyの文字化けを直す方法について詳しく説明していくね！

大石ゆかり

お願いします！

 

目次

 

文字コードとは

文字コードとは、言葉として使われる文字を数値で表現をしているコードのことを指します。

この文字コードはASCIIコード（アスキーコード）が基本となっており、Shift-JISやUTF-8はASCIIコードｋら派生した文字コードです。

ASCIIコードではA〜Zのローマ字などを数値として表現していますが、大文字だけではなく小文字のa~zも１文字ずつコードで表現されています。

ASCIIコードではローマ字以外にも！、”、#、$、%、&、’、(、*などの特殊な文字やNULLやBS（バックスペース）なども同様のコードで表現されています。

このASCIIコードには日本語の表現がありませんが、日本語の文字を加えた文字コードにはShift-JISがあります。

他には、日本語以外にも多言語を表現することができる国際的コードとしてUTF-8があります。

UTF-8は国際的な文字コードとしてWeb上などでは多く使われています。
 

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

文字化けを起こす原因

文字化けを起こす原因としては、上記のような複数の文字コードがそれぞれ互換性がない文字あるというところです。

UTF-8で表現されている文字を、Shift-JISで表現すると「�」のような文字で表示されたりします。

また、エクセルのCSVファイルなどのバイナリファイルがShift-JISで表現されている場合にRubyでそのファイルを読み込んでしまうと、Rubyは文字コードがUTF-8となっているため、文字化けが発生していしまいます。
 

Rubyの文字化けを直す方法

文字化けを直す方法としては、開発環境として英語堅のブラウザやプラットフォームを使用している場合には、HTMLとしても確認が必要です。

headタグの中にmetaタグを記述をしてUTF-8の指定をすることも有効です。

(app/layout/application.html.erb)

<head>
  <% set_meta_tags charset: 'utf-8' %>
</head>

UTF-8ではないファイルを、以下のように記述しUTF-8として読み込みます。

(sample1.rb)

puts sample0.encode(Encoding::UTF_8)

 

まとめ

データの文字コードの形式は開発環境や元データによってさまざまです。他の文字コードなどのデータを変換することをエンコードと呼びますが、文字化けを解消するためにエンコードすることは必須となります。

まずは元のデータがどの文字コードで構成されていいるか把握することが大切です。
 

筆者プロフィール

木村勇土

TechAcademyの現役メンター。

現在は行政書士事務所を運営しており、お客様にはプログラマーやフリーランサーも多い。
WordPressを中心とした自社のWebサイトの修正などを行なっている。

 

大石ゆかり

内容分かりやすくて良かったです！

田島悠介

ゆかりちゃんも分からないことがあったら質問してね！

大石ゆかり

分かりました。ありがとうございます！

 

TechAcademyでは、初心者でもRuby on Railsを使ったプログラミングを習得できるオンラインブートキャンプRuby講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

記事を検索

関連するキーワード

関連する記事

Rubyで引数の型を確認する方法を現役エンジニアが解説【初心者向け】

Rubyで引数の型を確認する方法について解説します。   そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を...
Ruby

Rubyのmax_byを利用した配列要素の取得方法について現役エンジニアが解説【初心者向け】

Rubyのmax_byを利用した配列要素の取得方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 ...
Ruby

Rubyでblock文でbreakする方法を現役エンジニアが解説【初心者向け】

Rubyでblock文でbreakする方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 &...
Ruby

Ruby on Railsのroot_pathの使い方を現役エンジニアが解説【初心者向け】

Ruby on Railsのroot_pathの使い方について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します...
Ruby

Rubyのindexメソッドの使い方を現役エンジニアが解説【初心者向け】

Rubyのindexメソッドの使い方について解説します。   そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記...
Ruby

クラスの概念を理解しよう！Rubyのclassとは【初心者向け】

Rubyのクラスについて解説していきます。プログラミングを使っていく中で必要になる知識なので、何かよく分からないという方はぜひ知っておきましょう。 Rub...
Ruby

あわせてよく読まれている記事

今すぐ対策できる！HTMLで文字化けを直す方法【初心者向け】

今回はHTMLで文字化けを直す方法を説明していきます。 『Web制作で謎の文字が出て、意図した日本語が表示できない！』などとお悩みのみなさんは、ぜひこの記事を読んでみてください。 文字化け対策自体は、非常に簡単ですのでぜひ理解してくださいね！ 目次 文字化けが起こる原因 文字化けさせない書き方（文字化けの直し方） 実際に書いてみよう   文字化けが起こる原因 まずは文字を表示する仕組みと、文字化けが起こる原因をご説明します。   文字コード 「コンピュータは0と1の世界」と聞いたことがあるのではないでしょうか？ コンピュータ内で扱われているデータは、文章も画像も動画も、すべて数字の羅列です。   コンピュータが「この数字の羅列はこういう意味だ」という解読ルールを知っていて、人間に理解しやすい文章や画像に変換して画面に表示してくれるので、数字の羅列を意識しなくても使うことができます。   例えば文字も、「この数字がこの文字」という対応ルールがあります。 この数字と文字の対応ルールのことを、文字コードといいます。 文字 2進数 16進数 10進数 0 011 0000 30 48 A 100 0001 41 65 B 100 0010 42 66 a 110 0001 61 97 $ 010 0100 24 36 スペース 010 0000 20 32 改行 000 1010 0A 10   文章   　　　　　→　 I am a human ASCII (16進数)　→　73 32 97 109 32 97 32 104 117 109 97 110     コンピュータの世界で一般的に使われている文字コードに、ASCII（アスキー）があります。 アルファベットや数字や記号など、キーボードで半角入力できる文字のコードを定めるものです。 1文字を2進数8桁以内で表せるので、1文字あたりのデータ量は1Byteになります。 （ASCIIコード表  出展 Wikipedia  https://en.wikipedia.org/wiki/ASCII ）     ASCII文字は、どのコンピュータやスマホも同じように解読できます。 ASCII文字だけで作られている文章は、絶対に文字化けしません。 HTMLやCSSのコードも、ASCII文字だけで記述しますよね。   ASCII以外の文字コードと文字化け 人間が使う文字は、ASCIIで定められたアルファベットや数字以外にもたくさんあります。 ひらがな、カタカナ、漢字だけではなく、ロシア語も、タイ語も、アラビア語も。 多種多様な文字を表すのに、様々な文字コードがあるのです。   文字化けは、数字の羅列である文字データを、誤った文字コードで解読し表示したことにより発生します。 例えば、文字を書くときはひらがなの文字コードで書いたのに、表示するときにロシア語の文字コードで表示すると、正しく解読できませんね。   Shift-JISとUTF-8と日本語の文字化け Web制作をしていると、日本語で書いた文章を日本語で表示したいのに、文字化けしてしまうことがあります。 実は、日本語を表す事のできる文字コードは、よく使われているものが「Shift-JIS」と「UTF-8」の2つあるのです。 みなさんが直面する文字化け問題のほとんどは、この「Shift-JIS」と「UTF-8」の取り違えによるものでしょう。   「Shift-JIS」は、WindowsやMacなどのOS内で使われている、日本語専用の文字コードです。 ひらがな、カタカナ、漢字や、「１」「＠」といった全角の英数字が該当します。 WindowsやMacを使って、何も意識せずに記載した日本語の文章は、「Shift-JIS」の文字コードでデータになるのです。 1文字を2進数で16桁で表せるので、1文字あたりのデータ量は2Byteになります。   しかし、インターネットでつながる世界は、日本語以外に様々な言葉が使われていますね。 どんな言語でも包括的に表せるように作られた文字コードが「UTF-8」です。   例えば、日本語とロシア語とタイ語とアラビア語が混在したWebページを作る必要があるかもしれません。 例えば、Shift-JISの文字化けページをロシア人が見ても、そもそも何の文字コードで書かれているかわからず、直すこともできません。   そんな問題を防ぐために、UTF-8はどんな文字でも対応できます。 全世界で一般的に使われている文字のほとんどだけではなく、数学記号や音楽記号、古代文字、絵文字、麻雀牌まで表すことができます。 そのため、データ量は1文字あたり最大4Byte と、「Shift-JIS」などと比べ大きくなってしまうというデメリットもあります。   日本語 文字コードを間違えると文字化けします Shift-JIS 149 182 142 154 131 82 129 91 131 104 130 240 138 212 136 225 130 166 130 233 130 198 149 182 142 154 137
HTML

Pythonで文字コードを変換する方法【初心者向け】現役エンジニアが解説

Pythonで文字コードを変換する方法について解説します。 そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説した記事を読むとさらに理解が深まります。   目次 文字コードとは 文字コードを変換する書き方 実際に書いてみよう なお本記事は、テックアカデミーのPythonコースの内容をもとに紹介しています。   田島悠介 今回は、Pythonに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 文字コードを変換する方法について詳しく説明していくね！ 大石ゆかり お願いします！   文字コードとは 文字コードとは、文字を表す番号のことです。 コンピュータは数字しか処理できないので、人間の言語 (自然言語と呼ばれます) はコンピュータが理解できる形に変換してあげる必要があります。 文字コードは、それぞれの文字（イメージ）に対応する番号の一覧表です。 文字コードはいくつか種類があり、それにより見た目が同じでも番号が異なります。 例えば、Windowsで保存したファイルがMacで文字化けしてしまった経験はありませんか？ OSの違いによる文字化けは文字コードが違うことが原因です。 普段はあまり聞き慣れない文字コードですが、プログラミングを行う際、特に日本語を扱う場合には、知っておくと汎用性の高い知識です。   ASCII もっとも基礎的な文字コードで、「アスキー」と発音します。 半角英数字128文字から構成されており、全ての文字を1バイトで表します。 例えば「A」はASCIIでは0x41 (0xは16進数を表します) となります。 上記の0x41のような表現を、「バイト文字」や「バイト列」と呼びます。   Shift_JIS 日本語を扱うために用いられる文字コードで、全ての文字を2バイトで表します。 読み方は「シフトジス」です。 亜種の cp932 がWindowsで採用されていたことで広く使われていました。 例えば「あ」はShift_JISでは0x82E0となります。 Windowsでcsvやtxtファイルを取り扱う場合には、Shift-JISが用いられることが標準的です。   UTF-8 現在最も広く使われている標準的な文字コードで、全ての文字を1〜4バイトで表します。 世界中の文字を扱えるため、標準的に使われるようになりました。 例えば「あ」はUTF-8では0xe38182となります。 Shift-JISで「あ」を表現する場合とでは、対応する番号が異なっている事が分かりますね。 以前のPythonのバージョン2.x (xは任意の数字。2020年4月にサポート終了済) では、標準の文字コードは ASCII だったため、日本語を扱う際は、文字コードを宣言する必要がありました。 しかし、現在主流のPython のバージョン3.xでは、標準の文字コードはUTF-8となったため、文字コードを宣言することなく日本語を扱えるようになっています。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中文字コードを変換する書き方 Python の標準の文字コードは UTF-8 です。 また標準入出力（外部との情報のやりとり）も UTF-8 の文字列で行われます。 そのため、 Pythonのみでデータを取り扱う場合には文字コードを変換する場面は多くありませんが、Python以外のアプリケーションで生成したファイル (.txtや.csv) をPythonで扱う場合には文字コードにも注意が必要です。   ファイルから情報を入出力する場合 ファイルの文字コードを判別して入出力する必要があります。 詳しくは以下の記事を参考にしてください。 Pythonでファイルの文字コードを判定する方法   外部のプログラムなどとバイト列で文字列をやりとりする場合 文字列とバイト列との変換用に、関数が用意されています。 文字列をバイト列に変換するには encode メソッドを使用します。 '文字列'.encode('文字コード名')   逆に、バイト列を文字列に変換するには decode メソッドを使用します。 b'バイト列'.decode('文字コード名')   実際に書いてみよう 今回のサンプルプログラムでは、encode、decodeメソッド文字コードを変えてバイト列の内容を確認していきます。 実行はPythonインタプリタで行います。 コマンドラインで「python」と入力すると「>>>」と表示されますので、1行ずつプログラムを入力します。 はじめに文字列を UTF-8 のバイト列に変換してみましょう。 'こんにちは！'.encode('utf-8')   実行結果は以下のようになります。 b'xe3x81x93xe3x82x93xe3x81xabxe3x81xa1xe3x81xafxefxbcx81'   次に、同じ文字列を Shift_JIS の亜種である CP932 のバイト列に変換してみましょう。 'こんにちは！'.encode('cp932')   実行結果は以下のようになります。 UTF-8 の場合と実行結果が異なることが確認できます。 b'x82xb1x82xf1x82xc9x82xbfx82xcdx81I'   最後に、cp932 のバイト列を文字列に変換してみましょう。 b'x82xb1x82xf1x82xc9x82xbfx82xcdx81I'.decode('cp932')   実行結果は以下のようになります。 'こんにちは！'   Python 3.x では文字列は UTF-8 なので、encode・decode メソッドを使う機会は多くないかもしれませんが、文字コードを学んでおくとコンピュータが文字をどのように扱っているか、具体的なイメージをもってプログラミングを行えますね。   監修してくれたメンター 太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。開発実績：画像認識技術を活用した駐車場混雑状況把握（実証実験）、音声認識を活用したヘルプデスク支援システム、Pepperを遠隔操作するアプリの開発、大規模基幹系システムの開発・導入マネジメント地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。   大石ゆかり 内容分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   Pythonを学習中の方へ これで解説は終了です、お疲れさまでした。 つまずかず「効率的に」学びたい 副業や転職後の「現場で使える」知識やスキルを身につけたい プログラミングを学習していて、このように思ったことはありませんか？ テックアカデミーのPythonコースでは、第一線で活躍する「プロのエンジニア」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。 合格率10%の選考を通過した、選ばれたエンジニアの手厚いサポートを受けながら、人工知能（AI）や機械学習の基礎を完全オンラインでしっかり習得できます。 まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役エンジニアから教わること」を実感してみてください。 時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！
Python

Javaの文字化けについての対処方法を現役エンジニアが解説【初心者向け】

Javaの文字化けについての対処方法について解説します。実際にプログラムを書いて説明しているので、ぜひ理解しておきましょう。   そもそもJavaについてよく分からないという方は、Javaとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプJava講座の内容をもとに作成しています。     田島悠介 今回は、Javaに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 文字化けの対処方法について詳しく説明していくね！ 大石ゆかり お願いします！   Javaで文字化けの発生する原因 Javaは内部ではUNICODEという文字コードで文字を扱っています。 プログラムがJavaのみで完結している場合は基本的に問題ありませんが、例えばJavaを利用してファイルに対する入出力を行った際に文字化けが発生することがあります。 原因は、ファイルの文字コードがJavaの文字コードと異なる為です。 例えば、以下はメモ帳で作成した1行のテキストを、読み込むJavaのサンプルプログラムです。 Windowsのテキストエディタであるメモ帳で作成したファイルを、このプログラムで読み込みます。 import java.io.BufferedReader; import java.io.FileReader; import java.io.IOException; public class Sample { public static void main(String[] args) { try { //読み込みファイルのパスはご自分の環境に合わせて設定してください BufferedReader br = new BufferedReader(new FileReader("input.txt")); //１行読み込む String str = br.readLine();
Java

今さら聞けない！Rubyとは【初心者向け】｜現役エンジニアが解説

最近よく耳にする「Ruby」とは一体どのような言語なのでしょうか？ 今回はその「Ruby」の正体を解説していきたいと思います。Web系の企業でもRubyを使っているところは多いので、これからRubyを勉強してみたいという人はぜひ参考にしてみてください。 終わりには、学習方法もいくつか紹介しているので、自分の好きなやり方で勉強してみましょう。   なお本記事は、TechAcademyのオンラインブートキャンプRuby講座の内容をもとに紹介しています。   なお、今回の記事の内容は動画でもご覧いただけます。 テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。     田島悠介 ここではプログラミング言語のひとつ、Rubyについて解説していくよ。 大石ゆかり 田島メンター！！Rubyはどんな用途で使われる言語なんですか〜？ 田島悠介 一番よく使われているのはWebアプリケーションかな。動的なサイトを作るのにとても役立つんだ。有名なクックパッドなどもRubyを使用して作られているよ。 大石ゆかり なるほど。是非覚えてみたいです！   目次 Rubyとは Rubyでできること オブジェクト指向とは Rubyの動向 Rubyが日本で人気な理由 Rubyで開発が向いているサービス Rubyのインストール Rubyの書き方 Rubyの基本構文 Rubyの学習方法 Rubyの学習時のポイント   Rubyとは Rubyとは、まつもとゆきひろ氏により開発されたオブジェクト指向スクリプト言語です。 CやJavaといったコンパイラ言語は、プログラムを実行するためにはコンパイルという手続き（人間が書いたソースコードを機械命令に変換）を介して初めて実行ができます。 しかし、スクリプト言語はこう言った手続きが一切不要で、そのまま実行することができるため、コンパイラ言語に比べてプログラミングを手軽に行うことができます。   また、オブジェクト指向言語なので、すべてのデータがオブジェクトとして表現されています。 つまり継承などといったオブジェクト指向ならではの機能を使うことができます。 継承をすることで書くコードの量が少なくて済み、読みやすく作業効率も上がるでしょう。   Rubyの名前の由来ですが、宝石の「ルビー」から来ています。 Perl(パール)という名前のプログラミング言語がありますが、宝石の真珠(パール)と読み方が同じという点で宝石の名前を取ったようです。 なぜRuby(ルビー)なのかというと、当時のまつもと氏の会社の同僚が7月生まれで、7月の誕生石がルビーだったからです。 Ruby/Rails開発のためのおすすめエディタ/IDEも紹介しているので、合わせてご覧ください。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中Rubyでできること Rubyを使うメリットとして一番大きいのは、Ruby on RailsというWebアプリケーションフレームワークを使うことができるということです。 Ruby on Railsを使うと、WebサイトやWebベースの業務システムを効率良く開発できると言われています。 Rubyを使っている企業は多くあり、そのほとんどがRuby on Railsを使っているのでエンジニアとして活躍することも可能でしょう。   オブジェクト指向とは 従来のプログラミング言語では困難になってきた、大規模なソフトウェアの開発をより効率よく開発を行うために考え出された 概念です。 一般的に、以下の特徴を持っています。 カプセル化 継承 ポリモーフィズム（多態性） カプセル化 カプセル化とは指定の方法以外で外部からデータにアクセスできないようにすることです。 想定外のアクセスにより、本来書き換えてはならないデータを誤って書き換えることがなくなります。 たとえば、ゲームのセーブデータなどは簡単に書き換えられてしまう訳にはいきません。 そういったデータを書き換えられないようにするためにもカプセル化という機能は重要です。   継承 継承とは、既にある機能を受け継ぎ、効率よくソフトウェア開発を行うための機能です。 例えば、既にあるプログラムを一部改修を加え、新しく作り直したいことがあります。 そうした際に、一から作り直すのはかなり面倒です。 そこで、継承を利用することで既存の機能をそのまま再利用しつつ、新たな機能を定義することができるのです。   ポリモーフィズム（多態性） ポリモーフィズム（多態性）とは、同じ名前の機能（プログラム）を作成でき、それらが独立して存在できることです。 例えば、スマートフォンでは動画や音楽が再生できます。 この動画や音楽を再生するプログラムをPlayという名前でそれぞれ作ったとします。 この時、ポリモーフィズムの概念がないプログラミング言語(C言語など)では、同じプログラムが二重に定義されていますとエラーが出てきます。 ですが、RubyやC++などでは音楽ファイルなら音楽を再生し、動画ファイルであれば動画を再生することができます。 このように同じ名前のプログラムを複数定義でき、それぞれのデータに合わせて使うことができることをポリモーフィズム（多態性）と言います。   Rubyの動向 Rubyは現在も積極的に開発が進められています。 2020/5/23現在の最新の安定版は2.7.1です。また古いバージョンである2.4は公式サポートが終了しました。 最新の2.7系では多くの機能強化やパフォーマンスの改善が行われました。 詳しくは2.7.0のリリースノートを参考にしてください。 Ruby 2.7.0 リリース   フレームワークであるRuby on Railsも継続して開発が行われています。 2020/5/23現在の最新バージョンは6.0.3.1です。 こちらも最新の6.0系では、新しいフレームワークの導入やマルチデータベース対応など、多くの機能追加が行われています。 詳しくは6.0のリリースノートを参考にしてください Rails 6.0 (英語)   なお、毎年恒例のイベントであるRubyKaigi（ルビー会議）ですが、2020年のRubyKaigi2020はコロナウィルス感染症の影響で延期となっています。 ただし中止ではなく延期というのは嬉しいですね。 詳しくはリリース記事を参考にしてください。 新型コロナウィルス感染症（COVID-19）に関するRubyKaigi2020の対応について   Rubyが日本で人気な理由 国内のWebサービスとしては、クックパッドや食べログなどがRubyを利用していることは有名です。 では、なぜRubyが使われているのでしょうか？   一つは、Rubyの開発効率の高さです。 Rubyは「Enjoy for Programing!」を掲げており、プログラマーにとってコーディングしやすいプログラミング言語となっています。 直感的に、実装したい機能をコーディングできるためストレスフリーで開発を行うことができます。   そして、フレームワーク（Ruby on Rails）の存在です。 「Ruby on Rails」とはRubyのWebアプリケーションフレームワークであり、数回のコマンド入力を行うだけで、Webサイトが自動生成できるRuby on Railsは大幅な開発工程の短縮を実現しました。 このRuby on Railsの登場により、開発コスト削減を図る企業などでの利用が増加しました。 また、スタートアップ企業などがWebサービスを立ち上げるために、Ruby on Rails を利用していることも多いです。   また、Rubyは日本で開発されたプログラミング言語であることも利用されている理由の一つです。 C++やJavaといったプログラミング言語の最新情報は英語で書かれていることが多く、それら最新技術を利用するには、一定の英語スキルが必要になります。 また、有用な参考書なども英語で書かれていることが多く、それらの翻訳されたものは、誤訳されたものもあります。 しかし、Rubyは開発者が日本人ということもあり、日本語で書かれた有用な参考書が数多く手に入ります。 そのため、最新情報をいち早く活用することもできるのです。   Rubyでの開発が向いているサービス Rubyは前述の通りRailsと組み合わせてRuby on Railsとして開発を行うことが一般的です。 Ruby on Railsは以下のようなサービスの開発に向いています。   スタートアップ企業のWebサービス Ruby on Railsは開発効率が高いため、少人数での短期開発に向いています。 スタートアップ企業のWebサービスは短期間での継続的なローンチが求められます。 Ruby on Railsはいわゆるアジャイルと呼ばれる開発手法にも適しており、少人数でサービスの基本機能を立ち上げ、ユーザーのフィードバックを得ながら継続的にサービスを改善していくことに適しています。   WebAPI経由でのサービス展開 WebAPIとはプログラムから利用するインターネット上のサービスです。 例えばGoogle MapやTwitterなど、多くのサービスがWebAPIを提供しています。 WebAPIのメリットは既存のサービスを組み合わせて新たなサービスを生み出せることです。 例えば気象データを提供するWebAPIをECサイトのサービスと組み合わせることで、他にはない特徴的なサービスを提供できるかもしれません。 Ruby on RailsにはAPIモードという構成があり、アプリケーションを構築する際にAPIモードを選択することでWebAPIを効率よく開発することができます。   データベースと組み合わせた基幹系システム 意外かもしれませんが、Ruby on Railsは大量のデータ処理や、複雑な計算を行う企業の会計などの基幹系システムのサービス開発にも向いています。 Ruby on RailsはMVCと呼ばれる安定的なサーバアーキテクチャをベースとしています。 またデータベースとの連携についてもモデルクラスによるアクセスやコネクションプールなどに標準的に対応しています。 レガシーシステムを更新する際の選択肢として考えても良いでしょう。   Rubyのインストール Rubyでプログラムを書こうと思ったらまず、Rubyをインストールする必要があります。 手順としては、 Ruby のダウンロードページ からダウンロード(執筆時最新版Ruby2.7.1)。Windowsであれば、RubyInstallerというツールでのインストールも可能です。 ダウンロードしたファイルを実行し、インストール。 インストールが完了したら、ターミナルやコマンドプロンプトから「ruby -v」と入力し、バージョンを確認。 ruby 2.7.1などと表示されれば完了です。   田島悠介 RubyはWindowsとMacの両方で使用することができるよ。 大石ゆかり やっぱりそれぞれによって開発環境の構築の方法がだいぶ違うんですか？ 田島悠介 そうだね。また、インストールに必要なソフトがあったりと少し複雑なので、なるべく最新の情報を見てひとつずつ順番にやってみるのがいいと思うよ。公式のインストールガイドも参照しよう。   Rubyの書き方 Rubyのファイルは「.rb」という拡張子をつけることで保存されます。 実際にターミナル上にHello,world!を出力するプログラムを例に書き方を紹介したいと思います。 print("Hello,world!n") この一文だけで目的のプログラムを作ることができます。 他の言語では文末にセミコロンを打ちますが、Rubyではそれが必要ありません。 他のプログラミング言語を少しでも学習したことがある方は、Rubyがいかにシンプルであるかが分かるかと思います。 実際にRubyを使ってみたいという方は、開発環境の構築方法も合わせてご覧ください。   Rubyの基本構文 Rubyでよく使う基本構文についていくつかまとめて紹介していきます。 基礎的な内容になるので、Rubyとは何かよく分からないという方でも覚えておくと今後役に立つでしょう。 if文 if文は「◯◯の場合〜〜する、△△の場合〜〜する」といった条件分岐の処理を行うことができます。 「ログインできたらアカウント画面に、できなかったらエラー表示に」といった普段Webサイトを見ていると当たり前のように行なわれている処理が条件分岐なのです。 if ◯◯ then # ◯◯がtrueだった時の処理 else # ◯◯がfalseだった時の処理 end   for文 for文は、繰り返し処理をする際に使います。1+2+3+4+…のように手動で足していくのは面倒ですが、「1ずつ増えた数字を繰り返し足して、100まで繰り返す」といった宣言を行うことができるようになります。 for i
Ruby

HTMLで文字エンコードを指定する方法を現役デザイナーが解説【初心者向け】

HTMLで文字エンコードを指定する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 そもそも、HTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプ、Webデザイン講座のHTMLカリキュラムをもとに執筆しています。   田島悠介 今回は、HTMLに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 文字エンコードを指定する方法について詳しく説明していくね！ 大石ゆかり お願いします！   エンコードとは ファイルなどを形式が異なる他のバイナリデータに変換することです。作業としては、コンピュータが読み取れるデータに変換することです。 HTML文書の場合は、単純にブラウザが読み取れるデータに変換することです。なお、近年のブラウザは、ファイルの保存形式までUTF-8に合わせなくても、HTMLのコードにてUTF-8に指定するだけで、文字化けについて、おおむね防止できます。   文字エンコードする理由 ファイルに保存されたデータの保存形式には、幾つか種類があります。米国の英数字列の表現だけだと、日本語（ひらがな、漢字など）や諸外国の文字や数字を表現できないため、データの保存形式が幾つも派生してしまいました。 現在では、UTF-8と呼ばれる国際的な保存形式が実現されていますので、特に理由がなければ、UTF-8にて保存するべきですが、過去には、特定の保存形式（EUC-JP）しか読み込めれない仕様になっていました。この専用の仕様によって、ブラウザにWebページを表示させた時に、文字化けすることが多々ありました。 文字化けが発生する主な原因としては、SHIFT-JISなどの形式にて保存されたデータがEUC-JP専用の読み取りに処理された結果が顕著でした。サンプルとして、文字化けした場合、下図の表示になります。 「文字化け」のテキストが「��絖����� 」のテキストになって表示されています。この現象を防止するために、htmlでは、文字コードを指定することができます。次項の「文字エンコードを指定してみよう」では、文字化けを防ぐための記述方法を紹介します。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中文字エンコードを指定してみよう HTML文書では、headタグの内部にメタ情報として指定します。 <head> <meta charset="utf-8"> </head> サンプルコードとして、HTML文書の基本は以下になります。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title></title> </head> <body> 文字化けを防止します。 </body> </html> 実際に、「index.html」を作成してから、上記のコードをコピーアンドペーストにて移してから、確認してみましょう。   監修してくれたメンター 井内洋平 TechAcademyの現役メンター。 元Web Developerで、趣味は貯金、節税対策、投資信託、株式投資、FXなど多岐にわたる。   大石ゆかり 内容分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！ TechAcademyでは初心者でも、オリジナルWebサイトを公開できる、オンラインブートキャンプを開催しています。 また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。
HTML

HTMLでコピーライト記号©を表示する方法を現役デザイナーが解説【初心者向け】

HTMLでコピーライト記号©を表示する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 目次文字コードとは文字化けを起こす原因Rubyの文字化けを直す方法まとめ筆者プロフィール そもそもHTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。   田島悠介 今回は、HTMLに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 コピーライト記号©を表示する方法について詳しく説明していくね！ 大石ゆかり お願いします！   コピーライト記号とは コピーライト記号とは「©」と表示され、著作権を表明するための簡略化された記号です。 この記号に続けて、著作物が作られた年と、著作権の所有者である団体や個人の名称（屋号）を記述します。 コピーライトの表記はWebサイトの最下部に記されていることが多く、もはや1つの慣習として表記しているケースがほとんどです。 ちなみに、現在ご覧になっているテックアカデミーマガジンのコピーライト表記は以下の通りです。 注意点として、コピーライト記号「©」が特殊文字のため、HTMLにそのまま記述すると文字化けを起こす場合があります。 特殊文字の思わぬ文字化けを防止するために、記号部分を「実体参照」として記述する方法があります。   実体参照とは 実体参照とは、HTMLにそのまま記述すると文字化けを起こす可能性のある特殊文字を、ブラウザで問題なく表示させるために使用される書き方です。 実体参照には「文字実体参照」と「数値文字参照」の2種類がありますが、以降のコピーライト記号を表示する方法では「文字実体参照」を使用して説明します。 実体参照の表記ルールとしては、「&」から始まり「;」で終わる連続した文字列になっています。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中HTMLでコピーライト記号を表示する方法 文字コードの確認 まずは、HTMLに定義されてある文字コードを確認しておきましょう。 headタグ内のメタ情報に以下の記述があるか確認します。 <meta charset="utf-8"> 上記のように文字コードの種類が「utf-8」の場合は、実体参照の記述を用いなくても、コピーライト記号などの特殊記号は表示できます。   逆に、以下のように文字コードの種類がutf-8以外であった場合、特殊記号を用いると文字化けを起こします。 <meta charset="euc-jp"> いかなる文字コードの場合でも特殊記号が正常に表示されるよう、実体参照を使用して記述しておけば安心です。   コピーライト記号を表示してみよう コピーライト記号は実体参照を使用した場合、&copy;と記述します。 以下は、コピーライトの表記例です。 See the Pen 実体参照によるコピーライト表示 by nomallica (@nomallica) on CodePen.   まとめ 今回は、HTMLでコピーライト記号©を表示する方法について解説しました。 HTMLの文字コードの種類が「utf-8」の場合は「©」をそのまま記述しても表示はされますが、文字コードの変換が起こった場合などに文字化けが起こらないよう、実態参照を用いて記述しておくと安心です。 実体参照は「&」から始まり「;」で終わる連続した文字列です。 コピーライト以外にも「&」や「<」などのソースコードに使われる文字をそのまま表示したい時にも実体参照はよく用いられていますので、表示したい内容によって適宜取り入れていきましょう。   大石ゆかり 内容が分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   HTMLを学習中の方へ これで解説は終了です、お疲れさまでした。 つまずかず「効率的に」学びたい 副業や転職後の「現場で使える」知識やスキルを身につけたい HTMLを学習していて、このように思ったことはありませんか？ テックアカデミーのWebデザインコースでは、第一線で活躍する「プロのWebデザイナー」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。 合格率10%の選考を通過した、選ばれたWebデザイナーの手厚いサポートを受けながら、オリジナルのWebサイト制作を学べます。 まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役Webデザイナーから教わること」を実感してみてください。 時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！
HTML

あなたの目的に合わせて学べるコース

副業したい方

Web制作の力を身につけ
副業までサポート

はじめての副業コース

転職したい方

未経験から16週間で
エンジニアに

エンジニア転職保証コース

スキルアップしたい方

AIも統計解析もできる
Pythonを学ぶ

Pythonコース

※ 経済産業省の第四次産業革命スキル習得認定講座で、厚生労働省指定の専門実践教育訓練給付制度の対象です。条件を満たすことで支払った受講料の最大70％（最大306,460円）が給付金として支給されます。詳しくは エンジニア転職保証コース のページ内の注意事項をご確認ください。

TechAcademyから
現役エンジニアの方へ
お知らせ

テックアカデミーGAIナレッジベース
TechAcademy（テックアカデミー） Webアプリケーションコース プログラミング Ruby Rubyの文字化けを直す方法を現役エンジニアが解説【初心者向け】