万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

  • ・資産運用おすすめ
    10万円は1000円くらい利益
    資産運用ブログ アセマネ
    • ・寄付お願いします
      YENTEN:YYzNPzdsZWqr5THWAdMrKDj7GT8ietDc2W
      BitZenny:ZfpUbVya8MWQkjjGJMjA7P9pPkqaLnwPWH
      c0ban:8KG95GXdEquNpPW8xJAJf7nn5kbimQ5wj1
      Skycoin:KMqcn7x8REwwzMHPi9fV9fbNwdofYAWKRo

    React

    Hexe+React

    https://qiita.com/shohei909/items/eb28dc663a56b17f05cf https://github.com/massiveinteractive/haxe-react

    React+PAY.JP

    https://github.com/LancersDevTeam/react-payjp-checkout https://tackeyy.com/blog/posts/implement-payjp-checkout-with-vue-spa

    React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで のメモ

    この本 React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで (NEXT ONE)作者: 穴井宏幸,石井直矢,柴田和祈,三宮肇出版社/メーカー: 翔泳社発売日: 2018/02/19メディア: 単行本(ソフトカバー)この商品を含むブログを見る この人の…

    material-uiでアンダーライン消す

    https://github.com/mui-org/material-ui/issues/2475 <TextField hintText="Hint Text" underlineStyle={{display: 'none'}} /></textfield>

    keepDirtyOnReinitializeとかRefuxForm

    https://github.com/JedWatson/react-select/issues/2131 updateUnregisteredFields : boolean [optional] Used in combination with keepDirtyOnReinitialize. Will update every initialValue which is still pristine. Normally only registered Fields w…

    React+Reduxのログイン

    この記事がいい React + Redux - User Registration and Login Tutorial & Example | Jason Watmore's Blog

    Reactで子コンポーネントのメソッドを呼ぶ

    https://stackoverflow.com/questions/37949981/call-child-method-from-parent ref使って、 <Child ref={this.child} /> current.メソッド名()で呼べる。 this.child.current.getAlert(); そのままだとundefinedになる?? コンストラクタでReact.createRef();が必須かも constructor(</child>…

    tableのcss border

    すぐ忘れるので・・。 jsfiddle.net const tableStyle = { width: 100, height: 100, border: '1px solid green', }; const borderStyles = [ { border: '30px solid green', borderRightColor: 'red', }, { border: '30px solid blue', }, ]; class Hello e…

    htmlをReactのJSXに変化 正規表現で

    <td colspan="9"> これを <td colSpan={9}> にしたい。 置換元 colspan="([0-9])*"> 置換後 colSpan={$1}> これは使い物にならない・・・ HTML to JSX VSCodeならこれいいかも? https://marketplace.visualstudio.com/items?itemName=riazxrazor.html-to-jsx https://marketplace.visualstud</td></td>…

    Reactで印刷専用CSSのインポート

    Reactで印刷専用CSSのインポートするときに、 print.cssに印刷専用コードを書き、 @import "print.css" print; と記載したインポート専用print-import.cssを作ってそれをTypScriptのコード上で、 `import 'print-import.css';やると行けるが・・・ ※私はcrea…

    Reactでの@pageのCSSの縦横

    @page{ /* 縦印刷 */ size: portrait; padding-top: 15mm; } これ medium.com これでcssをReactで使える。

    Reactのloopのref

    https://stackoverflow.com/questions/41838833/issue-storing-ref-elements-in-loop refHogeArr: (HTMLTextAreaElement | any)[]; ref={(bar) => { this.refHogeArr.push(bar); }} でもおかしい https://github.com/facebook/react/issues/1899

    Reactのtextareaタグのエラー

    <textarea>をつかうと index.js:2177 Warning: Use the `defaultValue` or `value` props instead of setting children on <textarea>. のエラーがでた。 HTML自体の<textarea>の書き方がinputと違い、タグの中身にかくのが統一性がなくて気に入らないなと思ってた。 </textarea>…

    ReactのJSXで簡単にforeach的なこと

    Reactのコンポートでfor (let i: number; i < arr.length; i++) { } とかだるい。 this.arrにstringの配列があるとして、 <tbody> { this.arr.forEach.call((item:string, index: number) => { return ( <tr> hoge </tr>); }) } </tbody> だとコンパイル時にエラー出ないと思ったらラ…

    React renderで2つ以上のコンポーネントをトップ階層に書きたい

    簡単に書くためdivを例に。 これは余裕で書ける。 render() { return ( <div /> ); } しかし、以下のように2つ書いたら当然のように怒られる。 render() { return ( <div /> <div /> ); } [tslint] unused expression, expected an assignment or function call (no-unused-expre</div></div></div>…

    Rect JSXのcss型

    React.CSSPropertiesだ。 import * as React from 'react'; const style: React.CSSProperties = { color: 'red', textAlign: 'center' }; React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで (NEXT-ONE)作者: 穴井宏幸,石井直矢,…

    Reactのtslintでref できない

    <input ref="end" type="month" name="end_date" /> と書いたら [tslint] Pass a callback to ref prop instead of a string literal (jsx-no-string-ref) tslintでのエラー。 stringなのはもうレガシー。 How to get values from input types using this.refs in reactjs? - Stack Overflow ref={(googleInpu…

    React render 非表示させたい

    例えばrenderを条件で非表示・表示わけさせたいときにreturnしてしまうと render() { if (hoge === bar) { return; } Table(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return nul…

    Reactでどうしてもif文をrenderに書きたい時

    render() { return ( <header> { (() => { if (this.props.hoge) { return <h1>{this.props.header.bar}</h1>; } return <h1>hoge</h1>; })() } こんな感じ。 { (() => { // do somethinf })() }</header>

    Reactのエラー

    React.js で map() を使ってみる - Qiita const numbers = [1, 2, 3, 4, 5]; const listItems = numbers.map((number) => <li>{number}</li> ); これreturnで{listItems}すると、 If you meant to render a collection of children, use an array instead. Array使え…

    ReactのUMD

    return ( <div key={key}> <td>{key}</td> </div> ); }); みたいなので、 [ts] 'React' は UMD グローバルを参照していますが、現在のファイルはモジュールです。代わりにインポートを追加することを考慮してください。 (property 'React' refers to a UMD global, but the current file is…

    Property does not exist on type 'DetailedHTMLProps, HTMLDivElement>' with React エラー

    <div class="page"> だとエラー https://stackoverflow.com/questions/46215614/property-does-not-exist-on-type-detailedhtmlprops-htmldivelement-with-react <div className="page"> でOK</div></div>

    StatelessComponent

    constructorがないComponentでやろうとするとエラー Argument of type 'typeof Login' is not assignable to parameter of type 'ComponentType<{ auth: any; } & { authActions: StatelessComponentつかう。

    TypeScriptでのtargetとかeventの型はどう書く?

    handleSubmit(event) { event.target.value; とJSだった時、TypeScriptでは? 調べたら https://stackoverflow.com/questions/40676343/typescript-input-onchange-event-target-value https://stackoverflow.com/questions/40676343/typescript-input-oncha…

    いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック 5章メモ

    第5章 P283 npm install --save multer P284 で以下のエラー 起動しました - http://localhost:3000 ファイルを受け付けました オリジナルファイル名: img_profile.png 保存したパス: /Users/shinriyo/imadoki_apps/src/ch5/express_test/tmp/fbf6a587e51c4c…

    いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック 4章メモ

    4章 P211 git clone https://github.com/electron/electron-quick-start cd electron-quick-start npm install && npm start P213 npm init -y npm i --save-dev electron npm i --save-dev react react-dom npm install --save-dev babel-core babel-preset…

    いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック 第2章

    2章 create-react-appのインストール /Users/shinriyo/.npm-global/bin/npm install -g create-react-app 実行 /Users/shinriyo/.npm-global/bin/create-react-app hello ./src/index.js 17:22-31 "export 'default' (imported as 'MultiForm') was not foun…

    いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック 第1章 メモ

    cd src/ch1 npm install request インストールするとフォルダ直下にnode_modulesができる。 ~/直下にnode_modulesフォルダがあるとできないようだ。 以下の、Warning が表示されていますがpackage.jsonが無い状態で実行しているため。 npm WARN saveError EN…