SergProduction

Архитектура проэкта на реакте

у каджого сайта есть своя бизнесс логика, свои правила вывода информации на сайте и взаимодейсвие пользователя с сайтом.

В реакт приложении должен существовать какой-то роутинг, который будет объявлять правила, по каким роутам какой компонент отдавать, будем называть такой компонент страницей

бизнес логика может ставить такие правила, что некоторые страницы могут содержать в себе одни и те же компоненты которые должны быть у пользователя на виду всегда, например это может быть меню, которое доступно на всех страницах,

Введение

Конктруктор - является значением. Им можно оперировать в программе как любым дригим значением, Например как строкой или числом

Тип - работает так же как и в других языках

Основы

t
- t('конструктор')
  нульнарный конструктор
- t('конструктор', тип)
  обычный конструктор
- t([ t('конструктор'), t('конструктор')] )
  перечесление, сумма
- t.forall(a => t('конструктор', a) )
  конструктор принимающий любой тип
t.recursive(thisType => t('конструктор', thisType) )

Стейт

Функциоанльный стейт это - функция которая возвращает пару, где первый элемент активный, а второй представляет хранилище. По дефолту второй элемент такого же типа как и первый, это значит если оба параметра пары будут Int, то в хранилище мы сможем хранить только один элемент. Позже мы расмотрим вариант где второй параметр будет списком, а пока давайте разберемся с концепцией функциоанльного стейта.

И так - как же нам записать в функцию что-то? как функция может хранить значение?

type State<A> = () => A

	// @flow
	type F = <P, D, R>(P => (D => R)) => (P => R)

	type BindActions<O: {[key: string]: Function}> = $ObjMap<O, F>

	type Dispatch = string

	const actionFoo = (a: number) => (d: Dispatch): Promise<number> => Promise.resolve(a)
	const actionBar = (a: string) => (d: Dispatch): Promise<Array<string>> => Promise.resolve([a])

	/*
	https://ru.stackoverflow.com/questions/664746/%D0%9A%D0%BE%D1%81%D0%B8%D0%BD%D1%83%D1%81%D0%BD%D0%BE%D0%B5-%D1%81%D1%85%D0%BE%D0%B4%D1%81%D1%82%D0%B2%D0%BE-%D0%BA%D0%BE%D1%81%D0%B8%D0%BD%D1%83%D1%81%D0%BD%D0%B0%D1%8F-%D0%BC%D0%B5%D1%80%D0%B0-%D0%B4%D0%BB%D1%8F-%D1%81%D1%82%D1%80%D0%BE%D0%BA

	type Docs = Array<string>
	type Words = Array<string>
	type MapWordCount = {[string]: number}

	type MapWordTF = {[string]: number}
	type DocsMapWordTF = Array<MapWordTF>

	// ----- lib -----
	const plus = (a, b) => a + b
	const mul = (a, b) => a * b
	const sum = arr => arr.reduce(plus)

	const zip = (f, arr1, arr2) => Array.from({ length: Math.min(arr1.length, arr2.length) }, (_, i) => (
	f(arr1[i], arr2[i])
	))

	compose = (...fns) =>

	import React, { Fragment, useState, useEffect } from "react"

	export const types = {
	text: (a) => ({ type: 'text', payload: a }),
	password: (a) => ({ type: 'text', payload: a }),
	checkbox: (a) => ({ type: 'checkbox', payload: a }),
	checkboxGroup: (a) => ({ type: 'checkbox-group', payload: a }),
	radio: (a) => ({ type: 'radio', payload: a }),
	file: (filename, file) => ({ type: 'file', payload: { filename, file } }),
	selectOne: (a) => ({ type: 'select-one', payload: a }),

	const multiSplit = (str, delimeters) => {
	let right = str;
	const result = [];

	for (let i = 0; i < delimeters.length; i++) {
	const indexDel = right.indexOf(delimeters[i]);
	if (indexDel === -1) continue;
	result.push(right.slice(0, indexDel));
	right = right.slice(indexDel + 1);
	}

	let text = `
	Баланс и оплата
	Как получить выйгрыш?
	Деятельность приема от физичиских лиц ....
	Как пополнить баланс?
	Для того чтоб пополнить баланс, надо быть в
	- банде Балансов
	Идентификацияbeecoder
	Где посмотреть точки?
	Там и тут ...