ЛР №7 Сайт на языке разметки HTML создать и перетащить скрипт на дистрибутивы Linux
.docxДоценту кафедры ИКД
Громову В. В.
Лабораторная работа №7
Я, Гетманченко Полина Алексеевна, выполнила лабораторную работу под номером 7.
Ход работы (лабораторная работа №7)
Цель лабораторной работы под №7 – написать свой сайт на языке разметки HTML (возможно и с применением каскадных таблиц CSS) и перетащить данный скрипт на дистрибутивы Linux, проверив его в браузере. Для выполнения данной работы потребовалось создать 4 страницы: главная страница, где находилась информация о себе и 3 страницы, где были размещены почти в одинаковом количестве 50 фотографий с телефона (некоторые фотографии были сделаны на старой модели). Для удобства выполнения следующей лабораторной работы (№8) был создан FTP-сервер.
Скрипты лабораторной работы №7
Скрипт главной страницы:
<!DOCTYPE html>
<head>
<title>Лабораторная работа №7</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<H1 align="center">Лабораторная работа №7</H1>
<p class="text"> Привет! Меня зовут Гетманченко Полина Алексеевна. Родилась я в дождливом Санкт-Петербурге 6 декабря 2000 года. Окончила школу с углублением английского языка, параллельно увлекаясь восточными танцами, разработкой игр на уже покойном движке Flash, хип-хоп танцами, рисованием, дизайном, изучением английского языка, профессиональным плаванием. Теперь я учусь в СПбГУТ на веб-дизайнера. И, пока что, вроде что-то получается, но я буду стремиться к лучшему!</br>
</br>
Но сначала я хотела бы предложить тебе, дорогой читатель, взглянуть на мои фотографии :)
</p>
<ul>
<li><a href="images1.html">Пак №1</a></li>
<li><a href="images2.html">Пак №2</a></li>
<li><a href="images3.html">Пак №3</a></li>
</ul>
</br>
<p align="center"><img src="images1/100.gif"></p>
</body>
</html>
Скрипт страницы 1 пака фотографий:
<!DOCTYPE html>
<head>
<title>Лабораторная работа №7</title>
<link rel="stylesheet" href="style.css">
<script type="text/javascript">
function images() {
let place_for_photos = document.getElementById("content");
let img = "";
for (var i = 1; i <= 17; i++) {
img += "<img src='images1/" + i + ".jpg' width='550' height='600'>";
place_for_photos.innerHTML = img;
}
}
</script>
</head>
<body onload="images()">
<p class="text" id="text">Пак №1</p>
<div id="content"></div>
<ul>
<li><a href="index.html">Главная страница</a></li>
<li><a href="images2.html">Пак №2</a></li>
<li><a href="images3.html">Пак №3</a></li>
</ul>
</body>
</html>
Скрипт страницы 2 пака фотографий:
<!DOCTYPE html>
<head>
<title>Лабораторная работа №7</title>
<link rel="stylesheet" href="style.css">
<script type="text/javascript">
function images() {
let place_for_photos = document.getElementById("content");
let img = "";
for (var i = 18; i <= 34; i++) {
img += "<img src='Images2/" + i + ".jpg' width='550' height='600'>";
place_for_photos.innerHTML = img;
}
}
</script>
</head>
<body onload="images()">
<p class="text" id="text">Пак №2</p>
<div id="content"></div>
<ul>
<li><a href="index.html">Главная страница</a></li>
<li><a href="images1.html">Пак №1</a></li>
<li><a href="images3.html">Пак №3</a></li>
</ul>
</body>
</html>
Скрипт страницы 3 пака фотографий:
<!DOCTYPE html>
<head>
<title>Лабораторная работа №7</title>
<link rel="stylesheet" href="style.css">
<script type="text/javascript">
function images() {
let place_for_photos = document.getElementById("content");
let img = "";
for (var i = 35; i <= 50; i++) {
img += "<img src='Images3/" + i + ".jpg' width='550' height='600'>";
place_for_photos.innerHTML = img;
}
}
</script>
</head>
<body onload="images()">
<p class="text" id="text">Пак №3</p>
<div id="content"></div>
<ul>
<li><a href="index.html">Главная страница</a></li>
<li><a href="images1.html">Пак №1</a></li>
<li><a href="images2.html">Пак №2</a></li>
</ul>
</body>
</html>
Для начала с помощью команды sudo apt update происходит обновление локального индекса пакетов, затем выполняется сама установка apache2 – sudo apt install apache2. Так как SSL на сервере ещё не настроен, нужно открыть порт 80 – sudo ufw allow ‘WWW’, а затем проверить – sudo ufw status.
После основных настроек происходит проверка веб-сервера с помощью команды sudo systemctl status apache2.
Также нужно будет удалить из директории index.html, который первоначально там лежал, заменив своим файлом под таким же названием.
Для удобства и взаимодействия между файлами двух рабочих столов (главный рабочий стол и рабочий стол виртуальной машины) был настроен FTP-сервер, начало процесса его настроек показано на рисунке 1:
Рисунок 1 – настройка FTP-сервера
Благодаря утилите ifconfig происходит возврат списка, где можно увидеть не только сетевые интерфейсы, которые подключены к системе, но и их характеристики. Одна из таких характеристик, как IP-адрес, нужна для создания данного FTP-сервера, а результат показан на рисунке 2 – 3:
Рисунок 2 – результат созданного FTP-сервера (главный рабочий стол Windows)
Рисунок 3 - результат созданного FTP-сервера (главный рабочий стол Linux (Astra Linux))
Студент группы ИСТ-931 Гетманченко П.А.