クライアントサイドでpngファイルを作りたかったけれど、諦めてサーバーサイド(perl)にしよう。Imagerでpngを作ってみる。後はReactからダウンロードさせる。stackoverflow.comstackoverflow.com

tech-sketch.jpこちらを見ながら試してみよう。 まずは(Msys2でnode.js環境） npm insall svgng --saveとしたら、 gyp ERR! configure error gyp ERR! stack Error: Can't find Python executable "python2", you can set the PY THON env variable.pacman -…

React.jsでアプリを作っていますが、いまだに理解が浅かった。 stateはコンポーネントに1つということを理解していなかった。1アプリ１コンポーネント１インスタンスだとstateを使えるのですが、 １コンポーネントに複数のインスタンスがあるところ【下の図…

ドキュメントが何処見ていいのやら、わからなかったり、 サンプルソースがなかったり、結構大変だったので此処に記します。 Auth0(SPA)でリフレッシュトークン リフレッシュトークンを使うには、今までやってきたリダイ レクトモードではだめなようで。ポッ…

Ａｕｔｈ０で認証(リダイレクト） トークンをハッシュ(#)から取得、localstrageへ保存。 Ｗｅｂアプリ終了。＜＜トークンの有効期限を切れた時刻を超える＞＞Ｗｅｂアプリ起動 localstrageからトークンの有効期限を判断（＊） 有効期限切れ、Ａｕｔｈ０認証(…

こちらでverifyのデバッグできるので参考にしつつ。 https://jwt.io/Mojo::JWTというモジュールを使ってやります。 secretもbase64urlデコードする必要があるというところで はまりました。 package StampMaker::Service; use Mojo::Base 'MojoX::JSON::RPC:…

SPAで認証をしようとすると。Ｗｅｂベースのリダイレクトガンガンの ような認証ができないしなぁと思っていたら。 そういう要望に応えたのがOAuth2というものということらしい。 Auth0という認証サービスが便利らしいので試してみる。 React+ auth0 React+au…

javascriptの入れ替えするたびに、何回もＦ５キーをおしたり、していたけれど。 F12でブラウザの開発ツールを上げっぱなしですればいいのですね。 知らなかった！！

stackoverflow.comremoveして、追加しなおしとか考えていましたが。まじかい。whereでは、参照が返ってくるのか。知らなかったっすｗｗｗ node > var __ = require('lodash'); undefined > var a = [{name: 'dokechin'}]; undefined > var match = __.where(…

react-routerのexampleのソースでは、データを配列で持っていて 検索用にマップに詰め直しているかんじです。 なんで、そんなメンドクサイことをやっているのだろうと疑問に おもっていたのですが。 データを初めからObjectに詰めて使えば、検索しやすいのに…

class IndexSidebar extends React.Component { constructor(props){ super(props); console.log("IndexSidebar context"); console.log(this.props.context.userStore.getUserData()); this.state.userStore = this.props.context.userStore; // NG this.us…

これでいいのだ？！ 流れ① Action->Store変更->Viewのリスナ呼ばれてState更新。 流れ② View->State更新流れ①のStateと流れ②のStateは分けて使う。 流①のStateはViewから直接更新しないこと。 ホントは、流①はpropsで実装したいところだけど 何かと面倒っぽ…

プリペイド携帯を音声通話用に使用して30日1400円程度、データ通信は格安ＳＩＭ別途契約するのが いい感じがします。 プリペイド携帯は全然通話しないのでどんどん チャージ残高が増えて今は4万円ほどあるし・・ 格安ＳＩＭ音声通話付だと、通話してしまうと…

react-routerにはサンプルにはあるんですが、 使い方がおかしいのか、うまく動いてくれなかった。tag v1.0.0-rc3のソースを取得すれば動きました。 バージョンの入れ替わりが激しいので超注意ですね。github.com

CLUB DB2でAWS系の勉強を渋谷でした後に、 @xtetsujiさんの入社お祝いでGaiaxへ行ってきました。呼んでいただいて ありがとうございます。 丁度入り口でツイッターでドア扱いをしようとしていた ときに入り口にtetsujiさんが来てくれてありがたかった。生ハ…

reactでwebアプリを書こうとすると、routerとfluxを組み合わせて組むことになると 思います。学習能力の低いおじさんとしてはfluxとやらで躓いてしまいそうになったんですが、 material-fluxはシンプルでして、exampleも非常に読みやすいです。 import使った…

頭が混乱しているので、シンプルなflux実装(material-fluxのexampleをコードリーディング）github.com fluxを使うときに、親や子達のコンポーネントからaction,storeにアクセス できるように、ばら撒く必要があってまぁ、コンポーネントの一番親に 設定して…

Reactで作っていると1つのファイルでゴチャゴチャ 入れてしまって。カオス化してきてどうしよう。qiita.comES6でReact.Componentを継承するとき、書換えが必要。 setStateするときに、bindが必要 getInitialStateをコンストラクタに書く必要 stackoverflow.c…

待望のnode環境ができあがったのでうごかしみる reactのドキュメントはnode周りのあれこれは知っているものとして省略しているので ググらないととっつけない。https://facebook.github.io/react/docs/getting-started.html npm init npm install -g browser…

Node.jsをてがるにWindowsで使いたい以下の記事が参考になります。qiita.com $ npm -v module.js:340 throw err; ^ Error: Cannot find module 'C:\mingw64\lib\node_modules\npm\bin\npm-cli.js' at Function.Module._resolveFilename (module.js:338:15) a…

qiita.com fluxxorでreact-routerを使う方法がfluxxorのドキュメントにあった。Fluxxor - React Routerでも、react-routerは1.0になっていてこのサンプルだと対応していないのでgithub.comfluxxorだとES6で書くのがきついので、やっぱり違うＦＷを覚えないと…

Nexus7 2012タブレットが壊れたので いろいろと調査しているのですが・・ Nexus7 2013 LTEも魅力的だけど、また壊れるのではという 恐怖心で踏み込めない。ならば、mogi2fruits.netSIMフリーのEveryPad Proがなんか気になる存在。 Andoroidをエミュレーター…

クオリティはあれなんですが、やっとReact+SVGでお絵かきができるように なったので、サーバサイドに保存してみたくなった。 JSON-RPCを使ってみよう。以下とても、参考になりそう。qiita.comセッションに紐づけて保存したいので、 そこはHayajoさんのモジュ…

ふと、イベント探していたら目に留まったイベントspacemarket.co.jp 職場の帰り道だしと参加してきた。 受付すんで首からかけるネームプレートに 職種があったんですが、エンジニアがなくて、 エンジニア向けのイベントかなと勘違いしていたのだった。 まぁ…

取りあえず、こちらを参考にしながらReact.jsで実装してみよう。sterfield.co.jpこんな塩梅でmouseMove,mouseUpイベントを拾うのですが・・・ マウスぐりぐり動かすと、mouseUpイベントを拾いそこなうようで。 なんでだろう。 <g onMouseDown={this.handleMouseDown} onMouseMove={this.handleMouseMove} onMouseUp={this.handleMouseUp}> <circle id="circle" cx="250" cy="250" r="250" fill="#888" /> </circle></g>

わたしはdokechinと名乗るくらいのけちなので、、 プリケー携帯月1400円程度【60日で2800円で3000円のカードを買う】 を使っているのですが、ツイッターするときはメールを1通送るとかえってくるサービス を使っています。 非常にすばらしいサービスです。 T…

React.jsでお絵かきみたいなことをしたいのだけど。 <title>Hello world</title> <svg viewBox="0 0 500 500"> <circle onClick={this.handleClick} cx="250" cy="250" r="250" fill="yellow" stroke="orange" /> </svg> React.jsでこんな塩梅でクリック座標をとるのだが、 htmlのtitle部分のheightも加わった座標が返ってきてしまうので やりずらい。title部分のheightをどうやって求めるのかがわからない。 …

まずは、Webアプリ（Javascript)で実装しよう。 今回は、出来たらAndoroid版も作りたい アナログ時計のソースと解説こちらも参考にしようqiita.com

会場(dot) おしゃれで新しくて、場所もわかりやすいし駅も近い。いい感じ。 ボケて リモートといえど、週１か２週に１回くらい会う。 bokete6がいい感じ。普通の電話を使う。 男であだ名が複数あるといい感じ。うーん。確かに。 MYSQL5.7 mysqlpumpでしたっ…

syncer.jpPromote Your Content with Structured Data Markup | Structured Data | Google Developers 「ジョグナビ」用に、マラソンコースを表現するスキーマは無いか調べているけれど いいのが見当たらないなぁ。 トラベルアクション これは、コースという…