Skip to content

Instantly share code, notes, and snippets.

@monochromer
monochromer / README.md
Last active Sep 21, 2020
Вёрстка писем от HTMLAcademy
View README.md

Конспект

Отображение мета-информации в почтовом клиенте

  1. Указываем название компании строчными буквами (конечно, с первой заглавной), или же обращаемся лично либо от лица сотрудника компании. Пишем email отправителя, соответствующий его названию. Личное письмо от кого-то из компании — личный email, например, v.kozyrev@site.ru, информационное письмо — email от компании по типу info@site.ru, промоакция — promo@site.ru и т. д.
  2. Обозначаем тему, которая донесёт суть письма.
  3. Если темой невозможно полностью раскрыть суть — дополняем её прехедером.
<div style="margin:0; color:#fff; display:none !important; font-family:arial; font-size:1px; line-height:0;">
  Прехедер
View differential-js-loader.md

This is an alternative to the Modern Script Loading tchnique, that doesn't need to wait for the load event.

Compatibility

This technique has been successfully tested down to IE9.

<!DOCTYPE html>
<html lang="en">
<head>
@monochromer
monochromer / easings.css
Created Jul 24, 2020 — forked from argyleink/easings.css
Handy CSS properties for easing functions
View easings.css
:root {
--ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
--ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
--ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
--ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
--ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
--ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
--ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
--ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
--ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
@monochromer
monochromer / html-stream-generator.js
Created Jun 24, 2020
WIP. Потоковая выдача html через генераторы
View html-stream-generator.js
function isGenerator(target) {
return target[Symbol.toStringTag] === 'GeneratorFunction';
}
function isIterable(obj) {
if (obj === null || obj === void 0) {
return false;
}
if (typeof obj === 'string') {
@monochromer
monochromer / app-example.js
Last active Jul 14, 2020
Веб-сервер на Node.js как итератор, как поток
View app-example.js
const http = require('http');
const { once } = require('events');
class WebServer extends http.Server {
async *[Symbol.asyncIterator]() {
while (this.listening) {
const [ req, res ] = await once(this, 'request');
yield { req, res };
}
}
@monochromer
monochromer / notes.md
Last active Oct 13, 2020
Настройка веб-сервера
View notes.md

Сервер

Проверено на Ubuntu 18.04.4 LTS

Настройка root

Подключаемся

ssh root@IP
View skip-link-focus-fix.js
@monochromer
monochromer / user-content-wrap-text.md
Last active Feb 12, 2020
Контент, переносы и разрывы строк, переполнения контента
View user-content-wrap-text.md
  1. (Верстка: отображаем пользовательский контент)[https://habr.com/ru/company/docsvision/blog/310544/]
  2. (Где всё сложно с переносами строк. Вот все CSS- и HTML-хитрости для этого)[https://css-live.ru/articles/gde-vsyo-slozhno-s-perenosami-strok-vot-vse-css-i-html-xitrosti-dlya-etogo.html]
  3. (Передряги при переносах)[https://css-live.ru/articles/peredryagi-pri-perenosax.html]
  4. (Florian Rivoal. line-breaking)[https://florian.rivoal.net/talks/line-breaking]
  5. (A new terminal-style line breaking with CSS Text)[https://blogs.igalia.com/jfernandez/2019/06/10/a-new-terminal-style-line-breaking-with-css-text/]
  6. ()[https://www.cjcid.com/articles/wrapping-long-words-css-html/]

overflow-wrap (старый word-wrap)

  • normal
  • break-word - разрыв слов, но мягие переносы не рассчитываются по размерам контента. Если слово не может разорваться, переполняя контейнер, оно может разорваться где угодно во избежание переполнения.
@monochromer
monochromer / tokens.md
Created Nov 28, 2019 — forked from zmts/tokens.md
Про токены, JSON Web Tokens (JWT), аутентификацию и авторизацию. Token-Based Authentication
View tokens.md

Про токены, JSON Web Tokens (JWT), аутентификацию и авторизацию. Token-Based Authentication

Last major update: 21.10.2019

Основы:

Аутентификация(authentication, от греч. αὐθεντικός [authentikos] – реальный, подлинный; от αὐθέντης [authentes] – автор) - это процесс проверки учётных данных пользователя (логин/пароль). Проверка подлинности пользователя путём сравнения введённого им логина/пароля с данными сохранёнными в базе данных.

Авторизация(authorization — разрешение, уполномочивание) - это проверка прав пользователя на доступ к определенным ресурсам.

Например после аутентификации юзер sasha получает право обращатся и получать от ресурса "super.com/vip" некие данные. Во время обращения юзера sasha к ресурсу vip система авторизации проверит имеет ли право юзер обращатся к этому ресурсу (проще говоря переходить по неким разрешенным ссылкам)

You can’t perform that action at this time.