_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
◇ 今年の冬は寒いですね ・・・・・・ 第712
☆モバイルオフィスの作り方 ★
Vol.0712
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
□ VS-Codeの良いところ
□ とても簡単な今どきのプログラム
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
☆ VS-Codeの良いところ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
自慢ではないですが私はVS-Codeをほとんど使ったことがありません。
使おうと思ってあれこれと調べたのですが、結局使わないままで今に至ります。
したがって今回の記事はかなり無責任ですが・・・・
◇ エディターを探した
VS-Codeにたどり着いたのは当時私がWindows以外のOSで仕事をすることを(可
能性を)考えていたからです。
けっしてWindowsに不満があるわけではないのですが、RasberyPI400と言う
キーボード一体型のラズパイが出ると聞いてとても興味を持ったのです。
https://raspberry-pi.ksyic.com/main/index/pdp.id/667,668/
キーボード一体型だなんてまるでPC-6001や8001のような遠い昔のパソコンを
思い出すではないですか。
でもRasberyPIはLinuxですから秀丸はありません。そこでもしも・・・もしも
RasberyPIに仕事を引っ越ししてもプログラミングをしたり書き物をするとき
に困らないようにエディターを探したのです。
まず見つけたのは”Atomエディター”でした。比較的歴史は浅いのですがなか
なか評判が良くて、これが本命か??と思ったのです。
https://ja.wikipedia.org/wiki/Atom_ (%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%E3%82%A8%E3%83%87%E3%82%A3%E3%82%BF)
ところがこの手の話題に明るい”歩くIT辞典”である若者に相談したところ、
なんと”ATOMはもう古い!これからはVS-Codeでしょう!”と言われたので調
べてみることにしたのです。
◇ VS-Codeを使ってみた
私はかなり長い間、MicrosoftさんのVisualStudioで仕事をしてきましたからV
S-Codeの良いところは直感的に分かりました。
少し文字を入力すると欲しいコマンドのリストが現れ、プロパティーやメソッ
ドも表示されます。
入力ミスなどはその都度警告してくれます。
例えば"document.getElementById"と言ったJavaScriptの長いコマンドなどもd
ocumentと入力した段階でそのメソッドの候補を挙げてくれるのです。
何より良いのは構文ミスをすぐに見つけてくれることですね。
例えば”if(CuCode == "123){”と書くべきところを”If(CuCode == "123){”
と書けばすぐの先頭のIは小文字でないといけないと教えてくれます。
長い間親しんできたVisualStudioのプログラミングエディターにいるようです。
その安心感は半端ではありません。
◇ じゃあなんで使わない??
そうなんですよ、今でも日々のプログラミングは秀丸でやっています。
秀丸はプログラミングエディターとして優れた機能をたくさん備えています
が、VS-Codeのようなプログラミング言語ごとの記述の支援まではしてくれま
せん。
エラーだって細かくは指摘してくれないです。
だったらVS-Codeを使えば??と自分でも思うのですが、アレを使うと・・
・・アホになります。
例えばJavaScriptだったら日常使うほとんどの構文は支援してもらえますが、
新しい構文やあまり一般的では内構文の支援はしてもらえませんし、何より本
当に何かに頼りたいのはそういった場面なのです。
私はSSSreadというExcelのような部品を作り、Excel風のオートフィルターを
作りました。
私の仕事の中で”開発者モード”の時のことです。
そんなときは使えそうな技術を総動員してどこにも説明書のない部品を作るの
ですが、そんなときにはあまり役には立ちません。
そもそも私が本当に作りたいものを作っているときにはインターネットの記事
もあまり役に立ちません。よほど自分は変わったことを(もしくは出来ないこ
とを)試みているのだろうな・・・・と思います。
◇ でもプログラマモードでは絶大な効果が・・・・
でも私の仕事の9割は普通のプログラマです。難しい部品を作るのではなく、
それを使う立場です。
そんなときにはVS-Codeは間違いなく絶大な効果を発揮します。
些細な入力ミスでWEBサーバーに送信したプログラムがうまく稼働せず、原因
を探すのは日常茶飯事ですが、その半分以上はつまらない入力ミスです。
変数の先頭を大文字で宣言しているのに使う場面では小文字だとか、そもそも
宣言を忘れているとか・・・そういった日常的なミスは大部分、VS-Codeがサ
ポートしてくれるようです。
特にLinuxやUNIXへいってもVS-Codeはあるそうなので、いずれそこへ行く日が来
るのかも知れません。決して嫌いではなく、特にHTML版が出たことで好意を
寄せています。
でも今のところは・・・秀丸でプログラミングします。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
☆ とても簡単な今どきのプログラム
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
マナベの楽しいプログラミング講座の続きです。
遠く40年近く前にメインメモリが5KBの小さなPC(ポケットコンピュータ)で簡単
な損益計算書を作ったという話題でした。で・・・今ならどうする??と言うの
が今週のテーマです。
◇ 道具は準備できたし・・・
VS-Codeをもらってきて自身のPCにセットアップしたとして、WEBサーバーは借
りたとしましょう。
例えばサクラサーバーならかなり高性能なサーバーを500円/月で貸してもらえ
ます。
要領は100Gで先ほど話題の5KBの200倍で1Mであり、その100倍のさらに1000倍
が100Gですね。
そこそこの企業の全システムのデータを格納しても写真や動画がなければ充分
おつりが来る要領です。
https://rs.sakura.ad.jp/
(このうちのスタンダードがお勧め)
まあ・・・これを借りているとしましょう。
プログラムはHTMLとJavaScriptで書きます。
どちらもプレーンなテキストですから秀丸やVS-Codeがあれば充分ですね。
そして出来たプログラムをサクラサーバーの借りている領域にアップする道具
はFTPソフトで、私は無償のWinSCPをお勧めします。
https://winscp.net/eng/docs/lang:jp
簡単に作ったテストプログラムをWinSCPを使ってサクラサーバーにアップしま
す。どこにアップするかって???
◇ プログラムをアップする場所
例えばサクラサーバーなら借りたときに決めたドメイン名があります。
仮にsoftgと言うドメイン名だとすると・・・・
https://softg.sakura.ne.jp/TestSys/test.htmlと言う具合にアップします。
借りた領域の先頭(..)の下に”home”というフォルダーがあり、そこには”so
ftg”と言うフォルダーが用意されています。さらに"www"と言うフォルダーが
あってここがWEB領域です。
..---+
|
+-- home--+
|
+--softg--+
|
+--www--+
|
+--Test--+
|
+Test.ttml
このwwwまでは500円払って契約した段階でサクラサーバーさんが用意してくれ
ます。
ここにプログラムを置くためのTestSysと言うフォルダーをWinSCPで作るのです。
当分はここがあなたの仕事場です。
WinSCPはWindowsでいうファイルエクスプローラとよく似ていて、フォルダー
を開いたりファイルをコピーしたり出来ます。
違うのは二つの領域があり、一つは自分のPCでもう一つはさくらインターネッ
トの借りている領域きだと言うことです。
どうやってこの領域にLoginするのかって???
サクラインターネットさんの契約書に説明がありますし、WinSCPの説明書にも
書いています。
そんなことをここで説明していたら10回分ぐらいを使ってしまいます。
自分で調べてください。
◇ プログラムを書く
作りたいものが私と同じで売上や経費を入力しては記録する道具だとしましょ
う。
最後には損益計算書を集計するとして・・・・
まずはHTMLでフォームを作らないといけません。フォームとはタイトルがあ
り、入力するための箱(一般的にはテキストボックス)があって、そこに例えば
”8111”といったコードを入力するとすぐ右の科目の場所に”プログラム売上”
とか言った商品名が表示され、さらにカーソルは右の金額のテキストボック
スに移動し・・・と言う入力インターフェースです。
これはかなり苦労します。単なるHTMLでも作れますし、少し凝った専用の
パーツを使うことも出来ますが、ここは原点のテキストボックスだけで作って
みましょう。
縦に5個、横に3個のテキストボックスを準備してください。
HTMLをどう書けば良いかはインターネットを参考にしましょう。
https://proengineer.internous.co.jp/content/columnfeature/5092
今日はとりあえずここまでで、次回までにテキストボックスを計15個(3列×5行)
がならんだHTMLを用意しておいてくださいね。
コードを入力したら売上科目を表示するもっともシンプルな方法が次回のテーマ
です。