JavaScript. Языки и технологии презентация

Максим Белкин
Senior Front-end Engineer
050 64 34 716
Skype: ri4ard90
fb.com/max.belkins
vk.com/max.belkins

Профессия Front-End Developer
Самое популярное направление
Быстрый старт
Множество языков и технологий

Языки и технологии

FRONT-END & BACK-END
Сервер
PHP
База данных
Запрос
Ответ

Два типа языков программирования
Императивные
Декларативные

Императивные
Описывают последовательность действий
Например
2+2
Иди туда, делай то
sharick = new Dog();
sharick.voice();

Декларативные
Описывают характеристики, свойства, параметры
Например:
<стол цвет=”белый” материал=”дерево”>
Текст с описанием стола

На практике
HTML – декларативный
CSS – декларативный
JavaScript – императивный
PHP - императивный

Два типа языков программирования
Компилируемый
Интерпретируемый

JavaScript. Динамика
Любое изменение любых элементов, стилей
Обработка любых событий на странице
Работа с сервером. Отправка и получение данных
Cookies, LocalStorage

JavaScript крут, но не всемогущ
Отсутствует доступ к файловой системе пользователя
Нет доступа к другим вкладкам
Затруднен доступ к ресурсам с других сайтов

Становление JavaSscript
1995г. - первый выпуск JS в Netscape Navigator 2.0
1996г. - ECMA-262
ECMAScript - стандартизированный JavaScript
1999г. - ECMAScript 3 - масса изменений
2008г. - ECMAScript 5 - перерождение JS
2015г. - ECMAScript 6 (он же ES6, ECMAScript 2015)

Краткая история становления JS
https://habrahabr.ru/company/livetyping/blog/324196/
https://habrahabr.ru/company/livetyping/blog/324506/
https://habrahabr.ru/company/livetyping/blog/324908/

JavaScript развивается
Огромное сообщество разработчиков
Множество современных обновляемых библиотек и фреймворков
JavaScript может делать серверную часть (NodeJS)

IDE (Integrated Development Environment)
WebStorm
Atom
Netbeans, Sublime Text etc.

Подключение скриптов
На странице через тег
<br>Отдельным файлом через тег… <script><br></div></h2><!----><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide20" class="slides-item"><!--[--><div class="text-center"><span class="slides-headingUnit">Слайд 20</span></div><h2 class="mb-0"><img src="/_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_1440x1080/imagesDir/jpg/181098/slide-19.jpg" onerror="this.setAttribute(&#39;data-error&#39;, 1)" width="720" height="540" alt="Hello, world! alert(&#39;Привет, Мир!&#39;); console.log(&#39;Привет, Консоль!&#39;);" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_480x360/imagesDir/jpg/181098/slide-19.jpg 480w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_720x540/imagesDir/jpg/181098/slide-19.jpg 720w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_960x720/imagesDir/jpg/181098/slide-19.jpg 960w, /_ipx/f_webp&amp;q_80&amp;fit_contain&amp;s_1440x1080/imagesDir/jpg/181098/slide-19.jpg 1440w" class="slides-image"></h2><h2 class="slides-content text-center font-bold"><div><p>Hello, world!<br><p><script>
alert('Привет, Мир!');<br> console.log('Привет, Консоль!');