Создание веб-сайта. курс молодого бойца

Алан-э-Дейл       22.10.2022 г.

Введение

Современные веб-приложения строятся на основе микросервисной архитектуры — стиля, который структурирует приложение как набор сервисов. Каждый такой сервис максимально автономен, необходим для выполнения конкретной задачи и поддерживается конкретной командой. Эта архитектура позволяет применять модульный принцип построения приложений с учётом потребностей бизнеса. Другими словами, вы всегда можете поменять один или несколько сервисов, таких как веб-сервер или сервер обработки запросов, в случае изменения потребностей без ущерба для бизнеса.

Другой разновидностью подхода к построению приложений является монолитная архитектура, дающая преимущество в виде минимальных проблем согласованности компонентов, но не обладающая такой гибкостью в построении, как микросервисная. Монолитная архитектура вполне имеет право на существование, но её достоинство является и её недостатком, и в современном мире она практически не встречается в веб-приложениях, т. к. не удовлетворяет требованиям Time To Market — требованиям бизнеса по выпуску новых продуктов на рынок.

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

Общие технологии создания сайта

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

Для понимания технологии создания сайта рассмотрим самый сложный вариант, создания сайта своими руками с нуля.

Технологические этапы в создании сайта с таким подходом, можно описать таким образом:

Этап 1. Структура и дизайн сайта. На этом этапе необходимо продумать навигационную структуру сайта и его будущий дизайн.

В зависимости от типа создаваемого сайта, структурной единицей сайта является либо статья, либо карточка товара. Статьи сайта объединяются в разделы. Сами разделы можно построить по подчинённой структуре типа родитель-дочка.

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

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

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

Этап 2. Программирование. Самый сложный этап технологии создания сайта, если вы делаете сайт с нуля своими силами.

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

Это самый сложный этап создания сайта с нуля. Для его осуществления, действительно, нужно изучить языки программирования HTML, PHP, JavaScript, Python, Perl, Angel Script. Наиболее востребованы первые три HTML, PHP и JavaScript. Обязательно потребуется знание языка табличных стилей CSS.

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

Наиболее просты в использовании, так называемые системы управления содержимым (CMS). Например, WordPress, Joomla, Drupal, 1-С Битрикс, OpenCart. Их достаточно легко освоить без особых знаний программирования.

Этап 3. Верстка сайта. Это этап сборки, всего запланированного.

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

Самостоятельное создание сайта, потребует серьёзных знаний по сборке отдельных частей сайта в единое целое.

Этап 4. База данных.

Создание сайта невозможно без базы данных. Поэтому в довесок к языкам программирования придется изучить работу с базами данных и структурированный язык запросов SQL.

Часто, изучению и работе с базой данных сайта не уделяют должного внимания. Причина в автоматизации её создания и управления при создании сайта на ведущих CMS. Однако, именно умение работать с базой данных «руками» с помощью SQL запросов, отличает профессиональный подход от дилетантства. Для профессиональных навыков нужен хороший курс по sql и базам данных. Эффективные SQL запросы помогут в решении многих нерешаемых проблем на сайте.

Этап 5. Наполнение сайта.

Этот этап мало относится к Интернет технологиям, но не менее важен, чем все предыдущие этапы. Готовый сайт, который вы делаете для себя, нужно наполнить материалами, фото и другой информацией. Но это уже другая история.

История вашего первого веб-сайта

Необходимо много работать, чтобы создать профессиональный веб-сайт, так что, если вы новичок в веб-разработке, мы рекомендуем начать с малого. Вы не будете создавать ещё один Facebook прямо сейчас, но создать свой простой веб-сайт не так уж и сложно, так что мы начнём с этого.

Прорабатывая статьи, перечисленные ниже по порядку, вы пройдёте путь от нуля до создания своей первой веб-страницы. Ну что, давайте начнём!

Установка базового программного обеспечения

Когда речь заходит об инструментах для создания веб-сайта, тут есть из чего выбрать. Если вы только начинаете, вас может смутить количество текстовых редакторов, фреймворков и инструментов тестирования. В главе Установка базового программного обеспечения мы покажем вам шаг за шагом, как установить только то программное обеспечение, которое вам понадобится для веб-разработки на начальном этапе.

Каким должен быть ваш веб-сайт?

Перед тем, как вы начнёте писать код для вашего веб-сайта, нужно составить план. Какую информацию вы демонстрируете? Какие шрифты и цвета вы используете? Каким должен быть ваш веб-сайт? Мы опишем простой метод, которому вы сможете следовать, чтобы спланировать содержание и дизайн вашего сайта.

Работа с файлами

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

Основы HTML

Язык гипертекстовой разметки (Hypertext Markup Language, HTML) — это код, который вы используете для структурирования веб-содержимого и придания ему смысла и цели. Например, является ли моё содержимое набором абзацев, либо списком маркированных пунктов? Нужно ли вставить изображения на мою страницу? Есть ли у меня таблица данных? Не перегружая вас, статья Основы HTML предоставляет достаточно информации для вашего знакомства с HTML.

Основы CSS

Каскадные таблицы стилей (Cascading Stylesheets, CSS) — это код, который вы используете для стилизации своего веб-сайта. Например, хотите ли вы, чтобы текст был черным или красным? Где должно быть нарисовано содержимое на экране? Какие фоновые изображения и цвета должны быть использованы, чтобы украсить ваш веб-сайт? Основы CSS проведёт вас через то, что вам нужно знать, чтобы начать.

Основы JavaScript

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

Публикация вашего веб-сайта

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

Как работает Интернет

Когда вы заходите на свой любимый веб-сайт, в фоновом режиме происходит много сложных вещей, о которых вы можете не знать. Статья Как работает Интернет описывает, что происходит, когда вы просматриваете веб-страницы на своём компьютере.

Устойчиво используемые технологии подключения интернета

Сегодня мы можем говорить про несколько используемых технологий подключения устройств к сети Интернет:

  • ADSL – доступ по аналоговому кабелю;
  • DOCSIS – подключение по коаксиальному кабелю;
  • FTTB – подключение по витой паре;
  • PON – оптоволокно;
  • Интернет мобильных устройств;
  • Интернет через спитник.

Например, в домах распространена технология домашнего интернета FTTP, а транспорте мобильный интернет.

ADSL

ADSL технология относится к проводной технологии подключения интернет. Суть технологии в разделении сигнала проходящего по электрическому телефонному (аналоговому) кабелю посредством сплиттера и модемного устройства.

Сплиттера выполняет роль разделителя. Модем адаптирует сигнал для последующего отправления сигнала по широкополосному соединению.

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

Однако, эта особенность асимметричной цифровой абонентской линия (ADSL) кроме плюсовой доступности и низкой цены, отдает два огромных минуса – низкая скорость и низкое качество.

Скорость такого соединения не превысит 15 Мбит/сек.

DOCSIS

С большой натяжкой DOCSIS технологию можно сравнить с ADSL по принципу прохождения сигнала, только используется не кабель телефонной связи, а используется коаксиальный кабель телевизионного сигнала.

Технология DOCSIS разрабатывалась для цифрового телевидения и прошла эволюцию от стандартов DOCSIS 1.0 до стандарта EuroDOCSIS, выжав из последнего скорость 70 мбит/сек.

Данный стандарт подходит для квартир многоквартирного дома, с небольшим количеством гаджетов. Однако для частного дома использование такой технологии обходится слишком дорого.

FTTB

FTTB (Fiber to the Building) частный случай технологии FTTX (Fiber to x). FTTX это архитектура широкополосной сети, в которой магистраль выполняется оптико-волоконным кабелем, а ответвление от магистрали до потребителя выполнится кабелем витая пара.

Например, офис Интернет провайдера прокладывает оптико-волоконный кабель от офиса до многоквартирных домов. Потом предлагает жителям подключение к Интернет их квартир. Подключение квартир делается кабелем витая пара.

В зависимости от длины локальной сети витой парой, обобщенный термин – FTTX технология, различается на технологии обозначаемые:

  • FTTN: оптоволокно до уличного шкафа, возможно, в нескольких километрах от помещения клиента. Конечные соединения выполняются медным кабелем витая пара.
  • FTTC: оптоволокно до шкафа расположенного вбили от помещения клиента.
  • FTTB: оптоволокно ведется до шкафа расположенного внутри помещения клиента. Подключение клиента выполняются медным кабелем витая пара.
  • FTTH: волокно достигает границы жилого пространства, например, коробки на внешней стене дома.
  • FTTD: упрощенно, волокно достигает комнаты, где установлены компьютеры. (волокно на стол).
  • FTTE / FTTZ технология НЕ относится к FTTX. Обозначает доведение оптики до компьютера.

PON

PON технология наиболее передовая технология передачи Интернет сигнала. В данной технологии сигнал адаптируется терминалом OTN, который ставится каждому конечному потребителю, например в квартиру.

Данная технология не имеет ограничений по скорости передачи данных, но разделена на классы:

  • APON/ BPON (Broadband PON) – 155 Мбит/с туда/обратно. Используется ATM (Asynchronous Transfer Mode) протокол;
  • EPON (Ethernet PON) 1000 Мбит/с. Используется Ethernet протокол (IP);
  • GPON (Gigabit PON) – скорость от 600 Мбит/с до 2,5 Гбит/c. Используется протоколы TDM, SDH, Ethernet, ATM.

Технология GPON недавно начала активно рекламироваться по телевизору и активно распространяется  в крупных городах России.

Бездонная библиотека

С 26 февраля 2008 года MySQL — собственность компании Sun Microsystems. MySQL относится к реляционным СУБД, характеризуется простотой структуры данных и удобным для пользователя табличным представлением. Реляционная модель в MySQL ориентирована на организацию данных в виде таблиц. Каждая таблица представляет собой двумерный массив и обладает следующими свойствами:

  • один элемент таблицы — один элемент данных;

  • все элементы в столбце имеют одинаковый тип данных;

  • каждому столбцу дано уникальное имя;

  • строки и столбцы следуют в произвольном порядке.

Популярность MySQL объясняется просто: эта СУБД ориентирована на большое количество платформ, а также обладает возможностью загрузки оптимизированных под конкретную операционную систему модулей и поддержкой транзакций на уровне отдельных записей. API (интерфейс программирования приложений) MySQL подходит для всех языков, описанных нами выше. То есть существуют библиотеки MySQL для языков Perl, РНР, Python, JAVA.

Средства разработки web-приложений

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

Что такое программирование вообще и в частности

Человек — не компьютер, но логика принятия решений человеком — это формула управления (это и есть программирование) компьютером. От того, насколько образован человек, зависит качество управления. Совсем не обязательно быть программистом, чтобы управлять компьютером, но управлять — свойство человеческой натуры.

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

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

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

Технологии DHTML, JavaScript и jQuery

JavaScript возник как язык программирования от компании Netscape в 90-е, с тех пор непрерывно развиваясь.
Стандарт, на котором он основан, ECMA-262 (ECMAScript), часто обновляется и дополняется.
Соответственно, используемый в современных браузерах движок JavaScript сейчас экспоненциально быстрее своих предшественников.

К слову сказать, ECMA-262 является спецификацией для языка ECMAScript, стандартизированный Международной организацией ECMA.
Сам ECMAScript — это встраиваемый расширяемый язык программирования, не имеющий средств ввода-вывода,
и используемый в качестве основы для построения других скриптовых языков.

Расширениями языка являются не только JavaScript и JScript, но и ActionScript, также широко используемый в вебе.

JavaScript — язык со слабой динамической неявной типизацией, автоматическим управлением памятью и прототипным наследованием.
Он состоит из трёх обособленных частей:

  1. ядро (ECMAScript),
  2. объектная модель браузера (Browser Object Model или BOM),
  3. объектная модель документа (Document Object Model или DOM).

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

Сам по себе, JavaScript не может делать больше, чем выполнять расчеты и обработку текста,
но в сочетании с обработчиком DOM (Data Object Model, описывающей тэговую структуру веб-страницы),
который имеется во всех браузерах, он позволяет осуществлять:

  1. добавление и удаление структурных (тэговых) элементов страницы;
  2. добавление, изменение и удаление текста на странице;
  3. изменение CSS стилей, применяемых к элементам страницы;
  4. реагирование на события, например, нажатие кнопки мыши
    ;
  5. проверка содержимого формы перед отправкой на веб-сервер ;
  6. получение информации о браузере, отображающим страницу (производитель, версия),
    и даже о среде, например, размере открытого окна и местном времени;
  7. выдача предупреждений пользователю.

Кроме того, сочетание JavaScript и XMLHttpRequest API (его обычно называют AJAX)
позволяет делать асинхронные запросы к веб-серверу для получения (изменённой) части информации о странице
без всей её перезагрузки в браузере.

Следует заметить, что JavaScript — это не Java. Схожесть имен — не более, чем уловка маркетологов.
Первоначально он был назван Mocha, а затем LiveScript.
Когда его создатель Брендан Эйч стал сотрудником Sun, компания решила переименовать его в JavaScript.
Но стандартное название для этого языка — ECMA-262, т.к. Sun не стала лицензировать имя JavaScript.
Реализация Microsoft называется JScript.

Сценарии на языке JScript (как и VBScript) чаще всего используются в следующих областях:

  1. Клиентские сценарии на Web-страницах.
  2. Автоматизация администрирования систем Windows.
  3. Серверный программный код на страницах ASP в Web-приложениях.

Язык JScript получил дальнейшее развитие в виде языка JScript.NET, который ориентирован на работу в рамках платформы Microsoft ASP.NET.

Статьи и сборники о JavaScript

Сетевые ресурсы о DHTML и JavaScript, а также о скрипт-стандарте ECMA.

  • JavaScript.ru Цель этого сайта — предоставить
    как можно более грамотную и структурированную информацию по языку javascript и смежным технологиям.

Клиентская, серверная и полная разработка стека

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

Если вы слышали о программистах переднего и заднего плана, «клиентская сторона» и «серверная сторона» — это схожая идея. Программисты переднего плана используют такие языки, как JavaScript, для создания того, что пользователь видит и с чем взаимодействует. Это то, что мы называем серверной частью.

Серверная часть — это вся фоновая разработка и фреймворк, который устанавливает обмен между клиентской и серверной сторонами. Такие вещи, как программирование ИИ, использование оборудования и разработка алгоритмов, — всё это часть серверного процесса.

С другой стороны, внутренние программисты используют инструменты для управления, создания и размещения внешнего контента. Люди, занимающиеся сёрфингом в Интернете, могут видеть пользовательский интерфейс, но не видят важных данных, которые поступают в их любимые веб-приложения. Все клиентские аспекты веб-разработки обеспечивают бесперебойную работу веб-сайтов на любом устройстве, которое использует клиент.

Итак, клиентская веб-разработка больше похожа на интерфейсный веб-дизайн. Он ориентирован на создание гладкого и привлекательного дизайна для взаимодействия с пользователем.

Programming Languages

As we explained before, since computers don’t use languages that are anything like human languages, they need a different way to communicate. Here are some of the most popular programming languages:

Javascript – used by all web browsers, Meteor, and lots of other frameworks

CoffeeScript – a “dialect” of JavaScript. It is viewed as simpler but it converts back into JavaScript

Python – used by the Django framework as well as in the majority of mathematical calculations

Ruby – used by the Ruby on Rails framework

PHP – used by WordPress to create those WYSIWYG editors that everyone is using now. It’s also used by Facebook, Wikipedia, and other major sites

Go – newer language, built for speed

Swift – Apple’s newest programming language

Java – used by Android and a lot of desktop applications.

So let’s talk about the most popular ones in a bit more detail.

JavaScript

According to , JavaScript is the most popular programming language with 62.5% of respondents claiming to use it.

It is one of the core web technologies and if you want to learn more about it, you can start with this essential training that covers all the basics, working with functions and objects, interacting with DOM, etc. This course is recent – from April 2019 – Javascript evolves quickly, so it makes sure you leverage the newest language “perks” as you learn.

Ruby

The developers love Ruby – and for all the right reasons. Designed to be user-friendly and really easy to use, it’s no wonder that this programming language is often called “a programmer’s best friend.”

What you can expect from Ruby is a shorter, readable code. Unfortunately, that sometimes means lower efficiency compared to other programming languages – but it also means higher productivity.

If you are a beginner in the web development world, Ruby would be a great choice for the first programming language to learn. A well-written Ruby code can be almost as readable as the sentence in plain English language.

But the real reason most people use Ruby is its popular framework — Ruby on Rails which we mentioned earlier in the text. The great productivity achieved with Rails makes it a common choice for startups who aim for a running start.

Elixir

Elixir appeared back in 2011 and gained popularity almost immediately. It was inspired by Erlang, a language developed back in the ‘80s by Ericsson. Elixir’s author José Valim himself said that he loved Erlang, but also noticed some things that could use a bit of improvement.

Scala

Scala stands for Scalable Language, and is one of the many attempts to “rewrite Java” and it is compiled to run on the Java Virtual Machine (JVM). It is safe to say this programming language turned out to be quite a success taking into consideration that companies like LinkedIn, Twitter, and The Guardian use it in their codebases. Scala is known to be a complex language but also a language worth learning.

This essential 3-hour training may be a good way to start your journey with Scala.

Технологии, которые потеряли былую привлекательность

Adobe Photoshop и Illustrator. Это — два замечательных приложения, которые многие годы удовлетворяли все мои потребности в работе с графикой. Я с грустью говорю им «прощайте» и благодарю их за то, что они были со мной. Теперь всё, что мне нужно, дают их бесплатные опенсорсные заменители.

jQuery. Эта библиотека стала ненужной тогда, когда закончились войны кросс-браузерной совместимости. Единственной ценнейшей для меня возможностью jQuery был синтаксис селекторов. Он оказался настолько востребованным, что в 2009 году был добавлен в DOM в виде .

AJAX. Этот прародитель Web 2.0. теперь превратился в пережиток прошлого. API заменяется современным и более простым API , а JSON приходит на замену XML.

SASS/SCSS. Я признаю то, что написание CSS-кода без переменных было неэффективным, в результате SASS многим пришёлся по душе

И модули тоже были весьма важной возможностью. Но в итоге для того, чтобы всё это использовать в JavaScript, нужно было потратить слишком много времени и сил

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

БЭМ. Схема именования сущностей БЭМ (Блок, Элемент, Модификатор), используемая при формировании имён CSS-классов, решает проблему глобального пространства имён. Но за это приходится платить использованием очень длинных конструкций. Я перешёл к родительским/дочерним селекторам в семантических элементах, предпочтя более лёгкий подход идентификаторам и именам классов.
Например:

Шрифты Georgia и Verdana. Эти два шрифта многие годы занимали верхнюю позицию моего рейтинга шрифтов. Я мог положиться на их доступность и на их читабельность. Но после того, как появилось правило , и после того, как начали распространяться опенсорсные шрифты, я стал пользоваться подобными шрифтами.

Babel, Grunt, Gulp, Browserify, WebPack. Первые четыре пункта в этом списке вряд ли кого удивят. Но почему мой стек веб-технологий покинул Webpack? У того, что этот бандлер потерял для меня актуальность, есть некоторые причины, на которых я остановлюсь подробнее:До появления HTTP/2 с поддержкой постоянных соединений и мультиплексирования потоков мы находились в зависимости от возможностей этих инструментов по сборке бандлов ресурсов приложений. Но бандлинг ничего нам не даёт в мире, где есть HTTP/2.
Стандарт ECMAScript 2015 был новым словом в JavaScript-разработке, все бросились использовать новые возможности языка в тот самый момент, когда они увидели свет. Однако тут была одна проблема. Код, написанный с использованием новых возможностей, не поддерживался браузерами. Поэтому его приходилось транспилировать в ECMAScript 5-код. В этом деле мы полагались на Babel, его применение стало стандартным шагом подготовки веб-проектов к публикации. Сегодня же все необходимые мне новые возможности языка доступны буквально повсюду. В результате Babel мне больше не нужен.
До появления в браузерах возможности динамического импорта модулей код приходилось транспилировать в формат CommonJS. Теперь же большинство основных браузеров поддерживает (да и Edge 76+ скоро подтянется). В результате скоро мы сможем поздороваться с ECMAScript-модулями и попрощаться со всем остальным.

JSX. Я не понимаю тех, кто полагает, что JSX — это хорошо. И «Но вы же к этому привыкли» для меня — не аргумент.

Функциональное программирование. Я ограничил применение функционального программирования в своём коде до простых однострочных конструкций вроде . Для всего остального я использую объектно-ориентированное программирование.

CDN

CDN расшифровывается как «Content Delivery System» (система доставки контента). Эта технология позволяет намного быстрее, чем с исходного сервера, отправлять статические HTML-, CSS-, JavaScript-файлы и изображения. Она распространяет контент из многих «конечных» серверов по всему миру, чтобы пользователи загружали различные ресурсы из них вместо исходного сервера. Например, на изображении ниже пользователь из Испании запрашивает веб-страницу с сайта, серверы которого находятся в Нью-Йорке, но статические ресурсы для этой страницы загружаются с «конечного» сервера CDN в Англии, предотвращая медленные кросс-атлантические HTTP-запросы.

Для более полного понимания принципов работы современного веба вы можете также ознакомиться с другими нашими материалами:

  • Веб-фреймворки: введение для новичков
  • Как защитить веб-приложение: основные советы, инструменты, полезные ссылки
  • Хочу стать frontend разработчиком: базовые знания и план обучения
  • 23 совета по созданию качественного веб-продукта

Удачи в покорении веба!

Перевод статьи «Web Architecture 101»

Quality Assurance

Можно сказать, что QA-специалисты нам не нужны. Многие так делают, это иногда работает. Но не все разработчики любят писать тесты. Их можно понять. И стоит их лучше мотивировать, чтобы тесты все-таки писали, но реальность жестока: unit-тесты ловят далеко не все баги. А если какой-то разработчик не любит писать тесты и все-таки начал их писать, то скорее всего это будут unit-тесты.

Плюс еще есть подходы, когда ты минимизируешь mean time between failures вместо mean time to recover. Mean time between failures — это когда QA специалист говорит: «не будем релизить, у меня чутье плохое, баги будут, давайте через две недели выкатим». А mean time to recover — это когда вы катите что-нибудь, сразу видите на метриках, что что-то сломалось, и через две минуты все откатили, пофиксили и все ок. Но чтобы можно было проект через две минуты откатить, надо всё покрыть нормальными метриками, а это не всегда тривиально. А если метрики в плачевном состоянии, и мы выкатим плохой релиз, мы можем узнать об этом после того, как все пользователи уйдут от нас к конкурентам.

Другой вариант: всё-таки сделать отдел QA. Вы помните: отдел — это не очень хорошо, это сепаратизм, это нам не подходит. Сепаратизм можно разрулить с помощью кроссфункциональных команд. Да, они решают проблему того, что у нас админ сидит отдельно, тестировщики отдельно.

Но создают другие проблемы. Так как разработчики, тестировщики и все прочие члены кроссфункциональных команд начинают больше общаться внутри своих команд и решать предыдущие проблемы, они меньше общаются с их коллегами по функции: другими бэкендерами и тестировщиками, они начинают переизобретать велосипеды, делать параллельно одни и те же вещи, наступает изоляция между командами. Шило на мыло: был один сепаратизм, стал другой.

Как это разрулить? Общаться с коллегами в кружках по интересам. Где-то это называют гильдиями, где-то — коммьюнити. Если мы масштабируем команду кроссфункциональными командами, чтобы они не замыкались в себе, мы просто организуем кружок любителей бэкенда, функциональных языков, секьюрити…

Итоги

На самом деле, не всё так плохо. Из любой ситуации можно найти выход, найти решение. Может быть, не идеальное, но наиболее подходящее в данной ситуации с минимумом проблем. Всегда возможен компромисс.

Worldwide Web Consortium[edit | edit source]

Worldwide Web Consortium (W3C) is an international community of web members to meet the Web standards. It was founded by Tim Berners-Lee, an inventor of the Web, back in the 20th century. W3C is designed to reach a full potential of the Web and to make it accessible to all users from all over the world. Also, another aim for W3C was to make standards to maintain the growth of the Web in a single direction rather than splitting into competing groups. Here are some of the standards for W3C:

⋅Accessibility

⋅Web Authoring

⋅Web Performance

⋅Cascading Style Sheets

⋅HTML5

⋅Web Fonts

⋅Widgets

⋅Media Access

⋅Mobile Web Applications

⋅Internationalization of Web Design and Applications

⋅Mobile Web Authoring

⋅XML

⋅Graphics

⋅RDF

⋅HTTP

Интернет технологии безопасности

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

Последними тенденциями развития Интернет технологий, стало сделать доступным Интернет и его технологий, доступными для совершенных «чайников», не имеющих представление и желания изучать, что куда подключается и какую и где программу нужно установить.

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

Однако если Интернет и сети становятся более доступными, то Internet технологии это сложнейшие системы объединяющие, как физические, так и логические компоненты.

Гость форума
От: admin

Эта тема закрыта для публикации ответов.