GLSLの練習【Crop, Tiling】

GLSL(OpenGL Shading Language)を使って画像処理する練習。

今回は色々な切り抜き(Cropping)と敷き詰め(Tiling)。

最終的にreact nativeで使いたいのでgl-reactを前提として書きます。

続きを読む GLSLの練習【Crop, Tiling】

【Typescript】モジュールをブラケット表記法で使う

import * as M from ""で読み込んだモジュールをブラケット記法[]で使いたい。

こんな感じで引数(変数)に対応したモジュールを使いたい場合にどうするか。

続きを読む 【Typescript】モジュールをブラケット表記法で使う

React Native, Expoを使った画像処理の流れ

色々と機能の限られるReact Native(Expo managed)で画像処理することを考える。

細かい部分はドキュメントを参照するとして使うライブラリや全体的な流れをざっくりとまとめてみます。

I/Oに不満がなければわりと好き放題できる。

続きを読む React Native, Expoを使った画像処理の流れ

日時を使った新規ファイルの命名

なにか新しくファイルを作るときには命名法則を考える必要があります。

被らずにソートしやすいものとして日時の情報を使うことが多いですが、どうやって使うのがいいかなと思ったのでjavascriptで適当に動かしてみます。

続きを読む 日時を使った新規ファイルの命名

React Native (Expo)でカメラプレビューにエフェクト

Expoでカメラを使う時ライブプレビュー画面にgl-reactでエフェクトをかけたい。

gl-reactに関してはこことかこことかここも参照。

結論を書くとあまりスマートな方法で解決はできなかったです。

 

関連リンク

続きを読む React Native (Expo)でカメラプレビューにエフェクト

Next.js with Material-UIでスタイルが崩れる

Next.jsMaterial-UIの組み合わせでビルドすると予期せぬ表示ずれがあった。

現象としてはnext.jsのPHASE_PRODUCTION_BUILDgetInitialProps()のあるページで初回読み込みをするとmakeStylesによるスタイルが崩れる。

ErrorやWarningはないし上記以外のアクセスではスタイル崩れもない。

結構複雑な問題だったので要点をまとめながら解決を図ります。

環境:next: 9.1.7material-ui: 4.8.3react: 16.12.0カスタムサーバー express: ^4.17.1

続きを読む Next.js with Material-UIでスタイルが崩れる

Next.jsプロジェクトの公開手順

Next.jsで作ったアプリを公開、SSL対応、永続化するためのメモ。

nowじゃなくて普通に自前のLinuxサーバーに載せることを考えます。

気持ち的にはNext.jsプロジェクトの初期設定の続きです。

続きを読む Next.jsプロジェクトの公開手順

【Typescript】Nullableに対する様々な操作

Next.js(React)でTypescriptで書いていますが、DOM関連でNullableな操作が続きどう処理するのがいいか悩んだので色々やってみます。

Typescriptは制限と同時にできることも多いので思いのほか色々できました。

 

キーワード:Null合体演算子Null条件演算子Null許容型Type GuardNon-null assertion operatorDefinite Assignment AssertionsOptional chaining

続きを読む 【Typescript】Nullableに対する様々な操作

Next.jsプロジェクトの初期設定

next.jsはnowと合わせると秒単位でWEBアプリを公開できるような超速フレームワークですが、それなりの規模のものを作ろうと思うと色々設定が必要です。

大分慣れてきたので振り返りもかねてプロジェクト初期設定の備忘録。

プロジェクト作成からGit設定、各種コンフィグ類の設定、必須ライブラリの導入とカスタムページの用意まで。

続きを読む Next.jsプロジェクトの初期設定

【javascript】URLエンコードあれこれ

色んなAPIを使っているとPOSTで情報取得をするものもあります。

api keyなんかが必要な場合は仕方ないとして、どうでもいいパラメータをPOSTで送るものがREST APIと自称してて??となることも多々。

そんな中で躓くことの多いapplication/x-www-form-urlencodedのエンコードをどうするのがいいかなと試してみたので覚書き。

 

基本的にネストしたデータは送らないという前提で書いていきます。

階層化したデータを送る必要があるならapplication/jsonで送るかJSON.stringfyしたものを送るようになっているはず。きっとそう。

とはいえ必要な場面が来るかもしれないのでそれっぽいコードも書いておきます。

続きを読む 【javascript】URLエンコードあれこれ