Блог

Что такое Modern Javascript?

6 years ago
14K
Sergei Nikonov
 
Modern Javascript или современный Javascript - это обновленная версия популярного языка программирования, который используют для создания как Frontend, так и Backend. 
 

Посмотрите видео о курсе Modern Javascript

 

Что такое Frontend?

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

Кто такой Frontend-разработчик?

Программисты, которые занимаются в основном только Frontend-частью: верстка, программированием на чистом javascript  или с помощью библиотек jQuery, ReactJS или с помощью frontend-фреймворков, таких как VueJS, AngularJS - это Frontend Developers или frontend-разработчики.
 

Что должен знать Frontend-разработчик?

Frontend-разработчик должен быть знаком с версткой (HTML и CSS)
Frontend-разработчик должен хорошо знать язык Javascript (modern javascript в версиях ES6, ES7 и классический javascript, версии ES5) и какой-нибудь Frontend-фреймворк (VueJS, ReactJS, AngularJS)
 

Сколько зарабатывает Frontend-разработчик?

Заработок зависит от уровня знаний специалиста и начинается от 1000 долларов.
В среднем Frontend-разработчик 2000 - 3000 долларов. 
Ознакомиться с открытыми вакансиями Frontend-разработчика, вы можете здесь.
 

Что такое Backend?

Backend - это скрытая часть от пользователя веб-сайта, которая занимается обработкой данных. 
 
Простой пример:  Когда вы перешли в блог FructCode в данную статью, перед тем как вам показать информацию из этой статью, backend-сервер проверил, имеется ли в базе данных уникальный адрес:
https://fructcode.com/ru/blog/what-is-modern-javascript-and-frontend/ 
и когда данная запись нашлась, backend-сервер передел данные о статье в frontend-часть и в итоге вы можете читать данную статью. 
 
Есть хорошая иллюстрация, которая помогает понять что такое Frontend и что такое Backend
 
frontend_vs_backend_fructcode
 
Реализовывать Backend-часть приложения можно на разных языках: PHP (на чистом PHP или с помощью фреймворков таких как Codeigniter, Yii2, Laravel, Zend и других), Modern Javascript (с помощью NodeJS, ExpressJS) и других языках. Более подробно про различные фреймворки, вы можете прочитать в этой статье
 

Зачем изучать Modern Javascript?

Если вы хотите научиться создавать крутые интерактивные интерфейсы, как в Facebook, Netflix, Instagram - вам необходимо знать современный Javascript, так как при программировании на современных библиотеках и фреймворках, таких как ReactJS, VueJS, AngularJS, используют Modern Javascript
 
И это неудивительно, ведь современный Javascript, начиная с версии Ecma Script 6,  стал значительно красивее и проще классического Javascript версии Ecma Script 5. Просто сравните 2 фрагмента кода:
 
Старая версия Javascript (Ecma Script 5), который сейчас понимает большинство браузеров:
"use strict";

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var FructCode = function () {
  function FructCode(name, age) {
    _classCallCheck(this, FructCode);

    this.name = name;
    this.age = age;
  }

  _createClass(FructCode, [{
    key: "saySomething",
    value: function saySomething() {
      return "My name is " + this.name + ". I'm " + this.age;
    }
  }]);

  return FructCode;
}();
 
Этот же код написанный на новой версии Javascript (Ecma Script 6):
class FructCode {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  
  saySomething() {
    return `My name is ${this.name}. I'm ${this.age}`;
  }
}
 
Кстати, с помощью фреймворка React Native и Modern Javascript, можно создавать и профессиональные мобильные приложения!
 
В курсе Modern Javascript вы узнаете новые возможности и конструкции современного Javascript, а также закрепите полученные знания на практике в интерактивных упражнениях (когда вы пишите код прямо в браузере и сразу получаете результат - верно или нет). 
 
Также вы познакомитесь с инструментами, такими как NodeJS, BabelJS, WebPack с помощью которых вы сможете писать код на современном Javascript, а также собирать код вашего проекта.
 

Выводы

Современный Javascript в версиях EcmaScript 6, EcmaScript 7, EcmaScript 8 - это универсальный язык программирования, с помощью которого можно создавать современные веб и мобильные приложения, а также достаточно хорошо зарабатывать.