サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
大谷翔平
dev.to/mizchi
GitHub Actions can use windows and mac for ci container so I think, "IE11 and Safari work on CI?". Speaking from conclusion, it works! I succeeded to run windows/ie11 mac/safari windows/chrome windows/firefox on GitHub Actions. My working example is here. https://github.com/mizchi/frontend-gh-action-playground Setup I use node.js selenium-webdriver and jest(-ts). // e2e/runWithSelenium.ts import w
Inject state and dispatcher context by React.Context and useContext import React, { useReducer, useContext, Dispatch, ReactElement } from "react"; import ReactDOM from "react-dom"; type CounterState = { count: number; }; const initialState: CounterState = { count: 0 }; function reducer(state: CounterState, action: any) { switch (action.type) { case "reset": { return initialState; } case "increment
I tried helpers to mount react and vue components via webcomponents. https://github.com/mizchi/wc-helpers My goal is to try micro-frontend. import { vueElementFactory, reactElementFactory, encodeProps } from "@mizchi/wc-helpers"; // register customElements.define("my-react-component", reactElementFactory(MyReactApp)); customElements.define("my-vue-component", vueElementFactory(MyVueApp)); // run c
I made experimental modules to use redux in worker. mizchi/redux-workerized TypeScript Friendly API Redux.Store in Worker React Hooks API and Vue Plugin Shared Store example Code full code is here https://github.com/mizchi/redux-workerized/tree/master/examples/microfront import "@babel/polyfill"; import { RootState, increment, Increment, INCREMENT } from "./reducer"; const worker = new Worker("./w
Save this code as index.html and open by your (modern) browser. <div id=root /> <script type=module> import React from 'https://dev.jspm.io/react@16' import ReactDOM from 'https://dev.jspm.io/react-dom@16' ReactDOM.render( React.createElement('h1', null, 'hello'), document.querySelector('#root') ) </script> Enjoy! How it works This is shorthand html file without <html>, <body> and so on. Just <div
/* @flow */ import React from 'react' import { bindActionCreators, combineReducers } from 'redux' import { compose, lifecycle, pure, type HOC } from 'recompose' import { connect } from 'react-redux' // reducer const INC = 'inc' const inc = () => ({ type: INC }) type Counter = { value: number } type Action = $Call<typeof inc> const counter = (state: Counter = { value: 0 }, action: Action): Counter
Why SPA and Mobile App need just one single endpoint to graphql. This way can not implement subscription with ws backend. I think I don't need it because firestore will resolve it. What I will not write in this article... How to deploy to firebase GraphQL Server implementation webpack / npm install / package.json functions code functions/index.js const functions = require('firebase-functions') con
package.json firebase.json functions/ _dist/ # generated by webpack index.js package.json index.js # entry point webpack.config.js // functions/webpack.config.js const pkg = require('../package') const GenerateJsonPlugin = require('generate-json-webpack-plugin') // Set externals that you don't want to build by webpack const externals = [ 'firebase-admin', 'firebase-functions' ] const genPackage =
最初にいっておく。これは負け惜しみだ。 SPAとPWAの現状 自分は日本でReactの勝手エヴァンジェリストみたいなことをやっていて、SPAの重めのコンテンツをよく作ってるからか、「お前らフロントエンドを物事をややこしくして、重いページを量産してウェブを劣化させてるじゃないか!」みたいな批判を、名指しでよく受ける。なんで僕にいうかわからないけど、React = SPA みたいなイメージでスケープゴートにされてるんだろう。それはまあいい。 自分の仕事でSPA技術を使うところは、ちゃんと必要性もあるし理由も説明できる。ただ、やはり近年の複雑化/重量化について思うところはあるので、逆に振って AMP/PWA という選択肢を持っておきたくて、正直言うと依頼されたR&Dの仕事でもあったんだけど、一通り覚えた。なんだけど、今のところ仕事で使うタイミングがない。 PWA技術を仕事で使えなかった理由として
このページを最初にブックマークしてみませんか?
『Koutaro Chikuba — DEV Community Profile』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く