Skip to content

Instantly share code, notes, and snippets.

@kubk
kubk / install-fish.sh
Last active Jun 16, 2021
Ubuntu fresh install
View install-fish.sh
# Fix inotify issue: https://stackoverflow.com/a/56156015
@kubk
kubk / classes.ts
Last active May 3, 2021
Mobx 6 + TypeScript
View classes.ts
export class PlayerStore {
song?: Song;
isPlaying = false;
constructor() {
makeAutoObservable(this);
}
playSong(song: Song) {
this.song = song;
@kubk
kubk / mobx-6-cache.js
Created Apr 20, 2021
Simple Mobx 6 cache example
View mobx-6-cache.js
class UsersStore {
isLoaded = false;
users = [];
constructor() {
makeAutoObservable(this)
}
loadUsers() {
if (this.isLoaded) {
@kubk
kubk / gist:d874ad358bf7b124f725e0abef2132d0
Created Mar 9, 2021
Почему React context не замена стейт-менеджеру
View gist:d874ad358bf7b124f725e0abef2132d0
Ссылки:
- Лишний ререндер: https://codesandbox.io/s/usecontext-problem-b6evb
- Переизобретают Mobx с массой ограничений: https://habr.com/ru/post/546124/
- Разработчики из Atlassian не смогли переписать react-beautiful-dnd с Redux на контекст из-за проблем с перформансом: https://github.com/atlassian/react-beautiful-dnd/issues/1576#issuecomment-549643226
View mobx-reuse-store.ts
class ListStore<T> {
isLoading = false;
list: T[] = [];
constructor(loadList: () => Promise<T[]>) {
makeAutoObservable(this)
}
loadList() {
this.isLoading = true;
View di-container.ts
import { assert } from "ts-essentials";
export class Container {
private services = new Map<string, object>();
private factories = new Map<string, (container: Container) => object>();
set(key: string, factory: (container: Container) => object) {
this.factories.set(key, factory);
}
@kubk
kubk / effector-counter.ts
Last active Nov 5, 2020
mobx vs effector
View effector-counter.ts
import {createStore, createEvent} from 'effector'
import {useStore} from 'effector-react'
const increment = createEvent()
const decrement = createEvent()
const counter = createStore(0)
.on(increment, state => state + 1)
.on(decrement, state => state - 1)
@kubk
kubk / mobx.js
Last active Nov 6, 2020
Mobx VS Reselect comparison
View mobx.js
const store = makeAutoObservable({
shop: {
taxPercent: 8,
items: [
{ name: 'apple', value: 1.20 },
{ name: 'orange', value: 0.95 },
]
},
get subtotal() {
return this.shop.items.reduce((acc, item) => acc + item.value, 0);
@kubk
kubk / rxjs-plain.ts
Last active Apr 27, 2021
Counter state using different JS libraries
View rxjs-plain.ts
// RxJS - FRP
const increment = new Subject<void>();
const decrement = new Subject<void>();
const add = new Subject<number>();
type State = number;
const count$ = merge(
increment.pipe(mapTo((state: State) => state + 1))
decrement.pipe(mapTo((state: State) => state - 1)),
@kubk
kubk / add-hmr.sh
Created May 19, 2019 — forked from thomaswmanion/add-hmr.sh
Add HMR to Angular CLI
View add-hmr.sh
createEnvFile() {
production=$1
hmr=$2
file=$3
echo "export const environment = {" > $file
echo " production: $production," >> $file
echo " hmr: $hmr" >> $file
echo "};" >> $file
}