PHP | PDO

Для взаимодействия с базами данных обычно необходимо ставить специальную библиотеку, созданную для конкректной базы данных. Это может вызывать некоторые трудности, если, например, на сервере несколько разных СУБД. Но с PDO всё гараздо проще.
PDO (PHP Data Objects) — расширение PHP, которое реализует взаимодействие с базами данных при помощи объектов. В PDO отсутствует привязка к конкретной системе управления базами данных. Оно поддерживает, как MySQL, так и PostgreSQL, SQLite, Oracle, Microsoft SQL Server и другие.
Ещё одним плюсом будет встроенная защита от SQL инъекций.

Пример

// Подключение к базе данных
$db = new PDO('mysql:host=localhost;dbname=pdo', 'root', 'password');
// Выполнение подготовленного запроса, такой запрос защищён от инъекции
$stmt = $pdo->prepare("SELECT `name` FROM categories WHERE `id` > ?");
$stmt->execute([$id]);
// Получение данных
$data = $stmt->fetchAll(PDO::FETCH_ASSOC);
foreach ($data as $k => $v){
  echo 'Category name: '.$v['name'].';';
}

Как изучить React и построить международную карьеру?

🔥Максим Иванов, разработчик Minecraft и Battlefield, запускает авторский курс по React.

Курс стартует 1 ноября, но уже можно начать учиться бесплатно не выходя из Телеграма:
⭐️Как сделать клон Minecraft на React (делаем 3d-игру на компонентах)
⭐️Как делать формы любой сложности на React и react-hook-form
⭐️Как освоить реакт быстро, не тратя время на булщит? 💩
⭐️Как попасть в интересный проект? Самая короткая дорога от hello world до удаленки за баксы 🔥
⭐️Как справиться с застреванием в процессе обучения и в карьере
💥Инсайт: Как всех обогнать. Прокачиваем карьеру. Как в этом помогает блог и привычка описывать свои шаги.📝

Чтобы получить доступ материалам, переходи в наш Телеграм-бот. Он заботливо выдаст все видео.

HTML | DATA

data-* атрибуты позволяют хранить дополнительную информацию в стандартных элементах HTML

<article
  id="post1"
  data-columns="3"
  data-index-number="12314">
</article>

Доступ из CSS

article[data-columns='3']{
  width: 400px;
}

Доступ из JS
var article = document.getElementById('post1');
article.dataset.columns // "3"
article.dataset.indexNumber // "12314"

Node.js | EasyVK

EasyVK - npm пакет, предназначенный для работы с API ВКонтакте на стороне сервера.

Преимущества
- Обращения к методам API ВКонтакте
- Создание ботов с помощью LongPoll API
- HTTP клиент для просмотра историй
- Поддержка обещаний

CSS | Селекторы

Универсальный селектор - * {}
Селекторы типов - div {}
Селекторы классов - .classname {}
Селекторы идентификаторов - #idname {}
Селекторы потомков - span em {}
Селекторы дочерних элементов - div > em {}
Селекторы смежных элементов - i + b {}
Селекторы атрибутов - a[href='info.htm'] {}
Псевдоклассы - a:hover {}
Псевдоэлементы - p::first-letter {}

😣 На рынке жёсткий дефицит фронтендеров

Хочешь быстро влиться во фронтенд и через пару лет хвастаться ЗП > 200к?

Вот план для старта:

1. Веб-верстка - 3 месяца
2. JavaScript - 3 месяца
3. Система контроля версий GIT - 1 месяц
4. Онлайн-сессии по вебразработке - 1 месяц
5. Vue.js - 2 месяца
6. React.js - 2 месяца
7. Защита дипломного проекта
8. 💰Трудоустройство💰

Это программа курса Профессия Frontend разработчик от Skillbox.

Да - трудоустройство они тоже берут на себя.

Тут можно получить курс со скидкой 50% 👇

Node.js | Telegraf

Telegraf - очень простой и удобный фреймворк для телеграм ботов.

Преимущества
- Полная поддержка Telegram Bot API 4.8
- Поддержка платежной платформы Telegram
- Поддержка HTML5 игр
- Инлайн мод
- Совместим с веб-хуками (http, https, fastify, express.js)

Пример

var { Telegraf } = require('telegraf')
var bot = new Telegraf(process.env.BOT_TOKEN)
bot.start((ctx) => ctx.reply('Добро пожаловать!'))
bot.help((ctx) => ctx.reply('Отправь мне стикер'))
bot.on('sticker', (ctx) => ctx.reply('👍'))
bot.hears('Привет', (ctx) => ctx.reply('Приве-е-ет!'))
bot.launch()

CSS | CLIP PATH

Clip-path - указывает, какая часть изображения будет видна.
Есть 2 варианта как получить изображение определенной формы:
- вырезать в редакторе
- наложить фигуру через CSS свойство clip-path

На ресурсе по ссылке ниже вы можете быстро получить нужную форму с готовым CSS кодом.

В телеге наконец-то появился канал, где собирают вопросы на логику с технических собеседований. 90% что при собеседовании в Яндекс или Гугл что-то из этого у вас спросят.

Подписывайся на АйТи собес и прокачивай свой скилл собеседований.

Node.js | socket.io

socket.io - библиотека для веб-приложений и обмена данными в реальном времени. Состоит из двух частей: клиентской, которая запускается в браузере и серверной для node.js. Оба компонента имеют похожее API. Подобно node.js, Socket.IO событийно-ориентированная. В своей основе использует протокол WebSocket. Можно использовать для создания чатов и мультиплеерных игр.

Простейший пример

var io = require('socket.io')(80);
var cfg = require('./config.json');
var tw = require('node-tweet-stream')(cfg);
tw.track('socket.io');
tw.track('javanoscript');
tw.on('tweet', function(tweet){
  io.emit('tweet', tweet);
});

HTML | Семантика

В HTML4 веб-разработчики использовали свои собственные имена в идентификаторах/классах элементов для их стилизации: header, top, bottom, footer, menu, и т.п. Поисковые системы не могли корректно идентифицировать роль того или иного контента веб-страницы.

В HTML5 появились семантические элементы:

<article> - Определяет статью
<aside> - Определяет блок сбоку от основного контента
<details> - Определяет дополнительную информацию, которую пользователь может открывать или закрывать
<figcaption> - Определяет пояснение для элемента <figure>
<figure> - Используется для группирования различных самодостаточных элементов - иллюстраций, диаграмм, фотографий, листингов кода и т.д.
<footer> - Определяет "подвал" документа или раздела
<header>- Определяет "шапку" документа или раздела
<main> - Определяет основной контент документа

PHP | Вывод значения переменной

Обычно для вывода переменных во время дебага пользуются функциями echo, var_dump или print_r.
У каждой из этих функций есть как свои плюсы, так и свои минусы. Например, echo не сможет вывести содержимое массива, а вывод var_dump или print_r может оказаться громоздким.

Довольно большое количество времени я пользуюсь самописной функцией на основе json_encode:

function vi ($o) {
  echo(''.json_encode($o, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE).'');
}