Skip to content

Instantly share code, notes, and snippets.

Avatar
:octocat:
⭐️ 🚀 🍻 🍶

kazu69 kazu69

:octocat:
⭐️ 🚀 🍻 🍶
View GitHub Profile
View select-frontend-tech.md

フロントエンドの技術選定で考えること

Frontend Study 用

前提: フロントエンドは式年遷宮が有効である

  • DB を持たないため、表層の技術を交換するだけで済む
    • JSON API が実質的な分解点になっている
    • 近年ではモバイルアプリのために JSON API が切り離されていることが多く、ここの利用者になるだけでよい
  • Rails や PHP で ORM ヘルパーにべったりな場合に困難になる(クライアントで同等のバリデーションを再現する必要)
@mizchi
mizchi / how-hooks-work.md
Last active October 31, 2022 06:15
(翻訳) React Hooks は魔法ではなく、ただの配列だ
View how-hooks-work.md

(翻訳) React Hooks は魔法ではなく、ただの配列だ

この記事は https://medium.com/@ryardley/react-hooks-not-magic-just-arrays-cd4f1857236e の日本語訳です。途中で力尽きて雑な翻訳になってる箇所がいくつかあります。


どのように Hooks が動いているか

私は、新しい Hooks の API の "magic" な挙動に悩んでいる人が結構いると聞いています。なのでこの構文の提案が、少なくとも表面的なレベルではどう動いているか、解説してみようと思います。

@rosskevin
rosskevin / hoc-template.tsx
Last active August 23, 2020 19:44
Typescript higher order component (hoc) template
View hoc-template.tsx
/* variation on https://medium.com/@DanHomola/react-higher-order-components-in-typescript-made-simple-6f9b55691af1 */
import * as React from 'react'
import { wrapDisplayName } from 'recompose'
// Props you want the resulting component to take (besides the props of the wrapped component)
interface ExternalProps {}
// Props the HOC adds to the wrapped component
export interface InjectedProps {}
@nepsilon
nepsilon / one-line-browser-notepad.md
Created September 27, 2016 05:25
One-line browser notepad 📝 — First published in fullweb.io issue #67
View one-line-browser-notepad.md

One-line browser notepad 📝

Sometimes you just need to quickly take some notes.

A trick is to use the data: scheme with data:text/html to show just a piece of HTML in your browser. Then using the mighty contentEditable to make the whole thing editable.

To copy/paste into your browser address bar:

data:text/html,<html contenteditable>
@kazu69
kazu69 / exmaple.md
Last active August 7, 2016 05:42
rpmbuild custom package example
View exmaple.md

example

create rpm hello using rpmbuild.

docker build -t fedora -f ./fedora.dockerfile .
ocker run -it fedora /bin/bash
bash-4.3# hellow
bash: hellow: command not found
bash-4.3# hello
@juhaelee
juhaelee / react-typescript.md
Last active January 26, 2023 00:52
React + Typescript Cheatsheet
View react-typescript.md

React + Typescript Cheatsheet

Setup

If you use atom... download & install the following packages:

What are Typescript type definition files? (*.d.ts)

@sosedoff
sosedoff / 1_simple.go
Created July 16, 2016 18:45
Golang Custom Struct Tags Example
View 1_simple.go
package main
import (
"fmt"
"reflect"
)
// Name of the struct tag used in examples
const tagName = "validate"
@langpavel
langpavel / GraphQLTimestamp.js
Last active September 18, 2022 15:44
GraphQLTimestamp.js
View GraphQLTimestamp.js
import { Kind } from 'graphql/language';
import { GraphQLScalarType } from 'graphql';
function serializeDate(value) {
if (value instanceof Date) {
return value.getTime();
} else if (typeof value === 'number') {
return Math.trunc(value);
} else if (typeof value === 'string') {
return Date.parse(value);
@tejacques
tejacques / HOCBaseRender.tsx
Last active May 2, 2022 13:05
React Higher Order Components in TypeScript
View HOCBaseRender.tsx
import * as React from 'react';
import { Component } from 'react';
export default function HOCBaseRender<Props, State, ComponentState>(
Comp: new() => Component<Props & State, ComponentState>) {
return class HOCBase extends Component<Props, State> {
render() {
return <Comp {...this.props} {...this.state}/>;
}
}
@azu
azu / js.md
Last active December 28, 2021 07:19
JavaScriptのレベル別書籍のまとめ
View js.md

前提: 完成していて、比較的支持を集めていて、JavaScriptを中心にした書籍 (DOM APIよりは言語を中心とした内容)

追記: JavaScriptの入門書 #jsprimerを書いている

最初からES2015で学ぶことを前提にした初心者〜中級者向けのJavaScript本がなかったので書いてる。 ES2015でJavaScriptという言語のコア部分は大きく変わったので、それを前提とした内容にする予定。