Если вы новичок в разработке 2018 года, возможно, вы слышали об этом языке под названием JavaScript. Это всего лишь вездесущий язык, без которого WorldWideWeb буквально не может выжить. Сегодня он позволяет создавать веб-приложения, мобильные приложения и даже настольные приложения.

Здорово! Итак, вы проданы и не можете дождаться, чтобы начать его изучать. Вы начинаете гуглить «руководства по разработке Javascript» и за несколько щелчков мышью ошеломлены; теряется в этой сети причудливых аббревиатур и логотипов.

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

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

Я играю в JS-игру уже много лет, и позвольте мне сказать вам, каким бы сложным он ни казался, стоит изучить все это.

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

Много имен, одна душа

У JavaScript исторически было много имен - Mocha, Livescript, JScript и т. Д. Не все имена стоит сейчас вспоминать. Однако некоторые из этих имен продолжают появляться сегодня повсюду, и нам нужно с ними бороться.

ECMAScript: это спецификация, стандартизирующая JavaScript. Технически Javascript - это диалект ECMAScript. TC39 - это комитет, который поддерживает спецификации ECMAScript.

ES5 / 6 / X, ES2015 / 16 / X: это различные версии спецификаций ECMAScript. Мол, ES5 - это просто пятое издание и так далее, и тому подобное. Каждая новая редакция добавляет новые функции к языку. В 2015 году TC39 стали чрезмерно амбициозными и объявили, что теперь они собираются выпускать новые функции каждый год. Поэтому они начали называть ES6 как ES2015, ES7 как ES2016 … вот и выкройка! Следующая предстоящая спецификация просто упоминается как ESNext.

Машинопись. Это относится к другому языку, разработанному Microsoft. Это супернабор JavaScript , который добавляет несколько функций, например дополнительную статическую типизацию.

Node.js: это не библиотека JavaScript и не другой язык. Это среда выполнения JavaScript. Представьте его как контейнер, который позволяет запускать код JavaScript. Долгое время код JavaScript запускался только в браузерах. Node.js перенес кодирование JavaScript на серверную часть - с доступом ко всем интересным вещам, таким как файловая система, сеть, сокеты и т. д. Внизу он частично написан на JavaScript. и частично на C ++

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

«Java для Javascript - это то же самое, что автомобиль для ковра» - Крис Хейлманн.

Совместное использование кода и объединение в JavaScript

Хорошие программисты пишут код, отличные программисты делятся кодом

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

Если кто-то уже решил проблему, вы не решите ту же проблему.

Вы повторно используете их решение для решения других проблем!

В мире JavaScript мы делимся этими решениями в виде библиотек, фреймворков, пакетов и т. Д.

Библиотека: это многократно используемый фрагмент кода, обычно решающий конкретную общую проблему. Таких библиотек огромное количество. Следует упомянуть jQuery, Express.js, Lodash, Moment.js и т. Д.

Фреймворк: иногда мы берем кучу библиотек, склеиваем их вместе с нашим собственным кодом и заставляем работать комплексно для решения более крупной, но все же общей проблемы. Такие общие решения называются Framework. Некоторыми хорошо известными сегодня frameworks являются AngularJS, Vue, React + Redux и Electron.

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

Люди использовали различные подходы, такие как размещение на файловых серверах, обычных веб-сайтах, CDN и т. Д. Круто. Но что происходит, когда они модифицируют библиотеку? Может быть, исправлены некоторые уязвимости; Добавлены еще несколько интересных функций

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

Пакет: пакет - это файл или каталог файлов, которые описываются package.json файлом. Он включает в себя всю информацию метаданных о самом пакете.

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

NPM - CLI: это инструмент командной строки, который помогает разработчику управлять зависимостями своего проекта. Он позволяет пользователю устанавливать, публиковать и запускать пакеты.

Yarn: по большей части Yarn является альтернативой NPM CLI. Он утверждает, что он быстрее, надежнее и безопаснее. Внизу он по-прежнему относится к тому же общедоступному репозиторию NPM для поиска информации о пакетах.

Тестирование в Javascript

Разработчик создает код, тестер ломает код!

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

Чтобы перечислить некоторые из них: Чай, Мокко, Жасмин, Джест, Энзим, Синон, Кипарис, Транспортир

Выбор фреймворка для тестирования в основном будет зависеть от того,

  1. Тестирование какого типа вы хотите провести? (Модуль, Интеграция, Пользовательский интерфейс, Покрытие кода)
  2. Какой еще фреймворк вы используете? (React, Angular, Vue)
  3. Личный вкус

Продвинутый материал

БАБЕЛ

Babel, по моему скромному мнению, - одно из лучших, что когда-либо случалось с JavaScript. Babel - компилятор JavaScript.

Подождите, но я подумал, что JavaScript - это не компилируемый язык. Это интерпретируемый язык!

Да это верно. JavaScript не является компилируемым языком.

Тогда какого черта нам нужно использовать этот компилятор Babel?

Для всего, что не связано с JavaScript. Babel позволяет нам использовать JavaScript следующего поколения уже сегодня! Он берет исходный код и компилирует его в другой исходный код. Следовательно, иногда его также называют Транспилером!

Когда был выпущен ES6, он принес массу новых интересных функций. Это вызвало огромный отклик сообщества. Нам нравятся новые блестящие функции! Но проблема была в том, что не все браузеры были готовы поддерживать весь новый крутой синтаксис. И даже если они догонят, мы знали, что по-прежнему будет необходимость поддерживать наших пользователей в старых браузерах. Чтобы решить эту проблему, был создан новый проект под названием 6to5. Он взял исходный код, написанный на ES6, и скомпилировал его до ES5. Этот проект прошел долгий путь с тех времен и теперь называется Babel.

Сегодня Babel позволяет нам использовать новые, экспериментальные и предлагаемые функции в нашем коде с синтаксисом, который в настоящее время не поддерживается браузерами. Это набор инструментов, который позволяет нам преобразовывать синтаксис и выборочно добавлять полифиллы для выбранных нами целевых сред. Это дает возможность разработчику создать свой собственный супернабор языка Javascript. Многие другие проекты, такие как React, JSX, Typescript, Flow и т. Д., Обязаны своим успехом Babel. Сегодня и в обозримом будущем Babel также продолжит сильно влиять на решения, принимаемые TC39 для ESNext

СТРОИТЬ ИЛИ НЕ СТРОИТЬ

Став опытным разработчиком, вы понимаете, что программирование - это весело. Но все остальное вокруг скучно. Вы должны скомпилировать код, минимизировать его, уточнить, запустить тесты, оптимизировать ресурсы, объединить активы, код версии, опубликовать код, развернуть код ... И поверьте мне, все это не весело!

Это повторяется, требует много времени и, проще говоря, ошеломляет!

Итак, вы начинаете сомневаться в своих жизненных решениях.

Неужели это то, чем я хочу заниматься всю свою жизнь?
Неужели я действительно собирался стать разработчиком?
Где обещанная слава?
Неужели все это ложь?
Неужели моя жизнь - ложь?
Есть ли что-нибудь реальное ??

Расслабьтесь, Нео, пока не нужно сомневаться в Матрице.

Сообщество JavaScript позаботится о вас. Добро пожаловать - Инструменты сборки. Они бывают всех форм и размеров. Есть Webpack, Gulp, Grunt, Browserify, Yeoman и т. Д. Каждый инструмент уникален, но похож. У всех есть свои особенности, но, простыми словами, все это инструменты автоматизации, которые были созданы, чтобы упростить вашу жизнь как разработчика JavaScript.

Это продвинутые концепции - темные переулки JavaScript World. Если вы младший разработчик в команде, вам, вероятно, никогда не придется заниматься настройкой этих инструментов; может быть, просто запустите пару команд здесь и там. Но когда вы неизбежно прогрессируете - поднимаетесь по пресловутой лестнице в мире разработки программного обеспечения - вам придется запачкать руки.

Webpack

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

Хотя webpack чрезвычайно мощный и настраиваемый, создатели webpack понимают, насколько сложной и сложной может быть вся конфигурация. Следовательно, чтобы снизить входной барьер, они даже поддерживают режим нулевой конфигурации в своей последней версии, Webpack 4. Это позволяет новому пользователю начать играть с webpack без каких-либо навыков мастера. и погрузитесь в детали конфигурации в удобном для них темпе.

Я надеюсь, что после прочтения этой статьи вы получили некоторое представление об экосистеме JavaScript. Я надеюсь, что Fear of Jargons теперь заменен на Curiosity.

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