文系エンジニアの学習日記

プログラミング未経験からIT業界に飛び込んだエンジニアの勉強日記

生身のNode.jsを使ったフォーム送信

※attention!!
このブログは学習日記というタイトル通り、個人の備忘録です。間違っていたらコメント欄でいろいろお申し付けください。
極力回答いたします。

前回の更新の続きとして、生身のNode.jsを使ったフォーム送信方法について紹介します。

★Contents
・expressを使ったフォーム送信
・生身のNode.jsを使ったフォーム送信
・両者の違い
・なぜ生身から先にやったほうがいいの?




●expressを使ったフォーム送信

前回の更新に少し補足します。
フォームの値をサーバーに送信して、画面に表示するときの動き

expressを使ったフォーム送信は、Body Parserというオブジェクトを使って行います。
書くことはこれだけです。

var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({extended:false}));

//POST処理
app.post('/', (req, res) => {
var msg = 'This is Posted Page!<br>' +
'あなたは「<b>' + req.body.message +
'</b>」と送信しました。';
res.render('index.ejs',
{
title:'Posted',
content: msg,
data:data,
link:{ href:url, text:'※別のページに移動'}
});
});

●生身のNode.jsを使ったフォーム送信

続いて、生身のNode.jsを使った方法について紹介します。
生身のNode.jsを使ってフォーム機能を使用するときのサンプルコードはこんな感じ
※あくまでも

//indexのアクセス処理

function response_index(request, response){
//POSTアクセス
if(request.method == 'POST'){
var body='';

//データ受信のイベント
request.on('data', function (data){
body +=data;
});

//データ受信終了のイベント処理
request.on('end', function(){
data = qs.parse(body);
addToData(data.id, data.msg, filename, request);
write_index(request, response);
});
} else {
write_index(request, response);
}
}

//indexのページ作成
function write_index(request, response){
var msg = "何か書いてください";
var content = ejs.render(index_page, {
title:'Index',
content:msg,
data:message_data,
filename:'data_item',
});
response.writeHead(200, {'Content-Type': 'text/html'});
response.write(content);
response.end();
}



●両者の違い

先ほど、expressと生身のNode.js2つの方法を使ったフォーム送信の方法について紹介しました。
expressを使ったときはbodyParserがデータの受信からparseまでやってくれていますが、生身のNode.jsでは、データの受信からparseまでの処理を手書きで書いています。

 

 

●なぜ生身のNode.jsから学習したほうがいいの?

前回更新で、実務で使われていないにもかかわらず、学習は生身のNode.jsから始めたほうがいいということを言いました。
この考えが該当するかどうかは、人によります。

◆理由

該当する人として、プログラミングを初めて学習する人、定着が怪しい人だと思っています。
なんで?というと、FWは、生身の言語を使うときと同じ機能をより少ないコードで実現するため、1行のコードに入っている意味は複雑になってきます。言い換えると、一つの単語の中に複数の単語の内容が内包されている状態のこと。

だから、要素の一つとしての単語の意味が分かっていないと、それが、なぜ便利なのか、どうしてこのように動くのかという理解をするのが困難な可能性が高いから。(かつての自分がたぶんそう)


だから、初心者といっても、FWの意味や意図を理解できてそれを言語化できる場合は、いきなりexpressから入っても良いかと思っています。

 

ただ、まず基本から、複雑なもの、新しいものは今やらなくてよいという主張は論外だろうと率直に思っています。


人間って、興味を持ったことしか覚えようとしないというのが現実ですから。まあ、人によっては、いわれたことをただやっていくだけの人もいますからこの主張が通じる場合も存在するでしょう。

最も妥当なプログラミングの学習方法としてはこういうことになるのかなと思います。

※あくまでも一例です。

1.興味を持った言語、FWについて自分が理解できると思った教材で学習する。
そして、実際に何か作ってみる。
2-A.物を作れたとき
そのまま次のステップに進む。
2-B.物が完成しなかったとき
なぜできなかったか考える。そして、その理由を明らかにする。(PDCAサイクルのC)
※難しいときは、経験者に聞いてみる(この選び方によって明暗が分かれる。詳細は別記事にて)
3.2で決めたプロセスを実際に行動に移す。(PDCAでいうA)
4.1~3を繰り返す。
 

端的に言ってしまうと、興味のあることから始めてまず何か作ってみる。そして、その結果に対してPDCAを回すに尽きるのでしょう。

 

●次回の更新とそれについての予告

 

上記にある、経験者に聞くというプロセスについて、この選び方を間違えるとどえらいことになります。

 

自分がこのどえらいことに足を踏み込んで危うい状態になるところでした。

 

そのことについて、自分の失敗談とその解決策とともに次回更新しようかと思います。

※大体こんな本が次回登場するかと思います。


あたらしい働き方

あたらしい働き方

※そういえば漫画版も出ていました。?

非常識な成功法則【新装版】

非常識な成功法則【新装版】

●前にも紹介しましたが、エンジニアライフのターニングポイントになった本

オブジェクト指向でなぜつくるのか 第2版

オブジェクト指向でなぜつくるのか 第2版