SQL Aliases

SQL Aliases используется, чтобы дать таблице или столбцу в таблице временное название.
Оно существует только на время запроса.
Оптимально использовать для :

- Читабельности, при длинных названиях
- Для объединения 2-х и более столпцов

SELECT CustomerName, CONCAT(Address, " ", PostalCode, " ", City) AS Address
FROM Customers;

Output:

CustomerName
Alfreds Futterkiste

Address
Obere Str. 57 12209 Berlin

CSS | Flex-shrink

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

По умолчанию он установлен на 1

Пример :

Представьте, что у нас есть три предмета в одном контейнере.
Посмотрите, что указывают их значения flex-shrink:

Первый элемент flex-shrink: 1;
Теряет 1/6 пространства

Второй элемент flex-shrink: 3;
Потеряет 3/6 (половину) свободного пространства

Третий элемент flex-shrink: 2;
Потеряет 2/6 (трети) свободного пространства

Bit | Набор современных компонентов

Bit позволяет разработчикам и командам экономить время, предоставляет набор готовых компонентов для всех популярных JS фреймворков (React, Vue, Node, Angular) и нативного JS.

Он работает с GitHub и NPM, так что вы можете легко публиковать и устанавливать компоненты для любого проекта.

CSS | Google Border

Анимированный border на HTML / CSS в стиле Google с использованием @keyframes , ::before, ::after
Совместимые браузеры: Chrome, Edge, Firefox, Opera, Safari
Адаптивный ко всем экранам

PHP | экранирование строк

Экранирование нужно для безопасности когда одни ЯП пишут текст для других ЯП, чтобы те могли его "прочитать".Если пользователь явно пытается "внедрить" вам какой-то скрипт, вы можете легко предотвратить его. Вы всегда должны экранировать пользовательские данные прежде, чем поместить их в SQL-запрос (это же касается и HTML).

Функция addlashes() — экранирует строку с помощью слешей т.е возвращает строку с обратным слешем перед символами :
(одинарная кавычка) ‘ ,
(двойные кавычки) " ,
(обратный слэш) \ ,
NUL (байт NULL)
Функция принимает в качестве параметров только строку.

<?php
// PHP program to demonstrate the
// working of addslashes() function

$str = addslashes('twinkle loves "coding"');

echo($str);
?>

Output : twinkle loves \"coding\"

MeteorJS | Node.js Framework

MeteorJS подойдет для всех потребностей, от простых приложений, таких как финансовый отчёт, до управления данными больницы (выходит менее 2 тыс. строк back-end и front-end кода)

С помощью готовых модулей этого фреймворка можно создать рабочее приложение за считанные часы, что требовало бы много затрат времени в стеке MEAN (MongoDB, Express.js, AngularJS and Node.js).

Также хорошо MeteorJS справляется с разными компиляторами, такими как CoffeeScript.
На сайте фреймворка есть интерактивные обучения, в которых можно создать TO-DO app или Whatsapp clone

Инструменты для отладки JavaScript

Для того чтобы разобраться в ошибках в коде существуют инструменты отладки.

№1: инструменты разработчика Chrome — отладчик
Добавьте команду debugger в ту строку вашего кода, в которой вам хотелось бы исследовать значения переменных и перезагрузите страницу.
Исполнение приостановится на команде debugger и вы сможете исследовать программу.

№2: React Developer Tools
Если ваше приложение основано на React и нужно проверить значения свойств или состояний, вам стоит познакомиться с расширением React Developer Tools для Chrome.

№3: отладка серверного кода и Node Inspect
Node Inspect похож на инструменты разработчика Chrome, но предназначен он для серверного кода.

№4: проверка ответа сервера — Postman
Postman — это настольное приложение, его надо скачать и установить. Оно позволяет выбрать вид запроса (среди них — GET, POST, PUT, PATCH, DELETE), добавить нужную вам конечную точку, а если надо — то и данные для аутентификации, и отправить запрос на сервер.

GraphQL Editor

Это визуальный инструмент для составления GrapthQL запросов

Преимущества:

- облегчает понимание GraphQL
- создает запросы без написания кода
- делает графическую модель вашей схемы
- подходит новичкам и опытным пользователям
- поддерживает командную разработку

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

Что такое SSR

SSR — (анг. аббревиатура от Server Side Rendering) это технология, которая позволяет, с помощью Node.js, запускать JavaScript код на сервере и готовый результат отправлять пользователю.

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

Оптимизация
Когда пользователь заходит на сайт, сделанный с помощью JavaScript, то все расчеты и отрисовка графических элементов возлагается на его браузер. SSR помогает снизить нагрузку на браузер пользователя, это особенно важно, если пользователь использует телефон или слабый компьютер.

SEO
Когда поисковая система заходит на сайт, сделанный с помощью Ajax-технологий или какого-нибудь современного фреймворка, похожего на React или Vue.js, то видит пустой HTML документ без какого-либо контента.
Если на сайте есть SSR, то страница будет выглядеть как обычный веб-документ со всеми нужными текстами и метаданными.

Есть готовые решения, которые помогают разработчику быстро внедрить SSR в проект, например, Next.js для React.

SQL | Синтаксис

В SQL Ключевые слова ( SELECT, FROM, WHERE и т.д.) нечувствительны к регистру. Традиция писать их Caps-ом началась из-за того что раньше в редакторах не было подсветки кода, сейчас таких уже не встретишь, так что этот подход сейчас только отвлекает внимание.

В статье вы найдете еще больше хороших практик для написания SQL кода.

Отправка E-mail в NodeJS

Для отправки E-mail в Node js приложениях используется npm модуль nodemailer.

Установка в проект:
npm install nodemailer --save

В первую очередь необходимо создать transporter, который хранит всю конфигурацию SMTP. Для создания transporter используется метод createTransport(), который принимает объект со следующими полями:

1. host - адрес почтового сервера;
2. port - порт почтового сервера;
3. secure - булевое значение, задается true, если используется SSL, в таком случае значением port должно быть 465;
4. auth - объект со свойствами user и pass, в которых указывается логин и пароль используемого почтового аккаунта соответственно.

Отправка осуществляется вызовом метода sendMail() у объекта transporter. Метод sendMail() принимает объект со структурой:

1. from - email адрес отправителя сообщения
2. to - адрес получателя
3. subject - тема сообщения;
4. text - текст сообщения;
5. html - текст сообщения в формате HTML;
6. attachments - прикрепленные к сообщению файлы.

Повышаем безопасность сайта

Если на клиенте и на сервере не происходит валидация введенных данных пользователем ( например в разделе комментарии, где будет каждый раз создаваться новая HTML разметка) то злоумышленник может внедрить вредоносный JavaScript код на эту страницу. Самые популярные XSS атаки - подмена страницы, либо получения COOKIE пользователей.

Так же, если нет проверки введенных данных, то можно получить доступ к БД через SQL injection
Если стоит простая проверка -
SELECT * FROM users WHERE login='$login' AND password = '$pass';
При вводе в поля логина и пароля '1' or '1' = '1' можно получить доступ к закрытым данным ( или если стоит платная регистрация ), так как это выражение вернет TRUE и пустит в систему.

Тестирование Web UI в NodeJS

Рассмотрим несколько инструментов для тестирования, доступных в NodeJS

Mocha - это Javanoscript-фреймворк для тестирования. Он имеет синтаксис в стиле BDD (Behavior-driven development) и позволяет выполнять тестирование на основе асинхронных вызовов. Он также поддерживает различные assert библиотеки, такие как Chai.

Chai - это библиотека утверждений (assertion library ) для NodeJS и браузера, которая прекрасно сочетается с любой средой тестирования Javanoscript.

CasperJS - это вспомогательная библиотека для построения сценариев навигации. Она часто используется с PhantomJS, но на самом деле он также поддерживает SlimerJS, который является еще одним "headless browser" с механизмом рендеринга Gecko.

PhantomJS - это headless browser с механизмом рендеринга WebKit. Позволяет запускать браузерные тесты в автономной системе

NodeJS модули

NodeJS приложение имеет модульную архитектуру построения, причем каждый файл JavaScript рассматривается как отдельный модуль, который может зависеть от других модулей.

Модули могут быть устанавливаемые (с использованием npm) и собственные, которые создаются в процессе разработки.

Модули NPM
По умолчанию все npm модули устанавливаются в директорию node-modules, создаваемую в директории, из которой была вызвана команда установки.
npm install express --save

Собственные модули
Собственным модулем является любой JavaScript файл приложения, который экспортирует с помощью объекта exports функции или переменные.

require()
Для подключения модулей используется функция require(). Если подключается npm модуль, то функции необходимо передать только его название.
const express = require('express');
Для подключения собственных модулей необходимо указать путь.
const myModule = require('./my-module');