2019/10/23
お久しぶりです。vorotamorozです。
最近、いつも良くしてくれる方がReactNativeを始めたので、好き嫌いせず僕もやってみっか、みたいなノリでReactまた始めました。最初はflutter触るつもりだったんですが。
そこで、create-react-appを叩いてびっくり。
なんということでしょう。
Functional Component(以後FC)でAppが作られたじゃありませんか。
最初は、ははぁ、もうstate使わせたくないんだな？いきなりReduxとか言うのか？あ？みたいな気分で半信半疑で少し調べると、驚愕の事実が。
FCに状態が持てる？
なんと、hooksというAPIによって、FCで状態が持てるようになっていました。
具体的にはuseState。こいつでステートが持てる。
さらにさらに。メモ化するAPIもあり、そいつは、依存するオブジェクトを伴って、内容が変われば勝手に更新してくれる。useMemoと言うAPIです。
これは、Vueでいうcomputedに近づいたといって差し支えないでしょう。
そして、副作用をハンドリングするuseEffect。第二引数が変わったときに発火されるので、とてつもなく便利。しかも、捨てられるときの関数まで渡せる。
これはヤバいです。革命でしょう。
どうして僕はキャッチアップをしていなかったんでしょうか。
FCを使うと、圧倒的にコードが短くなり、JS部分が本当に少しになります。
結果、ノイズが減り、相当綺麗なコードになります。
また、React.memoを使うと、recomposeのpureも不要でしょう。
HoCを作る事も減りそうです。
なぜならhooksAPIは自作可能なのです。
HoC作るぐらいならhooks書くみたいな空気になるんじゃないでしょうか。
また、こいつらはReactの本体に要るので、なんとなんと、ReactNativeでも使用可能です。
加えて、Reduxがやってた事の一部も、ContextとuseReducerで事足りたりします。
Reduxと同じく、非同期処理に非常に弱いので、僕は、State Management with React Hooks — No Redux or Context APIで紹介されていた、use-global-hookを少しだけ改造して使っています。これにもほとんど不満無いですね。
改造も、ほんとに些細な事なので、いずれ要らなくなるでしょう。
嫌いだと言っていたReactですが、どうやら好きになりそうです。
というか、嫌いだったのはクラス構文だったんだろうか。。
サンプル作ったら、またページ作ります。
Reactってカテゴリ作っても良いかも。
2019/09/28
書きました、Xamarinでガワネイティブアプリを作る方法。
結構これ、ニーズある気がします。
というのも、今日日の端末ってガワネイティブというかWebViewでも相当パフォーマンス良いんですよね。
CSSのbackdrop-filterがやっときたでも書きましたが、リッチなエフェクトも使えるようになりましたし。
ちょっとしたアプリなら、WebViewで充分だったりします。
QuickLogBookなんかも、同じように作られていて、LiteDB+位置情報と逆ジオコーディングを使ってます。
XamarinでのWebViewアプリは、ロジック部分をC#で書くことができるのでクロスが楽です。
僕はmacを持っていないので作れませんが、お持ちの方は.NET Standardでメインロジックを書いていればすぐmac版が作れると思います。
公開はしていませんが、QuickLogBookも、.NET Core版のコンソールアプリがあったりします。
しかし、Xamarin、もっと流行ってほしいですね。
と、いうことで記事はこちらです。
Xamarinで作るガワネイティブアプリ 〜スプラッシュスクリーンを添えて〜
なお、ソースはMITライセンスですので、是非、Forkしてご利用下さい。
2019/09/25
でました、.NET Core 3.0。
C#の初記事はXamarinではなく、.NET Coreの話題になってしまいました。
色々な機能が入りましたが、Publishにオプションがついたのが興味深い。
いろんなパターンでビルドしてみましたが、PublishTrimmedは結構インパクトありました。
ReadyToRunが微妙だったのは悲しい。
PublishSingleFileは暗澹たる状況なので、何とかなってほしいですね。
.NET Core 3.0が来た！ 〜singleバイナリやILlink、RoRなどpublishオプションの比較〜
2019/09/23
これが書きたいがためにサイトを立ち上げたようなものです！
ついに、stableになりました。backdrop-filterという、HTML界を揺るがすようなCSSのプロパティが。
これを実装するためには、ReactNativeでもネイティブなコンポーネントを導入したりしないといけなかったものが、WebViewを使うとたった1行(ベンダプリフィックス対応で2行)で実装できてしまうという禁断のプロパティ。
ずっと待ち望んでいましたが、ついにChromeの76で実装されました。
Chrome Platform Statusをウォッチし続けていて、やっと！ という感じですが。
個人的にはExperimental Web Platform Featuresをオンにしていましたが、stableになるとやっぱり感慨深いですね。
まだまだ謎の陰が出来たりと挙動不審な姿も見せてくれますが、それでもちゃんとぼかしエフェクトがかかっているのは嬉しい。
GoogleのChrome Platform Statusのコメントも、とても嬉しいもので、Betaの頃に紹介したかったです。
Ever since Webkit shipped a prefixed version of this feature in 2015, developers have been asking for Chromium to implement it. The main Chromium feature tracking bug has 574 stars as of June 12, 2019. A number of web design blogs highlight this "cool" feature, and bemoan the lack of Chromium support. It is clear from the comments on the bug, and in the general discussions around the web, that this feature is highly desired by designers. We should make it available to them.
訳すと気持ちがこもります。
プレフィックスつきのバージョンのこの機能を2015年にWebkitが出してから、開発者はChromiumに実装して欲しいと求めつづけてきました。2019年6月12日現在、主なChromiumの機能のTracking Bugには579starついています。たくさんのWebデザインのブログがこのかっこいい機能を強調していて、Chromiumがその実装を欠いていることを嘆いていました。バグへのコメントからも、一般的なウェブ上での議論からも、この機能がデザイナーの方々から強く望まれていることは明らかです。我々はこれを実現しなければなりません。
いやはやうれしいですね。
紹介記事とサンプルはこちらです。
ちなみに、バグトラッカーはこちらでした。無事Fixed(Closed)ですね。
2019/09/22
contentEditableを利用して、ブラウザで画像を張り付けるあれ、記事にしました。
やっとソースの元ネタも発見したので、そちらもリンク張ってます。
Webブラウザで、クリップボードから画像を拾ってトリミングする。
2019/09/21(3)
あまりにサーバ環境を放置しすぎてphpが5.6系という恐ろしい状態だったので、取り急ぎphp更新しました。
焦った。
2019/09/21(2)
トップページの内容を、コンテンツから適当に引っ張るように変更しました。
昔ながらの方法とは言え、全部手修正は大変なので。
既製のCMS使わないの？ というご意見あるかと思いますが、使わないです。
別にWebからコンテンツを変更できなくても良いですし、gitの歴になっているほうが便利なのです。
スマホから簡単に更新する術も発見した（≈gitクライアントとテキストエディタを見繕った）ので、気軽に更新も可能だったりします。
これからどれぐらいコンテンツを拡充できるかわかりませんが、今後ともよろしくお願いいたします。
直近で書いていきたいのは、
・backdrop-filterによるすりガラス効果（うちのヘッダーにも使ってますが）
・PWA的なものに関すること
・ServiceWorkerのパワー
・WebPushの送受信方法
↑これあんまり記事になってない気がします
・manifest.jsonのwebshare_targetを使った、データの受け取り
・C#/Xamarinで、超簡単にガワネイティブアプリを作る方法
↑テンプレートっぽいプロジェクトごと公開するつもりです
といったところですね。
あ、V@についても更新しました。もしよろしければ。
2019/09/21
最近WebのAPIはすごくて、ShapeDetectionAPIなんかではバーコードが読めたりする。
これ、もう少し進めると、いわゆる業務アプリはスマホのPWAで十分、みたいになりそうな気がしてて、ずっと目が離せない。
というのも、僕は昔はずっと電カル・オーダリング・介護会計の医療系システム屋だったからで、この辺、いつWeb化するかわからないと思ってた。
特にイントラで動く範囲ね。
現職は製造業の企業のグループ制作会社にいるんだけど、そこでは制作するとともに社内システムなんかも作ってる。
この社内システムでも、結構Webで何とかなるものが増えてきた。
既存のWebシステムはすごく評判が悪いけど、ザ・システム屋が作ったもの、だったので、そりゃ評判も悪いわ。と納得しちゃうものばっかり。
自分は制作であってシステム屋ではないと肝に銘じろと言われてるので、あくまで制作側からWebアプリを作ってるんだけど、やっぱりちゃんと作るとWebでも評判は割と良い。
社内システムにも、ユニバーサルデザインを取り入れたWebシステム、かつ、最近のAPIを使ったネイティブアプリと遜色のないアプリが作りたいと思ったり。
個人的には、React Nativeもやってみようと思ってるけど、WebAPIが進むとガワネイティブなアプリも結構強力になりそうで悩んだりしてる。
僕の作ってるアプリ、QuickLogBookはXamarin製ガワネイティブアプリ。
このアプリを作るうえで培った知見も、ちゃんとアウトプットしていきたい。
とくにXamarinでこういうことしてる例がネット上に殆どないので、書いていく価値はあると思う。
というところで、今日はこんな感じで。
p.s. スマホから更新も出来た。
このサイトは個人的に立ててるgitリポジトリサーバ(gitea使ってます)のgitリポジトリで管理してて、そこにpushすれば更新が出来るという便利仕様になってます。
コンテンツはテンプレートエンジンで整形してるので、基本はテキストファイル書き換える気分で変えられるので、少し修正するぐらいならこれで十分かも。
Androidアプリはforkerっての使ってみてます。
少し前はtermuxとviでやってましたが、そこそこ辛かったので、これで出来たら万々歳ですね。
2019/09/20(2)
少しだけコンテンツを追加した。
前にこぢんまり作ってたコンテンツを移植した感じ。
というかそのまま持ってきただけ。
↓JSのみでQRコードやEANなどバーコードを作るやつ。
↓GPSを使って座標を表示するやつ
↓ファイルからDataURI形式に変換するやつ。
なんだかんだで自分も普段使ってるものだったり。
普通に記事も書かないとな、と思ってはいる。
あ、favicon作らないと。
2019/09/20
Webサイトのディレクトリを切りなおしたり、いろいろ。
2019/09/19
ちょっとずつ作っていってます。
書いたもの