DreamShaded

Препроцессор Pug(Jade)

Pug - это препроцессор HTML и шаблонизатор, который был написан на JavaScript для Node.js.

Содержание:

1. Теги
2. Текст
3. Атрибуты
4. Констуркция Switch Case
5. Циклы
6. Вставка JavaScript кода

DreamShaded

Создание и настройка ssh ключей

1. Запустите Git Bash и введите

ssh-keygen -t rsa -C "your@email.ru"

2. На вопрос “Enter file in which to save the key” введите id_rsa и нажмите “Enter”

3. Далее введите любой пароль, и подтвердите его (лучше пропустить, потому что каждый раз при соединении с github, придется вводить его)

DreamShaded

xclip -sel clip < ~/.ssh/id_rsa.pub

# in case you get a display null error
DISPLAY=:0 xclip -sel clip < ~/.ssh/id_rsa.pub

# osx
pbcopy < ~/.ssh/id_rsa.pub

DreamShaded

VSCode - ESLint, Prettier & Airbnb Setup

1. Install ESLint & Prettier extensions for VSCode

Optional - Set format on save and any global prettier options

2. Install Packages

npm i -D eslint prettier eslint-plugin-prettier eslint-config-prettier eslint-plugin-node eslint-config-node

DreamShaded

Requirements

• maim
• xclip

Set-up

Set this on your i3 config file ~/.i3/config

# Screenshots

DreamShaded

Advanced Formatting in GitHub Markdown

GitHub Flavored Markdown lets you create useful documents in GitHub and GitHub Enterprise using .md files. Like other varieties of markdown, GitHub Markdown tries to be as readable as possible in its raw form, resulting in an intentionally limited set of formatting options. However, these options can feel restrictive when dealing with complex content.

Although GitHub Markdown strips out most HTML tags, here are a few tricks that can give you more flexibility when formatting your documents. These advanced formatting options can make your documents more useable, but they come at the expense of plain text readability, so use with caution.

DreamShaded

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

Last major update: 25.08.2020

• Что такое авторизация/аутентификация
• Где хранить токены
• Как ставить куки ?
• Процесс логина
• Процесс рефреш токенов
• Кража токенов/Механизм контроля токенов

DreamShaded

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

DreamShaded

Traefik, как обратный прокси в Docker (пример с 2 react проектами)

В результате будет 2 react проекта на 1 сервере доступных по разным ссылкам

Цели

• Запустить traefik в одном контейнере
• Запустить другие проекты в других контейнерах
• Соединить все контейнеры в одну docker cеть
• Настроить контейнеры с проектами так, что-бы они объясняли traefik'у, какие url ведут на конкретный проект

DreamShaded

# Using edge-git ensures we're always pulling the latest
# You can lock into a specific version using the *-git tags
# on https://hub.docker.com/_/docker/
image: docker:edge-git
services:
- docker:dind

# If you only need compose in a specific step definitely put this
# only in that step so it's not executed unnecessarily
before_script: