OutSystemsエンジニアの猛勉強ブログ

初心者OutSystemsエンジニアのブログです(ぺこり)。

注文伝票アプリ一覧画面の設計(基礎コース1.2)中編

(前回までのあらすじ)

働きたくない。働きたくないのに、指が勝手に動く。
朝からアプリ開発してWordで下書き29枚。4,147文字。もう、嫌や。
休ませろー!肉食わせろー!と言いつつ働き続ける小林の後ろ姿がそこにはあったのであった。

 

前回までずっとデータベースを設計してた。
で、あらかた終わったので、次は注文一覧画面の作成(なんか結構難しい)
をやっていくことになる。

 

ということで、HTMLページを生成する。

f:id:neomatsudaira:20160204184334p:plain

はい。生成したよ。

OutSystemsだと2秒で作れます。名前変えただけですしね。

 

それからOrderのページ内部を設計していく。

f:id:neomatsudaira:20160204184603p:plain

(私の開発画面です)

それにしても、記録残しながらアプリ開発するのって難しい。

 

お次は内部アルゴリズムのPreparationの設計。
Preparationとは、その当該ページにおける動く部分の設計のことです。
要するに、動かないコードがHTMLなら、動くコードはPHPやJavascriptです。よって、OutSystemsにおけるPHPやJavascriptの部分がPreparationと呼ばれる部分です。
まず、Preparationのアルゴリズム内にデータベースを埋め込んでいく

f:id:neomatsudaira:20160204185238p:plain

(私の開発画面です)

はい。ドラッグアンドドロップでデータベースの構築が完了しました。
だけど、なぜか、トレーニング画面と同じようにならない。

 

・トレーニング画面

f:id:neomatsudaira:20160204185426p:plain

鬼のような難しさです。

トレーニング画面では一度のドロップでリレーショナル(連結)されているのに、自分の開発画面では2つのデータベースが表示されなかったため、両方のデータベースをドロップさせてトレーニング画面と同じになるよう何度もやり直した。

 

ここら辺は 不安だったものの、別にキレもせず、何度も何度もやり直した。

f:id:neomatsudaira:20160204190206p:plain

で、同じになるようやり直した結果出来上がったのが上の画面です。左上の赤い枠の部分にOrderとClientという2つのデータベースが並んでいるのが分かると思います。

そして、その下にはOrderデータベースのSubmitDate列とClientデータベースのName、Address、Email、PhoneNumber列が続きます。

基本的に画面の説明が一切ないですし、同じ処理を行ったのに同じ画面にならないため、英語の開発画面上で試行錯誤しました。 

これ、日本語化されたら爆発的に普及するだろうけど、画面上のすべてが英語のため、今はそんなに普及しないのではないかと思います。

f:id:neomatsudaira:20160204190849p:plain

トレーニング動画が基本的に何しゃべっているのかが分からなくなってきている。

これで基礎講座とか言っている訳で、ここまで付いて来られる初心者エンジニアがどれくらいいるのだろうか?ということを、小林は開発しながら考えたのであった。

 

基本的に日本人に対してのUX(ユーザーエクスペリエンス、使用体験)が皆無のため、使い始めた初心者エンジニアは相当苦しむと思われる。

 

同じことしているのに、トレーニング画面と全然違くなってしまったため、独学であれこれ触りまくる。それでもあまり不快感なくぶっ続けてコードを書いているのが不思議な感覚である。小林はもっと上手くなりたいのだろうか?

 

で、同じになった

f:id:neomatsudaira:20160204191413p:plain

一番左のId列は主キーで注文番号なんだと思う。

主キーだから重複は許されない。注文番号で重複はトラブルの原因になるから(重複したら片方の顧客にしか配達されないから)許されないのである。

 

お次は一覧画面の設計

f:id:neomatsudaira:20160204194351p:plain

TableRecordsをドラッグアンドドロップするだけで注文一覧画面が作れる。

 

トレーニング動画では、

f:id:neomatsudaira:20160204194511p:plain

どんどん日本語が難解になっていく。

でも、これ入門編で同じことやっているから、説明は難しいけど、 なんとなくわかる。というかもう分かれや!!
ってノリですらある。

 

もうここら辺は体で覚え込んでいるため、指が勝手に動いてくれる(泣)

f:id:neomatsudaira:20160204194829p:plain

一覧画面が一瞬で構築完了した。

すさまじい開発スピードである。左列が注文データベース、右列がClientって書かれていることから分かる通り顧客データベースである。

つまり、この表は最初っからリレーショナルデータベースになっているということを表している。前回のトレーニングで、データベースを連結させたからである。

次にOrderId(注文番号)列の設計

f:id:neomatsudaira:20160204195143p:plain

ああああああああああああああああ!!!!
難しい。難しいのに指がもう勝手に動いちゃうんだよカズイー。
ブログでアプリ開発の記録を残しながら視力0.08の視覚障害者が(ワロスwwwwwww)業務アプリケーション作るとかガチで難しいよ。
頭おかしくなりそう。

 

今Wordで下書き14ページ目。1,742文字目。
もう朝から俺はなにをやっているんだと。
ていうかOutSystems Platformやりすぎて指が勝手に動くようになってしまった。
山のようにブログが積み上がっていく。
そんな日常です。

次は注文伝票の詳細画面を作るよ。


(次のトレーニングに続く)