Проект на тему: "Язык программирования JavaScript React"

Министерство образования и науки Российской Федерации

МБОУ

«Лицей №6»

«Информатика и ИКТ»

ПРОЕКТ

на тему:

«Язык программирования: JavaScript React»

Разработал: Панов А.Ю.,

ученик 8 класса «Б»

Руководитель: Попова Е.Г.,

учитель информатики

Рубцовск

2022

Введение 3

Глава 1 Теоретический материал 5

1.1. История JavaScript 5

1.2. React история 6

1.3. Классификация и обзор языков программирования 6

1.4. Зачем нужен JavaScript и React 12

Глава 2 Инструкции в JavaScript 14

2.1. Инструкции 14

2.2. Переменные 15

2.3. Константы 16

2.4. BigInt 16

Глава 3 Практическая часть 18

3.1. Создание макета социальной сети 18

Заключение 19

Список литературы и интернет ресурсы: 20

Приложение: 22

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

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

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

Цель – исследовать язык программирования JavaScript.

Задачи:

• развитие познавательного интереса;

• ознакомиться с материалами по данной теме;

• узнать историю развития языка JavaScript и его React (библиотеку);

• создать презентацию, которая поможет представить мой проект моим одноклассникам и друзьям, а также представить на уроках информатики;

• создать практическую работу на тему: «Социальная сеть».

Объект исследования – компьютерные технологии.

Гипотеза - я предполагаю, что с созданием языка программирования JavaScript людям стало легче работать, а программирование стало не таким сложным.

Методы работы над проектом:

• поисково-аналитический;

• информационно- исследовательский;

• практический.

Продукты проекта: материалы работы, презентация в формате MicrosoftPowerPoint, практическая работа.

Перед Бренданом Эйхом, нанятым в компанию Netscape 4 апреля 1995 года, была поставлена задача внедрить язык программирования Scheme или что-то похожее в браузер Netscape. Поскольку требования были размыты, Эйха перевели в группу, ответственную за серверные продукты, где он проработал месяц, занимаясь улучшением протокола HTTP. В мае разработчик был переброшен обратно, в команду, занимающуюся клиентской частью (браузером), где он немедленно начал разрабатывать концепцию нового языка программирования. Менеджмент разработки браузера, включая Тома Пакина, Михаэля Тоя, Рика Шелла, был убеждён, что Netscape должен поддерживать язык программирования, встраиваемый в HTML-код страницы. Помимо БренданаЭйха, в разработке участвовали соосновательNetscapeCommunications Марк Андрессен и соосновательSunMicrosystems Билл Джой: чтобы успеть закончить работы над языком к релизу браузера, компании заключили соглашение о сотрудничестве в разработке. Они ставили перед собой цель обеспечить «язык для склеивания» составляющих частей веб-ресурса: изображений, плагинов, Java-апплетов, который был бы удобен для веб-дизайнеров и программистов, не обладающих высокой квалификацией. Первоначально по предложению Марка Андрессена язык был назван Mocha, был реализован БренданомЭйхом в течение десяти дней и впервые был включен в пре-альфу версию Netscape 2. Затем он был переименован в LiveScript и предназначался как для программирования на стороне клиента, так и для программирования на стороне сервера. На синтаксис оказали влияние языки Си и Java, и, поскольку Java в то время было модным словом, 4 декабря 1995 года LiveScript переименовали в JavaScript, получив соответствующую лицензию у Sun. Анонс JavaScript со стороны представителей Netscape и Sun состоялся накануне выпуска второй бета-версии NetscapeNavigator. В нём декларируется, что 28 лидирующих ИТ-компаний выразили намерение использовать в своих будущих продуктах JavaScript как объектный скриптовый язык с открытым стандартом.

React был создан Джорданом Валке, разработчиком программного обеспечения из Facebook. На него оказал влияние XHP — компонентный HTML-фреймворк для PHP. Впервые React использовался в новостной ленте Facebook в 2011 году и позже в ленте Instagram в 2012 году. Исходный код React открыт в мае 2013 года на конференции «JSConf US».ReactNative анонсирован на конференции Facebook «React.js Conf» в феврале 2015 года, а исходный код открыт в марте 2015 года. Он позволяет разрабатывать нативныеAndroid-, iOS- и UWP-приложения с использованием React.18 апреля 2017 года Facebook анонсировал ReactFiber, переписанную и оптимизированную версию React. ReactFiber станет основой разработки всех будущих функций и улучшений.

React может использоваться для разработки одностраничных и мобильных приложений. Его цель — предоставить высокую скорость, простоту и масштабируемость. В качестве библиотеки для разработки пользовательских интерфейсов React часто используется с другими библиотеками, такими как MobX, Redux и GraphQL.

Сначала нужно узнать общие виды языков программирования и их назначение. Все они подразделяются на две категории:

• процедурные;

• непроцедурные.

Процедурная (алгоритмическая) программа — это система формальных предписаний, направленных на решение конкретных задач, которые выполняет ЭВМ.

Непроцедурное программирование представляет собой прямо противоположную методологию (парадигму) разработки, когда компьютеру ставится определённая задача в более или менее общем виде,

без написания формализованного алгоритма, который отдаётся на усмотрение машины.

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

• низкого уровня (или машинно-ориентированные);

• высокого уровня.

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

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

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

Непроцедурные языки включают две основные языковые группы:

• объектно-ориентированные;

• декларативные.

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

Декларативные языки подразделяются на два семейства:

• логические;

• функциональные.

Логическое программирование описывает проблемы в виде фактов и формул, а система решает их посредством механизмов логического вывода.

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

Теперь от общей классификации можно перейти к обзору ключевых современных языков программирования, а именно самых популярных и любимых профессионалами. Их всего десять в списке: C++, Python, Visual Basic, PHP, Delphi, Java, JavaScript, Ruby, ActionScript, Nemerle. У каждого из них есть свои характерные особенности, недостатки и преимущества, которые можно увидеть в описаниях ниже.

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

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

На С++ можно писать всё что угодно, именно это и обеспечило ему любовь профессионалов. Кроме того, он относительно прост в освоении — тому, кто уже изучил С, Python или Java, будет нетрудно разобраться и в С++.

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

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

Практически каждый пользователь сталкивался с необходимостью установить или обновить Java-модуль. К подводным камням Java относится медлительность написанных на нём программ и их «прожорливость» (то есть они задействуют оперативную память в большом объёме). Зато у Java есть несколько модификаций, которые характеризуются собственными библиотеками данных и структурой, заточенной под специальные задачи.

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

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

Python  (Пайтон или Питон) Python — весьма популярный в наше время язык, созданный с целью как можно более простого написания сложных программ. Он был образован на основе ранних разработок и впитал в себя все их достижения. При этом постоянно выходят новые обновления, с каждым из которых он становится всё совершеннее.

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

Visual Basic (Вижуал Бейсик) Вряд ли найдётся тот, кто не слышал об этом продукте от Microsoft, ведь многие программисты именно на нём познавали азы работы с кодом. Visual Basic - простой, многофункциональный и подходящий для быстрого прототипирования язык программирования . языки программирования и их назначение VB даёт широкие возможности по созданию программного кода, а также позволяет разрабатывать UI 

(пользовательский интерфейс) программ. Именно его чаще всего используют специалисты Microsoft для создания таблиц с данными.

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

Кроме того, у этой программы невысокая скорость работы, использовать её можно только на ОС Windows и macOS.

PHP (Пи-эйч-пи) - расшифровывается как Personal Home Page Tools («инструменты для создания личной странички в интернете»). Чаще всего PHP применяют веб-мастера для разработки сайтов.

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

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

К его недостаткам относятся несовместимость разных версий и невозможность создания в нём многопотоковых программ, усиливающих

производительность компьютера.

Delphi (Делфи)  Delphi — императивный объектно-ориентированный язык, разработанный на основе высокоуровневого Object Pascal. современные языки программирования.

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

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

Ruby (Руби) Кроссплатформенный и по-настоящему универсальный скриптовый язык, относящийся к сфере объектно-ориентированного программирования. Его синтаксис прост и лаконичен, благодаря чему новичкам будет несложно его освоить. Профессионалы любят его за бережливость по отношению к компьютерным ресурсам.

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

ActionScript (Экшн-скрипт) ActionScript — это мультимедийный скриптовый язык программирования, который предназначен для написания объектно-ориентированных программ, а именно Flash-приложений. Написание программы Его заточенность под конкретные задачи является одновременно и плюсом, и минусом, так как в пределах Flash он отличается многофункциональностью, но ничего другого на нём написать практически невозможно.

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

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

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

Nemerle (Немерле) Это высокоуровневый гибридный язык программирования, в котором сочетаются элементы функционального и объектно-ориентированного программирования. Он появился не так давно и вобрал в себя лучшие наработки языков-предшественников, но при этом дал и реальный вклад в программирование — возможность создания метапрограмм. Этот метод заключается в выработке алгоритмов, которые в процессе своей работы создают возможные сценарии для дальнейшего образования исполняемых файлов.

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

Язык программирования JavaScript придумали специально для того, чтобы создавать интерактивные сайты. Такие сайты реагируют на ваши действия: добавляют лайк, когда вы нажимаете на «сердечко»; загружают новые посты в ленту, когда вы доходите до конца страницы; показывают оповещения о новом сообщении или письме. Также на нем можно писать приложения для Android. Для этого и нужен JavaScript. Сегодня это один из самых популярных и востребованных языков программирования, поэтому он пригодится каждому веб-разработчику.

Когда программист приходит в компанию его спрашивают какого он разряда есть такие разряды как

Junior-Джун — это разработчик, который ещё не может справляться без сторонней помощи. У него мало знаний и много вопросов. Поэтому каждому джуну нужен или хороший наставник-тимлид, или работа в сильной команде.

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

Senior- Специалист уровня сеньор знает свою сферу ответственности в проекте, самостоятельно формирует задачи и цели. Он может объяснить все процессы и рассказать, что и почему нужно сделать. Сеньор умеет мыслить в перспективе, планировать и предупреждать риски. На этом этапе обычно происходит профориентация разработчика. Он углубляется в свою специализацию и узнаёт её особенности на высшем уровне. Так сеньор становится незаменимым членом команды и может вырасти до тимлида.

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

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

alert('Привет');-alert команда вызывающая специальное окно с теми данными которые написаны в скобках (‘привет’)

также можно сделать вызов alertнесколько раз подряд просто отделив его спец символом;alertв переводе с английского тревога

alert('Привет'); alert('Мир');

Обычно каждую инструкцию пишут на новой строке, чтобы код было легче читать:

alert('Привет');

alert('Мир');

alert(3 +

1

+ 2);

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

Чтобы оставить комментарий к своему коду нужно выделить его и скрыть от рабочей программы, чтобы для нее он был не виден, делаться это следующем образом // ваш комментарий

Также есть Многострочные комментарии начинаются косой чертой со звёздочкой /* и заканчиваются звёздочкой с косой чертой */

Есть горячие клавиши чтобы не писать комментарии каждый раз вручную. В большинстве редакторов строку кода можно закомментировать, нажав комбинацию клавиш Ctrl+/ для однострочного комментария и что-то вроде Ctrl+Shift+/ – для многострочных комментариев (выделите кусок кода и нажмите комбинацию клавиш).

«usestrict»

Директива выглядит как строка: "usestrict" или 'usestrict'. Когда она находится в начале скрипта, весь сценарий работает в «современном» режиме. Например:"usestrict";

2.2. Переменные

JavaScript-приложению обычно нужно работать с информацией. Например: Интернет-магазин – информация может включать продаваемые товары и корзину покупок. Чат – информация может включать пользователей, сообщения и многое другое.

Переменная – это «именованное хранилище» для данных. Мы можем использовать переменные для хранения товаров, посетителей и других данных. Для создания переменной в JavaScript используйте ключевое слово let.Приведённая ниже инструкция создаёт (другими словами: объявляет или определяет) переменную с именем «message»:

• теперь можно поместить в неё данные, используя оператор присваивания letmessage;

• message = 'Hello'; переменное“message” присвоено“hello”

• чтобы получить доступ к переменной нужно ввести следующие команды

• let message;

• message = 'Hello!';

• alert(message); показывает содержимое переменной.

var вместо let

В старых скриптах вы также можете найти другое ключевое слово: var вместо let:

varmessage = 'Hello';

Ключевое слово var – это, что и let. Оно объявляет переменную, но немного по-другому, «устаревшим» способом.

let $ = 1; // объявили переменную с именем "$"

let _ = 2; // а теперь переменную с именем "_"

alert($ + _); будет 3

Примеры неправильных имён переменных:

let 1a; // не может начинаться с цифры

letmy-name; // дефис '-' не разрешён в имени. Не латинские буквы разрешены, но их использование не рекомендуется. Есть зарезервированные слова такие как: let, class, return и function.

2.3. Константы

Чтобы объявить константную, то есть, неизменяемую переменную, используйте const вместо let: constmyBirthday = '08.11.2006';

Например, сделаем константы для различных цветов в «шестнадцатеричном формате»:

• const COLOR_RED = "#F00";

• const COLOR_GREEN = "#0F0";

• const COLOR_BLUE = "#00F";

• const COLOR_ORANGE = "#FF7F00";

• // ...когда нам нужно выбрать цвет

• letcolor = COLOR_ORANGE;

• alert(color); // #FF7F0 мы выбрали оранжевый его переменная константа была цвет_оранжевый; и присвоенный системный код оранжевого.

2.4. BigInt

В JavaScript тип «number» не может содержать числа больше, чем (253-1) (т. е. 9007199254740991), или меньше, чем -(253-1) для отрицательных чисел. Это техническое ограничение вызвано их внутренним представлением.

Для большинства случаев этого достаточно. Но иногда нам нужны действительно гигантские числа, например, в криптографии или при использовании метки времени («timestamp») с микросекундами.

Тип BigInt был добавлен в JavaScript, чтобы дать возможность работать с целыми числами произвольной длины.

Булевый тип (boolean) может принимать только два значения: true (истина) и false (ложь).

Функция prompt принимает два аргумента:

letage = prompt('Сколько тебе лет?', 100);

alert(`Тебе ${age} лет!`); // программа спрашивает сколько тебе лет.

constNavbar = () = {

return

Профиль

Сообщения

Новостистрелочная функция

}

Для создания макета социальной сети необходимо сначала установить программу для языка программирования JavaScript-React это либо visualstudiocode сокращенно vscode. или WebStormего, которую используют профессионалы. WebStorm — интегрированная среда разработки на JavaScript, CSS & HTML от компании JetBrains. WebStorm обеспечивает авто дополнение, анализ кода на лету, навигацию по коду, рефакторинг, отладку, и интеграцию с системами управления версиями. Важным преимуществом интегрированной среды разработки WebStorm является работа с проектами

Создание макета начинается с создания папки, для её создания нужно открыть WebStorm, затем нажать в левой верхней части файл =создать новый файл = выбрать React, папка создана. В открывшемся окне необходимо написать npminstall, оно установит недостающие файлы. После скачивания все файлов открываем папку App.css в ней располагаются данные об местоположении и размеров фотографий и граф в пикселях.

Далее создаем программу как на рис.1 (см. приложение).

В папке App.js располагается то, что откуда импортируется, и константа, которая оборачивает оболочку сайта.

В папке components располагаются компоненты такие как Header, Navbar, Profile, они похожи по своей функции на папку app.css, но в них уже пишется то что мы хотим увидеть, в Navbar допустим это профиль, новости, музыка, настройка. В папке Profile мой профиль и профиль других на этом сайте, также мои посты более подробно во вложениях 2-6.

Чтобы его запустить во вкладке terminal пишем npmstart.

И ДАЛЕЕ ЧЕГО?

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

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

Изучая данную тему, я впервые выполнил практическую работу на тему – «Макет заставки социальной сети», с объяснением утилиты WebStorm.

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

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

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

1. Аверьянов, Г. П. Основы современной информатики: учебное пособие / Г. П. Аверьянов, А. С. Рошаль. – МИФИ, 2014. – 318 с.

2. Амелина, Н. И. Задачник-практикум по основам программирования : учебное пособие по курсу «Информатика» / Н. И. Амелина, Е. С. Невская, Я. М. Русанова [и др.]. – Ростов-н/Д : ЮФУ, 2015. – 192 с.

3. Богданов, М. Р. Разработка клиентских приложений Web-сайтов : пособие / М. Р. Богданов. – УИТ, 2014. – 228с.

4. Вайк, А. JavaScript: Полное руководство / Аллен Вайк. – 4-е издание. – М.: Вильямс, 2014. – 720 с.

5. Гудман, В. JavaScript. Библия пользователя / Д. Гудман. – СПб. : Вильямс, 2016. – 1184 с.

6. Дмитриева В. JavaScript : пособие / В. Дмитриева. – СПб. : BHV-СПб, 2014. – 336 с.

7. Зольников, В. К. Программирование и основы алгоритмизации : учебное пособие / В. К. Зольников, П. Р. Машевич, В. И. Анциферова, Н. Н. Литвинов. – Воронеж : ВГЛА, 2014. – 341 с.

8. Кингсли-Хью, Э. Java Script : учебный курс / Э. Кингсли-Хью. – СПб. : Питер, 2015. – 256 с.

9. Ломов, А.Ю. HTML, CSS, Скрипты: практика создания сайтов: самоучитель / А.Ю. Ломов. – СПб. : БХВ-Санкт-Петербург, 2016. – 416 с.

10. Макфарланд Дэвид: JavaScript и jQuery. Исчерпывающее руководство. 3-е издание, Издательство: Эксмо, Год издания: 2017, Количество страниц: 880 с.

11. Митина, О. А. Программирование : методические указания / О. А. Митина, Т. Л. Борзунова. –  Альтаир : МГАВТ, 2015. – 61 с.

12. Мэрдюк, К. JavaScript. Наглядный курс создания динамических Web-страниц : учебное пособие / К. Мэрдок. – М. : Диалектика, 2014. – 288 с.

13. Флэнаган, Д. JavaScript: подробное руководство : пер. с англ. /  Д. Флэнаган. – СПб. : Символ-плюс, 2014. – 992 с.

14. Финогенов, К. Г. Win32: основы программирования / К. Г. Финогенов. – Диалог-МИФИ, 2016. – 411 с.

15. Фримен Э., Робсон Э. , Изучаем программирование на JavaScript, Издательство Питер СПб, Год издания 2018, Кол-во страниц 640 с.

16. https://learn.javascript.ru/

17. https://htmlacademy.ru/

18. https://ru.wikipedia.org/wiki/JavaScript

19. https://ru.wikipedia.org/wiki/React

20. https://www.youtube.com/c/ITKAMASUTRA

21. https://floop.top/ru/javascript/

22. https://checkroi.ru/blog/zachem-novichku-uchit-javascript/

Рис.1- Содержимое папки

Рис.2

Рис.3

Рис.4