Web Developer's Struggle Memories

日々の業務から思ったこと、学んだことを書き連ねていきます。

プログラミング

input 要素で日本語入力が完了したのか submit のエンターなのかを判定する

軽くググるとすでに数多くの記事が書かれており、たくさんの先人の方々が苦しんだことが分かりますが、古かったり超厳密に実装しようとして少々複雑度が増しているものだったりしますので、完璧ではないですが妥協できるくらいのレベルでの実装で良い、とい…

useState を使った input で初期値をセットしたりバリデーションチェックする方法

とある案件で Next.js を用いて web アプリケーションを開発しているのですが、その中で styled-components というライブラリを利用してコンポーネントを作成しています。 まぁコード見たら物凄い基本的なことですが、備忘録として書き残しておきます。 とり…

Object Oriented Conference でスポンサーセッションとして40分登壇してきた話

ロゴ画像 https://ooc.dev より 2020/2/16 に Object Oriented Conference なる、近年日本で行われた オブジェクト指向 に関する最大(ではないか?)のイベントに登壇してきたのでその時の事をお話します。控えめに言ってめちゃくちゃ勉強になり、刺激だら…

Array.prototype.map 内で非同期関数を走らせて、配列の要素ごとに処理する +α

ちょっと Promise や async/await に躓いたのでメモとして書き残しておく。 間違った処理 当初は以下のような処理を書いていた。ある配列の全要素に対し一つ一つ処理を実行し、その結果に対して判定処理をしたかった。 let arr = [] const timeout = (ms) =>…

t_wada 氏にペアプログラミングについてご講演頂いた際の個人的メモ

今や @t_wada(和田卓人) 氏については私が説明しなくとも、皆さんご存知のことかと思います。そう、このライオンスタンドの人です(違わないけど違いますw ,、,,,、,,, _,,;' '" '' ;;,, (rヽ,;''""''゛゛;,ノr) ,; i ___ 、___iヽ゛;, テスト書いてないと…

Riot Router の v5 について

以下 Riot.js を riot と呼ぶ @riotjs/route を route と呼ぶ ことにします. route が気付いたら v5 になってた …え, v5 …だと…!? とりあえず驚きました. 本体である riot のメジャーバージョンがまだ v4 であること, route の方が本体よりも後に v4 版がリ…

アルゴリズム問題「パスワードジェネレータ」を作れ

ルール 8文字固定 半角英字(大文字, 小文字を1文字ずつ), 半角数字, 記号を必ずすべて含む ※重複文字が含まれるのは許容する プログラム const STRINGS = 'abcdefghijklmnopqrstuvwxyz' const NUMBERS = '0123456789' const SYMBOLS = '!"#$%&-^¥@;:/<>+*{…

Ionicにおけるテストについて

Ionic Advent Calendar 2017 の17日目の記事になります。 以前こちらの勉強会にて、Ionicにおけるテストについて喋りました。スライドはこちら↓↓↓ speakerdeck.com この資料をダイジェストに書いたものになります(どっかでやりたいと思いながら今日に至る……

Diary 2018-08-17 (tardiness) nodejs day

Today's workings HTTP2 の勉強 swagger-node と格闘 Details 1. HTTP2 の勉強 speakerdeck.com @ariaki4dev さんのスライドはいつも本当に勉強になるなぁ。 TLS1.3 は最近リリースされたんだったな。そして、 IPv6 どうなったの? 2. swagger-node と格闘 …

Diary 2018-08-16 Let's change!!

Today's workings VTRyo さんのお手伝い エイチワークス さんと skype 面談 Nuxt, Webpackと格闘 Details 1. VTRyoさんのお手伝い アンケートに回答。事の発端のツイートはこちら。 #技術書典 執筆のために、ちょっとした取材をお願いしたいのだけど、ご協力…

Diary 2018-07-18 Action Action Action

Today's workings jwtを調べる Nuxt.jsを試す Udemyのriot.jsのコースを聞く Details 1. jwtを調べる ことの発端はteratailにて以下のような質問を見つけたので、勉強がてら調べつつ回答した。 teratail.com なんだかんだ一番まとまっている公式リポジトリの…

Presentation about PWA at study group

はじめに A new way to deliver amazing user experiences on the web. とGoogleが提唱しているように、PWA とは、 より素晴らしいUX(ユーザ体験)を実現する新しい手法です。 主な特徴は次の3つ「Reliable(信頼性)」「Fast(高速)」「Engaging(エンゲ…

日記:2018-06-13 inputとthinkingとtranslate

今日やったこと PWAの勉強会用資料の作成 MDNの翻訳 詳細 1. PWAの勉強会用資料の作成 supporterzcolab.com まだ10%くらいなので、しっかり 6/28に間に合わせる。今回は20人越えそうな勢いなので、いつも以上にしっかりと準備していきたい。(いや、毎回やれ…

日記:2018-06-11 アルゴリズム問題にチャレンジ

今日やったこと 「【CTO meetup】UI/UXデザイン×フロントエンド開発」に参加 Hacker Rankの問題を解いた 詳細 1. 「CTO meetup】UI/UXデザイン×フロントエンド開発」に参加 flexy.connpass.com 懐かしい顔も何人かいたが、今日は全く知らない人3, 4人と話し…

日記:2018-05-28 小さくても1歩

今日やったこと riotjsの公式サイトの日本語ページのリリースノートを更新 詳細 リリースノート · Riot.js 所感 twitterでもつぶやいたが、久しぶりに「スキル不足」「技術力が足らない」「教えるリソースがない」とか言われた(3つ目からなんの話かは察し…

日記:2018-05-19

昨日(5/18)の日記は、仕事以外はホンマに書くことがなかった。強いて言うなら、移動とYYPHPの懇親会に参加したくらい。 なので書かなかった。 今日やったこと 5/20のIonic Meetupのスライド見直し rxjsの勉強 詳細 1. 5/20のIonic Meetupのスライド見直し …

日記:2018-05-17

昨日の日記のリンクを「所感」の終わりに移動してみた。そして、今夜のGoogleの勉強会だが、案件リリースのため泣く泣くキャンセルした。。行きたかった。 今日やったこと Flux, Reduxのお勉強 RiotControl の routing_demo を riotjs v3 で動作させた 5/22 …

日記:2018-05-16

←昨日の日記 今日やったこと node-sassでちょっとハマった nodejs の readline について勉強 riotx 詳細 1. node-sassでちょっとハマった github.com これ。macで docker 使って開発環境を建ててたんだが、node-sass のバインディングがおかしくてコケてた。…

日記:2018-05-14(遅刻)

←昨日の日記 遅刻ではない。大遅刻だ。 次の日の15時を超えとる。 まだ習慣になっていないということだな。 今日やったこと riotxの勉強 詳細 Riotx 紹介 · Riotx ひたすら↑見つつ、plunker で手を動かしていた。 所感 今日はちょっとぼやっとしすぎた。本読…

日記:2018-05-09

←昨日の日記 今日やったこと cmd-ranking バグ修正 v0.2.5 リリース riot-ecosystem の続き 詳細 1. cmd-ranking 昨日の日記でも記載した以下のパッケージ www.npmjs.com の「1つのコマンドにセミコロンが2つ存在すると、そのコマンドが取得できない」という…

日記:2018-05-08

今日からエンジニア 日記なるものを書いていこうと思う。 「ブログ」という枠で書こうとするから、続かなかったりハードルが高く感じるので、「日記」くらいに思えば続くのではないか。その日この人が何をしたのかもよく分かるし、後から振り返りやすい。マ…

SwiftでDB触るならRealmが無難そうかも

今まで一応本でも写経しながら手は動かしてきたが、とりあえず一つアプリを作ってみようと思い、 2018年になってやっと本格的にSwiftを触り始めた。 で、iOSアプリを作るのだが、「データの永続化」をするにはどうするか軽く調べたところ、 それ用のDBライブ…

Practices of directory composition using expressjs

せっかく仕事でNode.js(というかExpress)使ってるので、そこで実現場での使い方の例を参考にメモする。(そのまんまだとあれなので、加工済み) あと英語の勉強のため、何気にタイトルやらヘッダやらを英語にしています。 Anyway, directory structure ./ …

PHPでSimpleXMLElementをセッションでは保持できない

こんなXMLを受け取ってパースし、$_SESSIONで保持するとしよう。(分かりやすさのためインデントあり) <ROOT> <CUST>000123456</CUST> <BAITAI>hoge</BAITAI> <SHOHIN_MST> <SHOHIN> <NAME>ほげ</NAME> <CODE>55555</CODE> <PRICE>2500</PRICE> </SHOHIN> </SHOHIN_MST> <TAX_RATE>8</TAX_RATE> </ROOT> 1. simplexml_load_stri…

DIST.15 「アニメーションで差を付ける演出とデザイン」に参加してきたメモ

本日のお題 メインセッション マルチデバイス時代を生き残る演出術 インターフェイスとアニメーション 文字とアニメーションの幸せな関係 LT 実例で学ぶSSアニメーション 細かすぎて気づかないアニメーションクイズ大会 アセットのローディング、どうしてま…

「What the flux?」の翻訳

本投稿は以下の記事を日本語に翻訳したものになります。 (筆者の@jcreamer898氏に許可は頂いてます) jonathancreamer.com この記事は、Fluxについて物凄く分かりやすく書かれているので、「Flux難しい!」って言う方の助けになれば幸いです(*^^)v 以下、本…

東京Node学園祭2016のメモ

例によって例のごとく、今更投稿する。しかもほぼ編集なしのメモ。 今回(は?も?)海外の方が多数来られていて、物凄く刺激のある1日だったし、Node.jsって楽しい!と再確認できた勉強会だった。 Famicom programming with JavaScript 当時のスペックではf…

Riot.js(v3)のeachメソッドによるループ速度を計測してみた

はじめに Riot.js(以下riot)は非常にシンプルかつ軽量で敷居も低く、とても書きやすいコンポーネント指向のUIライブラリです。(ここまでテンプレート) v3がリリースされ、速度も改善されたとのことでしたので、検証してみました。 計測方法は、各ループ…

今年1年真剣にRiot.jsと付き合ってきたので振り返ってみた

Riot.js Advent Calendar 2016の1日目です!(初トップバッター!) 今回はあまりテクニカルなプログラミングの話はせず、基本ばかりなので、その点ご了承ください(笑) qiita.com はじめに Riot.js(以下riot)は非常にシンプルかつ軽量で敷居も低く、とて…

Riot.jsでデータバインディングっぽい実装方法

はじめに Riot.js(以下riot)は非常にシンプルかつ軽量で敷居も低く、とても書きやすいコンポーネント指向のUIライブラリです。(ここまでテンプレートにしたい) 今年の夏にv3.0.0が出てきたことで、さらに熱いので皆さん是非触ってみてください! ここか…