Как стать автором
Обновить
3
0
webspilka @webspilka

Пользователь

Отправить сообщение

Bash скрипты

Уровень сложности Простой
Время на прочтение 13 мин
Количество просмотров 88K

Работа с командной строкой Linux & Shell скрипты для начинающих.

В Linux автоматизация процессов в значительной степени решается исполняемыми скриптами в shell оболочке. Это подразумевает под собой создание файла, содержащего ряд команд, которые исполняются последовательно.

В этой статье мы обсудим основы написания сценариев bash, включая переменные, команды, ввод/вывод и отладку. Каждый пункт сопроводим примерами.

Начнем.

Читать далее
Всего голосов 20: ↑13 и ↓7 +6
Комментарии 81

Перенос сайта(ов) без простоя и потери данных между выделенными серверами

Время на прочтение 4 мин
Количество просмотров 38K
Казалось бы, что сложного перенести сайт на другой сервер? Наверно многие из нас копировали свои первые хоумпейджи с хостинга на хостинг в поисках лучшего, еще учась в школе или на первых курсах университета. Или вешая на уши лапши руководству, объясняли, что задача эта не решается мгновенно и сайт сутки работать не будет, ибо DNS такая штука…

Если в целом, ерундовая задача, правда? Но как сделать все идеально? Так, чтобы без простоев, чтобы не было расхождений в БД, чтобы не потерялись какие-нибудь файлики-аватарки-картинки, когда обновляется DNS запись IN A и у половины пользователей старый сайт, а у половины новый. А если это highload? Или сайт делало несколько поколений «лучших» программистов, считающих своим долгом создать новое подключение к БД в своем «модуле» для сайта. Наконец, если таких сайтов >10?

  • Скопировать файлы
  • Сделать дамб баз данных
  • Развернуть на новом сервере
  • На старом сервере заменить все коннекты к бд к новому
  • Настроить DNS
  • ...

Сколько это займет времени? Сколько драгоценных минут сайт не будет работать\не будет работать правильно?
Читать дальше →
Всего голосов 33: ↑19 и ↓14 +5
Комментарии 64

SEO для разработчика и верстальщика: основные SEO-требования к разработке сайтов

Уровень сложности Простой
Время на прочтение 8 мин
Количество просмотров 6.7K

Подготовил подробную инструкцию, как сделать SEO-friendly сайт и учесть все основные SEO-требования на этапе разработки сайта.

Это статья очень важна, так как соблюдение SEO-требований на этапе создания нового сайта позволяет сэкономить много денег и времени на внесении дополнительных правок.

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

Посмотреть Чек-лист
Всего голосов 9: ↑4 и ↓5 -1
Комментарии 8

CSS-функции min(), max() и clamp()

Время на прочтение 12 мин
Количество просмотров 60K
Поддержка CSS-функций сравнения min(), max() и clamp() появилась в Firefox 8 апреля 2020 года. Это означает, что данные функции теперь поддерживаются во всех основных браузерах. Эти CSS-функции расширяют наши возможности по созданию динамических макетов и по проектированию более гибких, чем раньше, компонентов. Их можно использовать для настройки размеров элементов-контейнеров, шрифтов, отступов и многого другого. Правда, веб-дизайнеру, создающему макеты страниц с учётом возможности использования этих восхитительных функций, может понадобиться научиться думать по-новому.



Сегодня я хочу рассказать об особенностях этих функций, объяснить всё то, что может оказаться в них непонятным, и привести практические примеры их использования.
Читать дальше →
Всего голосов 37: ↑36 и ↓1 +35
Комментарии 11

Улучшение Visual Studio Code для новичков

Время на прочтение 5 мин
Количество просмотров 45K

VSCode — самый популярный редактор кода среди веб-разработчиков. Вы можете использовать его с нуля, однако со временем его базовых функций станет недостаточно. Рассказываю, как сам докрутил этот редактор под свои потребности.

Читать далее
Всего голосов 25: ↑18 и ↓7 +11
Комментарии 29

7 многообещающих расширений VS Code 2021 года

Время на прочтение 4 мин
Количество просмотров 15K

К старту курса по Fullstack-разработке на Python делимся подборкой расширений Visual Studio Code, среди которых вы найдёте генератор документации для кода JavaScript на базе ИИ и лёгкий, простой клиент REST API. За подробностями приглашаем под кат.

Читать далее
Всего голосов 22: ↑18 и ↓4 +14
Комментарии 5

Как мы уменьшаем размер изображений на веб-страницах в 10 раз с помощью нашего оптимизатора

Время на прочтение 8 мин
Количество просмотров 19K

Привет, Хабр! Меня зовут Евгений Лабутин, я из команды разработки продукта МТС Твой бизнес. Мы разработали свой рецепт приготовления картинок для нашего портала. Благодаря ему удалось сократить их вес на странице до 10 раз относительно уже оптимизированного jpg/png, сохранив при этом простоту разработки – как будто это стандартный img элемент. Разработанный микросервис называется ImageOptimize, из этой статьи вы узнаете, как он работает и что у него под капотом. Мы уже выложили код микросервиса в OpenSource (чему очень рады), поэтому вы тоже можете использовать такую компрессию, настроив ее в несколько простых шагов.

Читать далее
Всего голосов 37: ↑35 и ↓2 +33
Комментарии 28

Безопасный CSS, или как писать универсальные стили

Время на прочтение 11 мин
Количество просмотров 32K

При написании стилей необходимо сразу учитывать, что контент страницы может быть динамическим, чтобы не возникла ситуация, где мы добавили чуть больше текста, или уменьшили ширину экрана, и вёрстка поплыла. Статья состоит из примеров универсальных CSS-стилей для часто встречающихся ситуаций. Рекомендуется к прочтению верстальщиком начального и среднего уровня.

Читать статью
Всего голосов 30: ↑28 и ↓2 +26
Комментарии 12

Fast Reverse Proxy как альтернатива Ngrok

Время на прочтение 5 мин
Количество просмотров 11K

Создание общедоступного URL в сети интернет к вашему локальному проекту

Что такое Ngrok, наверное знает каждый разработчик web приложений, и многие им пользуются.

Немного предыстории...

Присоединившись к новому большому проекту, над которым работают десятки разработчиков и QA специалистов, я столкнулся с тем, что разработка ведется удаленно на специально выделенных серверах.

А т.к. я уже несколько лет разработку приложений веду исключительно в докере, я никак не мог адаптироваться к текущему подходу.

Думаю все, кто более менее освоил работу в докере, уже не мыслят как можно разрабатывать без него. Причин на это много. Конечно, как и везде у докера есть своя цена и это тоже уже много раз обсуждалось.

Итак, новый проект не похож на предыдущие. Он имеет много зависимостей с другими сервисами, как внутренними так и внешними.

Большое количество внешних интерграций порождало проблему связи локального приложения с внешним миром. И если объединить внутренние сервисы используя docker netwokr не вызывало каких либо проблем, то необходимость связать внешний сервис уже требовал дополнительных инструментов.

Интеграции платежных систем всегда подразумевает, что будут callback (notification).

При такой необходимости, часто выбирают Ngrok. Хорошее решение, но в удобном варианте - платное. Особенно это ощущается, когда разработчиков много.

Т.к. Ngrok не подходил, первое что пришло в голову, создать виртуалку, на нее завести домен, и создавать ssh туннель с ним.

Читать далее
Всего голосов 8: ↑8 и ↓0 +8
Комментарии 28

Карманная книга по TypeScript. Часть 2. Типы на каждый день

Время на прочтение 11 мин
Количество просмотров 34K

image


Мы продолжаем серию публикаций адаптированного и дополненного перевода "Карманной книги по TypeScript".

Другие части:



Обратите внимание: для большого удобства в изучении книга была оформлена в виде прогрессивного веб-приложения.


Примитивы: string, number и boolean


В JS часто используется 3 примитива: string, number и boolean. Каждый из них имеет соответствующий тип в TS:


  • string представляет строковые значения, например, 'Hello World'
  • number предназначен для чисел, например, 42. JS не различает целые числа и числа с плавающей точкой (или запятой), поэтому не существует таких типов, как int или float — только number
  • boolean — предназначен для двух значений: true и false

Обратите внимание: типы String, Number и Boolean (начинающиеся с большой буквы) являются легальными и ссылаются на специальные встроенные типы, которые, однако, редко используются в коде. Для типов всегда следует использовать string, number или boolean.

Читать дальше →
Всего голосов 35: ↑30 и ↓5 +25
Комментарии 1

Полное визуальное руководство-шпаргалка по Flexbox и Grid + туториал

Время на прочтение 31 мин
Количество просмотров 144K


Доброго времени суток, друзья!

Представляю вашему вниманию полное визуальное руководство-шпаргалку по всем свойствам CSS-модулей Flexbox и Grid.

Основные источники: A Complete Guide to Flexbox, A Complete Guide to Grid.

В конце статьи вас ждет небольшой туториал по созданию тренажера по Flexbox.

Без дальнейших предисловий.


Всего голосов 14: ↑10 и ↓4 +6
Комментарии 7

Готовим console.log() правильно

Время на прочтение 7 мин
Количество просмотров 17K
Специально к старту нового потока курса «Frontend-разработчик» делимся с вами полезным переводом. Автор рассказывает, как использует методы логирования в производственной среде собственного проекта и в чём именно они помогают. Кроме того, нас знакомят с платформой AppSignal, созданной, чтобы напрямую уведомлять разработчика о возникающих у пользователя исключениях в приложении. Подробности под катом.

Приятного чтения!
Всего голосов 29: ↑24 и ↓5 +19
Комментарии 6

Использование Nginx FastCGI Cache

Время на прочтение 9 мин
Количество просмотров 25K

FastCGI Cache — это система кэширования данных реализованая на уровне HTTP-сервера Nginx.

Преимущество FastCGI Cache заключается в том, что Nginx вернёт закешированный ответ пользователю сразу, как только получит запрос, при этом слой приложения не будет вовсе обрабатывать поступивший HTTP-запрос, если он имеется в кэше Nginx. 

Использование FastCGI Cache — отличный способ снизить нагрузку на вашу систему.

Если на вашем сайте есть страницы, которые изменяются редко или задержка обновления информации на некоторое время не критична, то FastCGI Cache именно то, что нужно.

Читать далее
Всего голосов 13: ↑12 и ↓1 +11
Комментарии 16

Среда разработки PHP на базе Docker

Время на прочтение 12 мин
Количество просмотров 55K

Решение на базе Docker, которое позволит создать на локальном компьютере универсальную среду разработки на PHP за 30 - 40 минут. Несколько версий PHP — 7.3 и 7.1 с набором наиболее востребованных расширений. Готовый к работе монитор процессов Supervisor. Предварительно сконфигурированный веб-сервер Nginx. Базы данных: MySQL 5.7MySQL 8PostgreSQLMongoDB 4.2Redis. Настройка основных параметров окружения через файл .env. Возможность модификации сервисов через docker-compose.yml.

Читать далее
Всего голосов 23: ↑21 и ↓2 +19
Комментарии 38

Некоторые аспекты управления VDS-сервером под Linux

Время на прочтение 9 мин
Количество просмотров 13K
VDS (Virtual Dedicated Server) — услуга, в рамках которой пользователь получает виртуальный выделенный сервер с максимальными привилегиями. Это эмуляция реального физического сервера, у него есть рутовый доступ, возможность установки произвольных операционных систем и любого софта. При этом он обходится значительно дешевле аренды сопоставимого по мощности физического сервера.

На сервер можно поставить ОС со своего образа или воспользоваться готовым образом в панели управления.



Предположим, мы поставили Debian 10 и веб-сервер Nginx, который идёт в стандартном репозитории (apt install nginx). Давайте посмотрим, какие полезные утилиты и команды помогут в управлении сервером под Linux. Рассмотрим и отдельно Nginx, и сам VDS-сервер в целом.
Читать дальше →
Всего голосов 42: ↑39 и ↓3 +36
Комментарии 9

JavaScript: область видимости простыми словами

Время на прочтение 6 мин
Количество просмотров 99K
Доброго времени суток, друзья!

Область видимости — важная концепция, определяющая доступность переменных. Данная концепция лежит в основе замыканий, разделяя переменные на глобальные и локальные.

В этой статье я постараюсь простыми словами объяснить, что такое область видимости в JavaScript.
Читать дальше →
Всего голосов 8: ↑8 и ↓0 +8
Комментарии 5

4 года игры в танчики

Время на прочтение 9 мин
Количество просмотров 47K

Доброго времени суток, дорогой читатель!

Сегодня я хочу поведать тебе забавную, ещё не закончившуюся историю странных совпадений, побед и поражений, радости и смуты. Если интересно как создавался, возможно, один из самых маленьких в мире "умных" (а не просто р/у) танков как на КДПВ, а так же при чём тут IoT, PHP и Angular - прошу под кат!

Узнать всё об этом
Всего голосов 175: ↑173 и ↓2 +171
Комментарии 76

Дэн Абрамов о замыканиях в JavaScript

Время на прочтение 7 мин
Количество просмотров 22K
Замыкания вызывают у программистов сложности из-за того, что это — «невидимая» конструкция.

Когда вы используете объект, переменную или функцию, вы делаете это намеренно. Вы думаете: «Тут мне понадобится переменная» — и добавляете её в свой код.



А вот замыкания — это уже нечто иное. В то время как большинство программистов начинает осваивать замыкания, эти люди уже, сами о том не зная, пользуются замыканиями. Вероятно, с вами происходит то же самое. Поэтому изучение замыканий — это не столько освоение новой идеи, сколько изучение того, как распознать то, с чем вы уже много раз сталкивались.

Если в двух словах, то замыкание — это когда функция обращается к переменным, объявленным за её пределами. Например, замыкание содержится в этом фрагменте кода:

let users = ['Alice', 'Dan', 'Jessica'];
let query = 'A';
let user = users.filter(user => user.startsWith(query));

Обратите внимание на то, что user => user.startsWith(query) — это функция. Она использует переменную query. А эта переменная объявлена за пределами функции. Это и есть замыкание.

Вы, если хотите, можете дальше не читать. Оставшаяся часть этого материала рассматривает замыкания в другом свете. Вместо того чтобы говорить о том, что такое замыкания, эта часть статьи посвятит вас в подробности методики обнаружения замыканий. Это похоже на то, как, в 1960-х, работали первые программисты.
Читать дальше →
Всего голосов 41: ↑33 и ↓8 +25
Комментарии 63

Политика общего происхождения и CORS: визуальное руководство

Время на прочтение 5 мин
Количество просмотров 16K


Доброго времени суток, друзья!

Представляю вашему вниманию перевод статьи «CS Visualized: CORS» автора Lydia Hallie.

Каждому разработчику приходилось сталкиваться с ошибкой Access to fetched has been blocked by CORS policy. Существует несколько способов быстрого решения данной проблемы. Однако, давайте не будем спешить и подробно рассмотрим, что из себя представляет политика CORS.

У нас часто возникает необходимость отобразить данные, находящиеся в другом месте. Прежде чем мы сможем это сделать, браузер должен отправить запрос на сервер, чтобы получить эти данные.
Читать дальше →
Всего голосов 8: ↑7 и ↓1 +6
Комментарии 4

Как разобрать URL в JavaScript?

Время на прочтение 4 мин
Количество просмотров 47K


Доброго времени суток, друзья!

Представляю Вашему вниманию перевод заметки «How to Parse URL in JavaScript: hostname, pathname, query, hash» автора Dmitri Pavlutin.

Унифицированный указатель ресурса или, сокращенно, URL — это ссылка на веб-ресурс (веб-страницу, изображение, файл). URL определяет местонахождения ресурса и способ его получения — протокол (http, ftp, mailto).

Например, вот URL данной статьи:

https://dmitripavlutin.com/parse-url-javascript

Часто возникает необходимость получить определенные элементы URL. Это может быть название хоста (hostname, dmitripavlutin.com) или путь (pathname, /parse-url-javascript).

Удобным способом получить отдельные компоненты URL является конструктор URL().

В этой статье мы поговорим о структуре и основных компонентах URL.
Читать дальше →
Всего голосов 22: ↑13 и ↓9 +4
Комментарии 11

Информация

В рейтинге
Не участвует
Откуда
Киевская обл., Украина
Дата рождения
Зарегистрирован
Активность