たまにはcssを... 完成版 https://codepen.io/mitsuru-hashimoto/pen/eYYaJKZテキトーにspanタグを用意します wai spanにcssをあてます 疑似要素 (Pseudo-elements) を用意します span自体のpositionをrelativeに、 疑似要素(beforeのこと)のpositionをabsol…

こういう差があるんだ。。。 constructorの引数でpublicとかprivateの修飾詞つけると、 わざわざ別に変数宣言しなくてもいいんだ へぇ // これだとこれだとtitleがないよと怒られる // class Category { // constructor(title: string) {} // getInfo(): voi…

以下に移転しました exhikkii.com

TypeScriptいろいろできるなー Type Guards たとえばstring型の数字か,numberの数字を引数に取る想定した場合とかに有効かな const argNumberOrString = (value: string | number): void => { value.toString() // ここはセーフ value.toFixed() // ここでva…

へぇと思ったので紹介 Interscetion Types 両方引き継ぐことができる でorができるんだから、&も当然っちゃ当然か interface IHoge { hoge(): void } interface IFuga { fuga(): void } // Intersection Types type IHogeFuga = IHoge & IFuga let hogefuga:…

整理整理 Interface 継承 interface IFather { fatherName: string // おとんの名前をstring型 } interface IMother { motherName: string // おかんの名前をstring型 } // IFatherとIMotherを継承するIChildrenを定義 interface IChildren extends IFather,…

ブログ移転しました exhikkii.com

exhikkii.com へ移行

最近の気づきをメモがわりに。vue(正確にはNuxt.js) + TypeScriptのプロジェクトでvue-i18nを導入して国際化対応しました。vue-i18nのセットアップは公式をご参照ください。 https://kazupon.github.io/vue-i18n/ 内容は実際とは違いますが、 やろうとしたこ…

久しぶりにAWSの勉強をしたのでレビュー&メモEC2で環境を構築してCD(continuous delivery)を構築してデプロイする流れをハンズオン形式で学ぶ内容です 8章から構成されていて、各章のテーマは以下のような感じです第1章 クラウドとはなんぞやというところか…

先日、DNSでめっちゃ頭悩まされたので復習とメモがてら DNS(Domain Name System)DNSサーバは下記の2種類から構成される ネームサーバー(DNSコンテンツサーバー or 権威DNSサーバー とも呼ばれる) -> ドメインとIPアドレスを結びつける フルリゾルバ(DNSキャ…

タイトルまんま 以下はhttp://localhost:3333?hoge=testにアクセスするとするstart/routes.js Route.get('/', ({ request }) => { console.log('query parameter', request.input('hoge’) }); コンソールを確認する クエリがしっかり取れてる

AdonisJSの紹介 adonisjs.comMVCに則ったJavaScriptのフレームワークですPHPのフレームワークの1つLaravelにめっちゃそっくりですこちらを紹介する目的:JavaScripter人口増えたらいいな PHPerがNode.jsに入る時にexpressだと取っつきにくいと思うんです 自分…

一番に参照すべきなのはやはり公式ドキュメントだなと思いましたJavaScriptではべき乗は従来はMath.powを使います // 2の10乗 Math.pow(2,10) // 1024 es2016から下記のように書けます // 2の10乗 2 ** 10 // 1024 JavaScriptのべき乗演算子に関して調べいた…

なつかしい ああ、こんな書き方やったな 基礎的な内容で復習にはちょうどよかった 不満をあげるとすれば、サンプルアプリのデザインがとてもダサい あとActive Storageなんて機能ができてたんやね いい機能なだけにしっかり解説して欲しかったな ターゲット…

とても良い本だ テスト駆動開発を使って、 手を動かしながら学べる点がとてもよい 具体的な使い道も紹介しているので、学んだ文法の使い道もイメージしやすい 思い返せば、 2016年末にwebエンジニアになりたいなって思って、 プログラミングスクールなDIVE I…

以下に移転しました exhikkii.com

デザインわからん 私はデザインが苦手で、 テーマカラーとか色の組み合わせなんていい感じにできた試しがありませんそんな時はVuetifyのTheme generatorvuetifyjs.comテーマカラーを実際のコンポーネントに当てはめて確認しながら決められます 色を決定した…

以下へ移転しました exhikkii.com

名著 特に響いた1節をネタバレにならない程度にいくつか紹介します第4章 「テストによってプログラムが正しくないことは証明できるが、プログラムが正しいことは証明できないのである。」 ポパーだね すごくしっくりきた第5章 Object Orientedとはソフトウェ…

JSのtips JavaScriptでcreateElementしてそれをレンダリングすることって結構あると思います １つのDOMを追加するならともかく、複数のDOMをそれぞれ追加するのは、 毎回DOMツリーにアクセスすることになったり、 DOMの位置計算など起こるので、 パフォーマ…

今回は生のJavaScriptのtipsを タイトルの通り、appendChildについてデモをjsfiddleで作成しておきましたjsfiddle.net パッと見、 コードを見ると両方のdivタグにparaが表示されそうじゃないですか？結果はでも通りで 2つ目のdivタグ内にしか表示されていな…

自費☆参加 独立してお給料高くなるのは、 そのうちの幾らかは自己投資に回すためだと思っている背景として、 今参画しているプロジェクトで GAE、cloud function、pub/subなどを使う必要が出てきた けどGCP全く知らん せっかくやししっかり勉強しよう！ って…

GCPと仲良くなりたい ※あらかじめgcpのプロジェクトを作成しておいてください 適当にLaravelのプロジェクトを作成します php artisan serve で http://127.0.0.1:8000 にアクセスし、動作確認GAEへのデプロイはapp.yamlで設定します runtime: php // 言語はp…

JavaScriptで時間とか日付と言えばmoment.jsが有名だと思いますMoment.js | Home 個人的にはdate-fnsを推してますdate-fns.orgdate-fnsがmoment.jsに優っている理由はいくつかありますが、 サイズがmomentより小さいという点だけでもかなりの魅力ではないで…

下記の記事でfor...ofについて言及されてましたmedium.freecodecamp.org mozillaを見てみるとfor...ofとfor...inの違いについて言及していますね developer.mozilla.orgJSって思わぬ落とし穴とか、クセがあるから、気をつけないと セミコロンに関してはうー…

面白いけど、どれもどこかで聞いたことあるような話ばっかだった それでも書かれていることはどれも「せやな」って頷けるものばっかり 特に、12章の「プログラマ 対 雇用主」は耳が痛いよ〜 やることやってるからって遅刻ぐらい許して〜スマートに書きたいし…

めっちゃ緊張した プログラミングスクールDIVE INTO CODEさんで、同校の生徒さんにしてきたよdiveintocode.jp 資料 https://docs.google.com/presentation/d/1QP83QDXGOPZVjpNhINrgRxX-bB1KoHn2m6VMNSRonxg/edit?usp=sharing Github https://github.com/Mits…

Nuxt.jsの基本機能ちょっと紹介します vue-cliがあればすぐにプロジェクト作成できます vue init nuxt-community/starter-template nuxt-study cd nuxt-study yarn yarn devlocalhost:3000でつながります まず、プロジェクトルートにpagesディレクトリがあり…

vuefireの使い方を簡単なcrud構築することで紹介します 今回は新規登録 vuefireはVue.jsでfirebaseをいい感じに使えるプラグインですね では早速。。 今回はデザインがん無視します(Vuetifyいいよ〜) プロジェクト作成 vue init webpack vuefire-tutorial cd…