Dmitriy Pashkevich dipiash

## table-comparizon.csv

          
            Подход
            +
            -

            
              Способ 1. Пререндер существующего приложения
              Быстро для MVP
              Занимаемся построением экосистемы вокруг инструмента

            
              Способ 2. Пишем свой велосипед-сервер
              Кастомизируемость (плюс ли это - для нас осталось вопросом)
              Будем заново решать уже решенные проблемы в специализированных фреймворках

            
              Способ 3. Выбираем один из специализированных фреймворков для SSR типа Next.js/Razzle/After.js/etc.
              Большое сообщество; документация; примеры; большинство проблем уже пройдено и можно использовать в production
              Придется мириться с какими-то специфическими вещами и подходами

## createTestClient.ts
/**
 * The following file is an amalgamation of [Apollo Server Testing](https://github.com/apollographql/apollo-server/blob/main/packages/apollo-server-testing/src/createTestClient.ts)
 * and [apollo-server-integration-testing](https://github.com/zapier/apollo-server-integration-testing),
 * this allows the use of `headers` while making a request
 *
 * Credits to the original authors
 */

import express from 'express';
import { convertNodeHttpToRequest, runHttpQuery } from 'apollo-server-core';

## next.config.js
const path = require('path');
const glob = require('glob');

const {BundleAnalyzerPlugin} = require('webpack-bundle-analyzer');
const {ANALYZE} = process.env;
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');

module.exports = {
	webpack: (config, {dev, isServer}) => {
		if (ANALYZE) {

## vlc
vlc -I dummy rtsp://192.168.1.96:554/profile1 '#transcode{vcodec=h264,fps=20,vb=512,scale=1,acodec=none,venc=x264{aud,profile=high,level=60,keyint=15,bframes=0,ref=1,nocabac}}:duplicate{dst=std{access=livehttp{seglen=10,delsegs=true,numsegs=10,index=/var/www/live/mystream.m3u8,index-url=http://ip/live/mystream-########.ts},mux=ts{use-key-frames},dst=/var/www/live/mystream-########.ts},dst=std{access=http,mux=ts,dst=:8082/video.mp4}}'

## Web
Сетки
1. http://www.didgeroo.com/blog/responsive-web-design-guidelines-for-designers/ - набор сеток в psd
2. https://getbootstrap.com/css/#grid
3. https://dribbble.com/shots/1064433-Bootstrap-responsive-grid-PSD-Mobile-Tablet-Web-Free (лучше из 1 пункта)

Страницы
1. http://habrahabr.ru/company/ua-hosting/blog/272969/ - Убеждающий веб дизайн
2. http://habrahabr.ru/post/273917/#comment_8714703 - Landing page. Что такое. Из чего состоит. Виды. Процесс работы
3. http://habrahabr.ru/post/273795/ - Создание веб-сайта. Курс молодого бойца

## gist:3fbb408c882f9ccd457c
Ресайз картинки на все окно:

1) http://masscode.ru/files/zip/liCover.zip
2)
```
<link rel="stylesheet" href="/css/liCover.css">
```
3) <img class="cover" src="/pic/image.jpg">
4)
```

## Header size with rem
html {
  font-size: 16px;
}

.header {
  font-weight: normal;
  $start_size: 1.8rem;
  @for $i from 1 through 6 {
    &--size_#{$i} {
      font-size: $start_size - (0.2rem * $i);

## Background cascade
@mixin background ($title, $color) {
  $i: 0;
  @each $bg in (
    zero darken($color, 15%),
    one $color,
    two  lighten($color, 10%),
    three lighten($color, 15%),
    four lighten($color, 20%),
    five lighten($color, 25%)
  ) {

## Clearfix
.b_clearfix {
  zoom: 1; // for ie6/ie7

  &:after {
    clear: both;
  }

  &:after, &:before {
    content: '';
    display: table;
Подход	+	-
Способ 1. Пререндер существующего приложения	Быстро для MVP	Занимаемся построением экосистемы вокруг инструмента
Способ 2. Пишем свой велосипед-сервер	Кастомизируемость (плюс ли это - для нас осталось вопросом)	Будем заново решать уже решенные проблемы в специализированных фреймворках
Способ 3. Выбираем один из специализированных фреймворков для SSR типа Next.js/Razzle/After.js/etc.	Большое сообщество; документация; примеры; большинство проблем уже пройдено и можно использовать в production	Придется мириться с какими-то специфическими вещами и подходами
	/**
	* The following file is an amalgamation of [Apollo Server Testing](https://github.com/apollographql/apollo-server/blob/main/packages/apollo-server-testing/src/createTestClient.ts)
	* and [apollo-server-integration-testing](https://github.com/zapier/apollo-server-integration-testing),
	* this allows the use of `headers` while making a request
	*
	* Credits to the original authors
	*/

	import express from 'express';
	import { convertNodeHttpToRequest, runHttpQuery } from 'apollo-server-core';
	const path = require('path');
	const glob = require('glob');

	const {BundleAnalyzerPlugin} = require('webpack-bundle-analyzer');
	const {ANALYZE} = process.env;
	const MomentLocalesPlugin = require('moment-locales-webpack-plugin');

	module.exports = {
	webpack: (config, {dev, isServer}) => {
	if (ANALYZE) {
	Сетки
	1. http://www.didgeroo.com/blog/responsive-web-design-guidelines-for-designers/ - набор сеток в psd
	2. https://getbootstrap.com/css/#grid
	3. https://dribbble.com/shots/1064433-Bootstrap-responsive-grid-PSD-Mobile-Tablet-Web-Free (лучше из 1 пункта)

	Страницы
	1. http://habrahabr.ru/company/ua-hosting/blog/272969/ - Убеждающий веб дизайн
	2. http://habrahabr.ru/post/273917/#comment_8714703 - Landing page. Что такое. Из чего состоит. Виды. Процесс работы
	3. http://habrahabr.ru/post/273795/ - Создание веб-сайта. Курс молодого бойца
	Ресайз картинки на все окно:

	1) http://masscode.ru/files/zip/liCover.zip
	2)
	```
	<link rel="stylesheet" href="/css/liCover.css">
	```
	3) <img class="cover" src="/pic/image.jpg">
	4)
	```
	@mixin background ($title, $color) {
	$i: 0;
	@each $bg in (
	zero darken($color, 15%),
	one $color,
	two lighten($color, 10%),
	three lighten($color, 15%),
	four lighten($color, 20%),
	five lighten($color, 25%)
	) {
	.b_clearfix {
	zoom: 1; // for ie6/ie7

	&:after {
	clear: both;
	}

	&:after, &:before {
	content: '';
	display: table;