【プログラミング言語なでしこ】日本語でプログラミングを試してみよう！

2020年9月23日 2021年7月25日 9分8秒

プログラミングといえば、英語がメインだけど日本語でプログラミングできるというプログラミング言語が中学の教科書に載ったらしいです。プログラミング言語名は「なでしこ」。2021年度の中学校の教科書で採用されたということで気になってしまったので、今回はなでしこというプログラミング言語を見ていきたいと思う。

プログラミング言語「なでしこ」とは
- なでしこをインストールして使ってみる
なでしこでリアルタイムチャットを作ってみる
まとめ

プログラミング言語「なでしこ」とは

プログラミングといえば、こんな風に英語で書かれるのが普通ですよね。プログラミング言語の種類はたくさんあるけど、phpもrubyもjavascriptもgoも英語と同じ様な文で描かれます。こんなノリです。

だけど、なでしこというプログラミング言語は日本語でプログラムをかける。

「こんにちは」と表示・・・「こんにちは」が表示される
2+3を表示。・・・「5」が表示される

もろ日本語で実行できてなんか不思議な感じですね。変数なんかが使われるとこんな感じになるようです。

npmのサイトになでしこについてちょっと書かれていますね。HTML5/JavaScriptをベースとしている様です。

「なでしこ3」とは、日本語のプログラミング言語です。HTML5/JavaScriptをベースとしているので、PC/スマホ/タブレットなど、さまざまな環境で動作させることができます。

日本語プログラミング言語は、読みやすく理解しやすいのが特徴で、初めてでも楽しくプログラミングを覚えることができます。また、バッチ処理や定型処理などを手軽に記述できます。

npm nadesiko3

対応ブラウザはなでしこ対応ブラウザから見ることができるけど、大体のブラウザで使うことができるからあまり困ることはなさそうです。

なでしこをインストールして使ってみる

Webブラウザ版でも使うことができるけど、せっかくだからパソコンに入れて使ってみたい。macを使うことが多いから、macOS版の始め方からインストールしてみる。ちなみにwebブラウザ版はなでしこ簡易エディタから試すことができますよ。さくっと試したい方は簡易エディタから試してみるといいです。

macを使う場合はターミナルを開いてインストールすれば使うことができます。

Homebrewインストール

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Node.jsとなでしこインストール

# Node.jsのインストール
brew install node
# なでしこv3のインストール
npm -g install nadesiko3

インストールが完了したら、以下のコマンドを打ってみる。

nako3edit

するとこんな感じの画面がブラウザで開かれますね。新規作成からプログラムを書いて実行することができる。

エディタじゃなくてコマンド打つだけでブラウザ開いて、そっからプログラムを試せるのはさくっとできていいかもしれない。

なでしこでリアルタイムチャットを作ってみる

なんとなくなでしこのことは分かったけど、何か動くものを作らないとまだ見えてこないものもありますよね。なでしこニュースのページにいろんなニュースが載っているけど、その中にリアルタイムチャットを作ってみようというものがあったので、それをちょっとやってみたい。

さくっとできたものがこれなんだけど、文字を入力するとそれが画面に反映されるというもの。

早速作っていくんだけど、作るファイルは2つ。

クライアント側のファイル・・・画面を作るファイル
サーバー側のファイル・・・入力した文字を処理するためのファイル

コードの中身はこんな感じです。

// クライアント側
<!DOCTYPE html>
<script type="text/javascript"
src="https://cdn.jsdelivr.net/npm/nadesiko3@3.0.75/release/wnako3.js?run">
</script>
<html>
    <meta charset="UTF-8">
    <body>
    <h1>チャットクライアント</h1>
    <div>
        以下にメッセージを記入:<br>
        名前: <input type="text" id="name" value="クジラ"><br>
        内容: <input type="text" id="msg" value="テスト。"><br>
        <button id="sendButton">送信</button><br>
    </div>
    <div><h2>会話ログ</h2>
    <textarea id="logs" rows="10" cols="40"></textarea>
    </div>
    <script type="なでしこ">
    「チャットをはじめます。
    サーバーのアドレスを入力してください。」と尋ねるて、WSアドレスに代入。
    WS受信時には
    　「#logs」のテキスト取得して、Lに代入。
    　　L=対象＆改行＆L。
    　　「#logs」へLをテキスト設定。
    ここまで
    WSアドレスへWS接続。

    「#sendButton」をクリックした時には
    　　F名前=「#name」のテキスト取得。
    　　F内容=「#msg」のテキスト取得。
    　　「{今}> {F名前}: {F内容}」をWS送信。
    ここまで。
    </script>
</body></html>

// サーバー側
!「nadesiko3-websocket」を取り込む。
#--- 設定 ---
PORT=5001

#--- イベントの指定 ---
WSサーバ起動成功した時には
  「● WebSocketサーバ(ECHOサーバ)を起動しました」と表示。
  自分IPアドレス取得して反復
    「- ws://{対象}:{PORT}」を表示。
  ここまで
ここまで
WSサーバ起動失敗した時には
  「WebSocketサーバの起動に失敗しました」と表示。
ここまで
WSサーバ接続した時には
  IP=対象["connection"]["remoteAddress"]
  「クライアント{IP}が接続しました」と表示。
ここまで
WSサーバ受信時には
  「受信:{対象}」と表示。
  対象をWSサーバ全送信。
ここまで
#--- WebSocketを起動 ---
PORTでWSサーバ起動。

クライアント側のサーバー側のファイルを作ったら、クライアント側のファイルをブラウザに貼り付けて使ってみましょう。サーバーのアドレスは以下の様です。

これで実行すると画面上でチャットの様なことができますね。

さくっとできました。日本語で書いているのに動いているのはなんか不思議な気分。英語のプログラムを見慣れているからですかね。最初から日本語のプログラムを見たらもしかしたら、こっちの方がスッと入ってくるのかもしれない。文法とか学ばなくてもなんとなく、どんなことが起きるか分かってしまいますからね。もしかしたら、英語圏の人たちは最初からこんな感じなのかもしれない。