Berry(yarn v2) + TypeScript + PnP + Workspace でプロジェクトを作ってみた感想 - Qiita
Berry(yarn v2) + TypeScript + PnP + Workspace でプロジェクトを作ってみた感想npmYARNyarnpkg berry(yarn v2) がそろそろリリースということで、使い込んでみた。その感想や yak-shaving などについて。 このリポジトリ https://github.com/mizchi/berry-typescript-project 日本語での網羅的な解説はこちらの記事がくわしい https://qiita.com/dojineko/items/6f65fde3c47aed8b6318 本記事は pnp の仕組みと webpack, jest, typescript を設定する泥臭い話がメイン。 使ってみた感想 npm とは完全に別系統に進化しつつある。互換があんまりない。 今対応するのは時期尚早でアーリーアダプターだけでよい
fly.io で React アプリケーションの SSR を行う - Qiita
import React, { Dispatch, useContext, useReducer, useState, useCallback } from "react"; import { Route, Switch, Link } from "react-router-dom"; import styled, { createGlobalStyle } from "styled-components"; import { Action, reducer, RootState } from "./reducer"; import * as actions from "./reducer"; // RootState context export const RootContext = React.createContext<RootState>(null as any); export
俺が考えた最強の Reactのステートレスコンポーネントの書き方 - Qiita
最近自分はこう書いてるという例。意見が欲しい。 この記事に redux は出てこない。 参考: https://qiita.com/mizchi/items/bcb1aef8d1f14f8d0b4a 構成要素 React flow styled-components recompose 以下 SFC = Stateless Functional Component /* @flow */ import React from "react" import styled from "styled-components" import pure from "recompose/pure" type Props = {| value: string |} export default pure(function Example(props: Props) { const { value } = p
JSフレームワークの末端がWebComponentsになるのか、なれるのか、検証してみた - Qiita
https://speakerdeck.com/mizchi/real-world-es201x-and-future で、「Reactやその他のフレームワークの末端はWebComponentsになるのではないか？」という話をした。とはいえ、実際に自分でそういうものを実装したわけではなかった。 じゃあ実際に、Reactから web components を呼ぶにはどうなるだろうか？実装してみた。 ゴールの設定 こういうコードが動いてほしいとする。 import React from 'react' export default class Home extends React.Component { constructor() { super() this.state = { value: 0 } } componentDidMount() { let cnt = 0 setInterva
Next.js を Firebase hosting で動かしてSSRする - Qiita
いわゆるサーバーレス。 TL;DR すべてのリクエストを Firebase Functions に流して next.js に食わせた結果を返すとSSRになる。最高。 概要 Firebase Hosting は index.html を上げたら動いてくれる静的サイトホスティングだと思っていたが、 全てのルーティングを Firebase functions に全て受けさせる。こともできた GCP知らない人向けに 一応解説しておくと Firebase Function = Google Cloud Function ≒ AWS Lambda そんでもって、React で SSR したいとき、スクラッチでもいいけど、一番簡単なのは next.js。next.js 公式にも exmaples があり、読んでみたら勉強になったので解説してみる。 Firebase Hosting の設定 { "func
sourcemap を無効化して webpacker の production build を 2000% 速くする - Qiita
TL;DR プロダクションで sourcemap が有効化されていたので、関連オプションを切って回ったら 2000% 高速化した。 問題 NODE_ENV=production bundle exec rake webpacker:compile が致命的に遅かった。 エントリーポイントが17個でビルド時間が合計680s という有様で、プロダクションとはいえ デプロイ を11分遅くさせるのは、ビジネス的に致命的な感じだった。 調査 さしあたり、いつもの経験則で uglify の mangle オプションが遅いんだろう、と思って、webpacker のソースの設定を見に行ったら、うん？？？？となる設定をみつけた。 this.plugins.set('UglifyJs', new webpack.optimize.UglifyJsPlugin({ sourceMap: true, compre
fuse-box で JS を bundle する + HMR - Qiita
It is blazing fast (it takes 50-100ms to re-bundle) which makes it extremely convenient for developers. It requires zero configuration to bundle such monsters like babel-core. FuseBox loves typescript, and does not require any additional configuration. It will compile and bundle your code within a fraction of a second, yet offering a comprehensive loader API. It is packed with features, and unfold
春からはじめるモダンJavaScript / ES2015 - Qiita
春ですね！人の配置がリファクタリングされ、コードもリファクタリングの季節です。 では僕がここでモダンなJavaScriptとES2015の利点を語る役をやるので、みなさんはチームを説得する役をやってください。 JavaScriptの歴史 まず最初にJavaScriptの歴史を踏まえることで、今学ぶべきものとその理由を確認しましょう。 なぜ2016年の記事でES2016ではなく、ES2015なのか、と疑問に思った方もいるかもしれません。それは、ES2015がただの年次アップデートではなく、これから始まる毎年のメジャーバージョンアップの起点となるバージョンであり、またES5から飛躍的に仕様が増えたバージョンであるからです。 簡単に(雑な)歴史を紹介します。 ブレンダン・アイクによってNetScapeに実装/搭載された古の時代〜IE6 (1996~2005) ES3: 一時はシェア7割を誇ったレ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
gitでyarn.lockを常にバイナリとして扱う - Qiita