豆腐とコンソメ

豆腐とコンソメ

もろもろのプログラム勉強記録

javascript

VSCode の Prettier の設定を理解する

VSCode の Prettier の設定を理解する VSCode で prettier を使う際に、なんとなくで設定していてたまに困るので整理する。 prettier の vscode 用拡張機能のページをちゃんと読めば、いろいろと書いてあったのでメモ。 https://marketplace.visualstudio.co…

jestのmockを学ぶ

モックを学ぶ jestを使っていてモックで毎回あれ?ってなるので備忘録 関連 www.tohuandkonsome.site 前提 テスト対象のtarget.js import getName, { getAge } from "./service"; // 関数の場合 export default (id: string) => { const { name } = getName(…

ES2015 より前のクラスについてのメモ

ES2015 より前のクラスについてのメモ github.com 基本 ES2015 より前の構文。 ブラウザで実行する場合は、Babel を使わなくても、IE11 で実行することができる形。 もちろん Node.js でも実行することができる。 function Member(firstName, lastName) { th…

ジェネレーターと非同期処理があんまりわかってなかったのでメモ

redux-saga に入る前に redux-sagaのサンプルを見ていて、function*をみた瞬間、これなんぞ!となったのでメモ。 ジェネレーター function*はジェネレータ関数。 他の言語でも、見たことはあったけど、ちゃんと使ったことがなかった。 こんな感じに使える。 …

jest + Vue.js でテストコード入門に至る道のり

jest + Vue.js でテストコード入門に至る道のり フロントエンドでもテストコード書いてったほうがよさそうだから、Vue.jsでもテストコード書いてみるか!ということでいざ始めてみると、書けはするんだけどなにやら設定やら必要なモジュールが多くってねぇ、…

webpackの設定を行う対話ツールをつくる

webpackの設定をちょっと変更して起動したいとき、webpack.config.jsを直接書き換えるか、それ用のwebpack.config.hoge.jsとかを用意したりすればいいよね。 なんだけど、yarn hogehogeってしたらCLIツールが立ち上がって、対話形式で設定を変更できたらすこ…

chrome-extensionをReactでさくっとつくる

Reactの公式ドキュメントが日本語化されて改めて読み直してる。 英語で読んだ時によくわからなかったりしていた部分もちゃんとわかるようになって、翻訳をしてくださった方には感謝でいっぱい。 とはいえ、英語でドキュメントを読めた方がなにかと便利なのは…

react-reduxを学ぶ

ReduxをReactで使うときは、react-reduxを使うんだよ!と講座で教わり、以降何も考えずにreact-reduxを使ってきた。 connect()の書き方がよくわかんねえよ!とか、Reduxの非同期処理がわかんないよ!とか、いろいろありつつも、今回はそもそもreact-reduxっ…

redux-thunkを学ぶ

Reduxに慣れ始めたのであらためてredux-thunkをちゃんと理解しようと思う。 redux-thunk まずは基本 非同期処理 middlewareを使う redux-thunk redux-thunk github.com redux-thunkは以下のように非常にシンプルなコードでつくられている。 魔法のようなredu…

jestで特定のモジュールのみmockにする

こっちでもmockの話を書いた。 www.tohuandkonsome.site 以下のように、1ファイル内に、複数の関数があり、loginのみmockにしたい場合。 firebase.js export const login = () => { // login用の何かしらの処理 }; export const logout = () => { // logout…

React.jsのテストコードWorkshopの内容まとめ(1)

UdemyのReact講座に学習が完了したので、この勢いでテストコードの書き方を学 ぶことにするよ。 今回は、こちらのReactテストコードのworkshopの視聴した内容から学んだことを書いていきます。 https://www.udemy.com/react-redux/learn/v4/overview worksho…

年始だしReactに入門する(2)

日記 2019年になったので、どこかで去年の目標を見返してみようと思う。 本題 横道にずれたり、なにかしながらやったりとあんまり進んでない。 正月休みのうちにReactの講座を終わらせたい。 前回からの続き www.tohuandkonsome.site SECTION8 APIを呼び出す…

年末だしReactに入門する(1)

UdemyのReactの講座を受ける機会があったので、備忘録がてら感想をメモ。 https://www.udemy.com/react-redux/ 過去にも、UdemyのReact講習をやったんだけれども、せっかくなのでやってみる。 www.tohuandkonsome.site 受けた人のレベル的に Web開発経験2年…

受託案件のWeb系の納品物ってビルド後のソースとソース一式、どっちを渡してる?

前置き Web案件の受託開発をしていてふと思った疑問。 納品するときって、ソースコード一式 or Webpackでビルド後のソースのどっちを納品してますか? 大抵はソースコード一式を納品しているような気もするんだけれども、わりとビルド後のソースだけを納品し…

Vue.jsから入りReactを触ったときの気づき

www.udemy.com こちらのReactの講座途中まで終わって、あーVue.jsでもこうすればいいんだなぁという点があったので書く。 ※書いているコードは、直接この記事で書いちゃったのでtypoミスなどなにかしらのミスがあるかもしれません。 今まで こんなふうに、メ…

やっぱり、WebpackもBabelもよくわからない

日記 Reactをさわってみることにした。 本題 webpackとBabelの違いがなんだかわからなくなってしまった今日このごろ。 自分の中では、両者はこんな認識だった。 webpack:複数のjsファイルとかだったりをひとつにまとめることができる。 Babel: ES6構文をES…

ファイルアップロード機能で学ぶVue.js(2)

日記 なんかこう人生に対してやる気がでないときってあるよね! 今、そんな感じ。 よくあるのであまり気にしてないのだけれども、もしこれが続くようなことがあった場合、フリーランスだと怖いなぁって思う。 小説の死のロングウォークを思い出したりするよ…

ファイルアップロード機能で学ぶVue.js(1)

日記 会社で有料セミナーにいってもいいと言われると、お高い普段なかなかいけないような勉強会を探したりしています。 これいいな!と思ったらちょっと高かったりして敬遠したことが何度かあったのに、いざ探すとなるとなかなか見つからないものですね。 本…

コールバック地獄を体験したいんじゃ~Promiseへの道~(2)

日記 風邪が長引いてランニングも勉強もちょっとさぼりぎみ。 ぐうたら寝てばかり。 こういう時期ってあるよね。 前回の続き 前回、以下の処理をcallback関数を使って実現しました。 www.tohuandkonsome.site ファイルを読み込む 読み込んだファイルの内容の…

コールバック地獄を体験したいんじゃ~Promiseへの道~(1)

日記 2018年明けましておめでとうございます。 更新が滞ってました。 年末にかけて仕事が多少忙しくなったこともあり、なかなかまとまって書く時間が取れなかったです。 新年は、39度の熱を出すという散々なスタートとなってしまいましたが、なんとか良い年…