Web竜の巣

知ってることを、知ってるだけ。

Vue.js講義記録1

唐突ではあるが、ポートフォリオが作りたい。

やはり、何かしら見せられるものがあると無いでは雲泥の差があるだろう。

 

ということで、twitterでふと相談してみたところ、

「SPAか何か作って見せてくれればいいよ」と言われたのがきっかけ。

 

で、SPAを作る、となるとjavascriptフレームワークを学ぶ必要があるよな、

ということでudemyの講義を一つ買った。ちょうどセールだったしね。

 

https://www.udemy.com/vuejs-from-beginner-to-professional/

 

と、いうことでこの講義記録を簡単にまとめようと思う。骨子だけ。

本格的には講義を買ってみてほしい。 その方が作者の人にもいいだろうと思う。

 

基本の書き方

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
<div id="app">{{ text }}</div>
<script>
new Vue({
el:'#app',
data:{
text:'Hello world'
}
})
</script>

大雑把な表記は許してほしい。

 基本はnew Vueのパラメータ、elの中でセレクタを使ってidを指定し、

dataの中でパラメータ名と与えるパラメータを指定する。

 

scriptタグ内でライブラリの使用を宣言してさえいれば、

data内の記述や条件式を {{ }} 内で書いてネイティブに呼び出すことができる。

単一ファイル内に書かずとも、書くファイルを別に分けることができるため、

よりシンプルに切り分けることもできるようだ。

 

 リンクの張り方

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
<div id="app">
<a v-vind:hlef="url">ブログ</a>
</div>
<script>
new Vue({
el:'#app',
data:{
url:'https://dragonsnest.hatenablog.jp/'
}
})
</script>

基本的には、スクリプトの中身の特殊文字エンコードされて表示されてしまう。

そのため、テキストを呼び出す感覚でURLを呼び出すとリンクが張れない。

その代わり、v-bind:hlefという属性を使うとリンクが張れるようだ。

 

 Functionの呼び方

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
<div id="app">
<p>{{ onwork() }}</p>
</div>
<script>
new Vue({
el:'#app',
data:{
count:100
},
methods:{
onwork: function(){
this.count > 99 ? 'work' : 'not work';
}
}
})
</script>

 methodsフォルダ内ではfunctionを呼ぶことができる。

その際のパラメータは呼ぶ際はthis.(パラメータ)で呼び出す。

 

会社を辞めることになりまして。

まぁ、いろいろあったのですが。

お久しぶりです。 こういう時だけ更新するブログをコツコツと書いています。

 

3ヵ月という短い期間となりましたが、本日で会社を辞めることとなりました。

まぁ、自分のスキル不足というかキャパシティ不足は否定できない事実でしょう。

しかし、それでもやれるだけのことはやってきた。 そのつもりです。

 

振り返りと反省

今回の会社ではNode.js、サーバーサイドjavascriptでしたが、

相性が悪かったのは否定できません。

自分の勉強不足と言えばそれまでなのかもしれませんが。

個人的見解ですが、型がない言語でサーバーサイドをやるのは絶対に無理です。

会社にはコードレビュワーの人がいましたが、負荷が集中していたように思います。

どこかでTypescriptを入れるなどしないと、逆に複雑さに対処できなくなる。

 

Lintツールや予測入力が効かない世界でコードを書き続けるのは、

高度なプログラマとしてのリテラシーを求められるとともに、

プログラマにとっては同時にある意味において不自由であることを意味するのです。

型破りと型知らずは全くの別世界です。これに尽きると思います。

 

対人スキルの面においては、自分のスキル不足もあったのだろうなと。

いろいろ、思う点を否定しませんでした。

人に伝える、不快な思いをさせないという点において、自分は上手くなかった。

今後も、課題になる点だと常思います。

 

しかし、会社への思いは悪くありません。

きちんと折り目を正して、きちんとやってくれた。

それだけでも、自分からすれば感謝です。

 

 今後

いずれにせよ次を探さねばなりません。

作りたいものや、やりたいことも少しづつ出てきたように思います。

やれるだけのことを、やれるだけ。 知識の棚卸もまたしつつ。

コツコツとやっていきたいと思います。

WITH句を使って、SQL再入門

SQL is Hard...

SQL。ふわっふわの言語であり、シンプルでありながら難しい言語。

 

自分もそうだったが、SQL嫌いな人はサブクエリの存在が一番の敵だと思う。

なので、サブクエリの存在を忘れてSQLについて一回再入門する記事を書こうと思う。

 

キーワードは「WITH」。

 

まず、サブクエリを捨てる

サブクエリが混ざるとSQLは途端にアレルゲンになる。

なぜかといえば、定義してる途中で定義が混ざってくるのが何よりよくない。

思考が上から下に流れていく途中で横に流れて戻ってきて……。

といった感じになってしまう。これが良くない。

 

そこで、まずサブクエリを忘れて、WITH句を使ってSQLを組もう。

裏を返せば、これがわかればサブクエリは簡単になる。

 

WITH sample_name AS (
SELECT
FROM
WHERE
)

SELECT

FROM

XXX JOIN
ON

WHERE

ORDER BY

 

これだけ。中身も書かないくらい簡単だが、こんな感じで書いてしまえばいいのだ。

サブクエリが上に来る、それだけのことともいえるが、これでいい。

「上で定義されたものを下で使う」というほとんどの言語で使われている構造に、

SQLの側を当てはめて書いてしまえばいいのだ。

FROM句の中でさらにサブクエリを書くことがなくなるだけで、

ぐっとSQLは読みやすく、簡単になる。

 

WITH句を使えば、入れ子SQLなんて醜い物はもう見る必要がない。

自分も読む気がないし、読まされるのも苦痛だ。

できる限り読みやすく、平易に書いていこう。高速化の心配は後でもできる。

 

また、読みやすいSQLは高速化も容易だし、

使わないでサブクエリにするのは後からでもできる。

読みにくいSQLはまず手を入れること自体が難しい。それを思えば万倍マシだ。

 

あとは、これをひな型に現場に応じて手を加えればいいと思う。

難しいことを一切投げ捨てて、そこからゆっくりと、小さく進めればいい。

 

小さく作って大きく膨らませていこう。

 

高稼働を支えた技術

要諦:デスマーチ振り返り記事

 

辞める前、プロジェクトは燃えていた。

いや、いろいろな要因が重なって、不幸にも。なのだけれど。

残業は月35時間前後、抜ける直前は60時間を数えている。

 

今、現場を離れて長い睡眠と、食事の面で満たされたからこそ振り返るべきかな、と。

何度となく見返した先人たちの記事を抑えつつ。

 

Inspire the Next.

blog.satotaichi.info

 

qiita.com

 

水を常にとることを高負荷下では強くお勧めする。

コーヒー、紅茶、緑茶等よりもまずは水である。

トイレ休憩という形で適切なインターバルの休憩を体に与えることができ、

思考を整理するという、その点においても利点が大きい。

 

ビルの水はカルキが強く不味いと感じるのならば、

ブリタの浄水水筒を使う手もある。ミネラルウォーターを買うよりも格安だ。 

自分はこれの前のモデルを使っていた。

 

三食きちんと食べるということ

忙しくても、常に食事はきちんととるべきだ。

医食同源ではないけれど、人間の体は食事でできている。

 

基本的に何を食べてもいいとは思う。

しかし、和食ならごはん、みそ汁、おかず。一汁一菜はまず最低限のラインとしたい。

 

サプリメントのすすめ

マルチビタミンミネラルのサプリメントはよく出ているものだ。

これを自分は食事と一緒にお勧めしたい。

 

人間の食事で完全な栄養を取れることなんて極めてまれだ。

ましてや、それを満たすには苛烈な稼働の中では時間が足りない。

食べられる時に食べ、休めるときに休む。

兵士の基本ではないが、そうでなくてはとてもではないが戦い続けるのは不可能だ。

だから、足りない分をきちんと補う意味において、サプリメントに金をかけよう。

稼働の忙しさに比例して、

マルチビタミンミネラルのグレードは上がってしかるべきと思う。

 

エナジードリンク

あまりお勧めしかねる、というのが正直な感想だ。

カフェインに弱い自分の体質もあるが、

糖分と栄養、カフェインの合わせ技を「同時に」取るのは危険を感じる。

一つのエナジードリンクと同じ成分を取るなら、

サプリメントでバラでとる方が、調整も効く分マシであろう、というところだ。

 

栄養ドリンク

取りすぎはNGだが、疲労を取るには不可欠なものだ。

この場合、自分は粉末錠剤タイプの物を強くお勧めする。

コストパフォーマンスに優れ、無水カフェインを含まないものは扱いやすい。

体への負担も軽く、疲労のみを取るにちょうどいい。

 

 

【第2類医薬品】ユンケル黄帝顆粒DCF 16包

【第2類医薬品】ユンケル黄帝顆粒DCF 16包

 

 

自分はこれをよく使っている。ドリンク剤よりも安く、1回140円くらいである。

使っても週に2回程度だが、それでもよく効いてくれた。

 

枕を使った昼寝のすすめ

昼寝は本当に重要だ。午前中の疲れを落とし、

脳の疲労を取り、血圧を下げ、体の負担を軽くしてくれる。

その効率を最大化したいなら、昼寝用の枕を用意しよう。

人間で最も重い臓器といわれる、頭部の重量を机に預けられるのは、

休息の効率をさらにぐっと上げてくれる。

末梢の血管がフワッ、と開く感覚を味わえるだろう。これが重要だ。

10分の昼寝で今後6時間の効率を買うのだ。格安の投資といえるだろう。

 

今後も、この知識が役立たないことを願いつつ。知見を残しておく。

ただ、どうあがいても付きまとうの、だろうなぁ・・・。

SESの会社を退職しました

要約:退職エントリー

 

思えば長かった。本当に。

お久しぶりです。本日付で、SESの会社を退職しました。
思えば2年くらいは居たのでしょうか。 なんだかんだで。

 

ブログの方もまぁ三日坊主、ないしあまり更新する人間でもありませんが、
この会社に勤めていたことがブログを始めたきっかけであり、

自分の将来を少しでもいいものにしたいと始めたものでもありましたので、
状況的にも環境のほうが好転するきっかけにもなったのかな、と思います。

 

やめたきっかけ

様々な要因が重なったのがきっかけです。

一つは、精神的な過負荷やそれに伴って体調が怪しくなってきたこと。

もう一つはまぁ、音楽性の違いというのも大きなきっかけです。

色々書くには闇が深すぎる。

羅生門のフレーズではないけれど、黒洞々たる闇がただ広がるばかりだった。

 

「自分の人生を思えば、もうこれ以上続けるのは限界であろう」という判断、

割り切りもありました。それだけのことでもあります。

 

そして、『次の転職先が決まった』。 それが一つの契機でもありました。

もう、疲れたんだ。この生活に。

今後

今後は1か月の静養を経て、次の会社で働くこととなります。

次の転職先はWeb系の会社です。

SESに別れを告げて、いよいよ、念願の額面で20万を超える会社で。

 

やれるだけのことを、やれるだけ。知っていることを知っているだけ。

自分はそうやって生きてきたし、これからもそうしていくことになるかと思います。

今はただ、ちゃんと寝て、栄養のある肉を食べて体を休めたい。

そのくらいには疲れ切ってしまったのを感じています。

 

また、ぽつぽつと自分の知識の棚卸をかけたいのもあります。

ちまちまとブログの更新を再開したいところです。

 

次の会社の皆様、よろしくお願いいたします。

cyber_rebeat2018 CTFに参加しました!

簡単なのしか解いてなかったけどな!

 

お久しぶりです。

いい機会だからブログを簡単に書こうかと。

 

ちょっとしたきっかけがあって、CTFのチームに参加したのがきっかけです。

Camonoha0で参加してました。

最終順位はどれくらいか見られていないのでまだわかりません。

6位くらいじゃないかな。最後に見た時は。

 

途中からesetにサイトが弾かれる問題に直面していて、

未だに解決できていないためしんどいです。

しかし、滑り出しとしてはかなりいいものと思いましたので、

今後もコツコツと続けていきたい次第。

Springboot2.0 とSpringSecurity2備忘録

やらんとしていることはシンプルだがかなり詰まる要素であるので、

備忘録としてこれを書く。

 

メモランダムなので書評等でもない。

いわゆる書き散らし文。断片的な情報の集積所。

 

Springboot2.0でのSpringSecurity設定。

www.baeldung.com

 

 これをやらないとアプリが動かない。

 

exclude = { SecurityAutoConfiguration.class }

 

が肝。

 

Spring Security with Spring Boot 2.0で簡単なRest APIを実装する

 

大方の実装法が乗っている。

これに従って実装すればほぼほぼ行けそうである。