Файл: Отчет по производственной практике пм. 02 участие в разработке информационной системы.docx

Негосударственное образовательное учреждение высшего профессионального образования «Московский финансово промышленный университет «Синергия»

Уровень образования: СПО Специальность: 09.02.04

Информационные системы (по отраслям)

ОТЧЕТ

по производственной практике ПМ.02 участие в разработке информационной системы.

Место прохождения практики Негосударственное образовательное учреждение высшего профессионального образования «Московский финансово промышленный университет «Синергия»

__________________________________________________________________

Сроки прохождения практики: с 18.05.2022 по 11.06.2022.

Выполнил:

Студент 3 курса

Заочной формы обучения

Демьянченко Евгения Александровича

«11» июня 2023 г _________

(подпись)

Подпись руководителя

практики от организации ________ _______________________

(подпись) (ФИО)

Подпись руководителя

практики от профильной организации ______ __________________________ в (подпись) (ФИО)

Оглавление

ОТЧЕТ 1

по производственной практике ПМ.02 участие в разработке информационной системы. 1

Цели и задачи учебной практики: 3

База практики 4

Содержание практики 5

Рабочий этап 6

Заключение 48

Список используемой литературы 49

Цели и задачи учебной практики:

Приобрести практический опыт:

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

научиться:

• 
  осуществлять математическую и информационную постановку задач по обработке информации, использовать алгоритмы обработки информации для различных приложений;
  
• 
  уметь решать прикладные вопросы интеллектуальных систем с использованием, статических экспертных систем, экспертных систем реального времени;
  
• 
  использовать языки структурного, объектно-ориентированного программирования и языка сценариев для создания независимых программ, разрабатывать графический интерфейс приложения;
  
• 
  создавать проект по разработке приложения и формулировать его задачи, выполнять управление проектом с использованием инструментальных средств;
  

База практики

Базой практики Негосударственное образовательное учреждение высшего профессионального образования «Московский финансово промышленный университет «Синергия». ПК с характеристиками:
Процессор: ntel(R) Core(TM) i3-10110U CPU @ 2.10GHz 2.50 GHz

ОЗУ: 16ГБ;

Тип ситемы: 64-разрядная.

С использованием ПО:

ОС Windows 11, Microsoft Word 2013, MyphpAdmin

Содержание практики

• 
  Знакомство с возможностью браузера Google Chrome в области создания и редактирования документов
  
• 
  Создание и описание сайта с использованием языка разметки HTML
  
• 
  Создание БД с помощью программы Denwer
  
• 
  Создание сайта и использованием языка PHP
  

Рабочий этап

Облачные технологии. Работа с GOOGLE DOCS.

Зарегистрировал аккаунт Google.


Рисунок 1 Регистрационное меню Google

Создал текстовый документ. Набрал текст (содержание на Ваше усмотрение, но без нарушения законодательства РФ), объем текста - 1 страница. Отредактировал текст всеми способами представленными инструментами Google Документ. Загрузил документ Google на свой компьютер в виде файла Word, OpenOffice, RTF, PDF, HTML или ZIP. Перевёл документ на другой язык. Прикрепил документ к сообщению электронной почты.



Рисунок 2 Создание документа в Google Docs
Создал таблицу. Заполнил ячейки (минимум заполнение таблицы 20*20 ячеек). Использовале формулы. Экспортировал таблицу в формате Excel, CSV, TXT, ODS, PDF или HTML. Вставил график и диаграмму.



Рисунок 3 Создание графика

Создал презентацию. Экспортировал презентацию в формате PDF, PPT или TXT. Обязательно добавил в презентацию изображения и видео.



Рисунок 4 Создание рисунка

Создал рисунок. Использовал инструменты: Выделение цветом форматирования. Подгонка холста по размерам экрана. Инструмент «Выделение». Вставка линий, вставка фигур, вставка текстового поля, вставка изображения, вставка гиперссылки.

Создал форму из любого шаблона, представленного в Google Docs.

Техническое задание по разработке Интернет-сайта «Сказка»

Общие положения

1. 
   Предметом разработки является Интернет-сайт детского торгово-развлекательного центра «Сказка», расположенного по адресу: г. Санкт-Петербург, ул. Лени Голикова, 11 (FT, fairytale, SKZ -примеры для имени сайта) с системой управления «1С-Битрикс – Малый Бизнес».
   

Назначение сайта:

• 
  предоставление информации о предлагаемой продукции:
  
• 
  (детский ассортимент: игрушки, товары для новорожденных, детская одежда, обувь,
  
• 
  детское кафе с банкетами и аттракционами,
  
• 
  школа раннего развития),
  
• 
  описания и характеристики товара, услуг (кафе и школа), фото и видео с праздников
  
• 
  предоставление цен на предлагаемый товар (торговая зона) и услуги (кафе и школа)
  
• 
  оформление бронирования товара и услуги на сайте (интернет-витрина), связь автоматическая с «1С 8 торговля и склад»;
  
• 
  использование сайта как социального ресурса (форум).
  

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

Требования к графическому дизайну сайта

2. 
   Требования к дизайну сайта
   

При разработке сайта: дизайн упрощенный, детский (простые формы, спокойные цвета, крупные объекты знакомые ребенку – персонажи сказок, мультиков или животные).

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

www.tinylove.ru,

www.dm.ru,

www.wonderkids.ru,

http://www.slonenokshop.ru/index.php

Основные разделы сайта должны быть доступны с первой страницы.

Функциональные особенности:

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

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

Верхняя часть страницы:

• 
  Логотип компании
  
• 
  Контакты компании (телефоны + эл. адреса)
  
• 
  Вход (или регистрация для покупателей)
  
• 
  Раздел «Моя корзина»
  
• 
  Поиск по сайту
  
• 
  Поделиться: (значки соц. сетей), с помощью этого функционала можно поделиться о нас в соц. Сетях.
  
• 
  Блок меню
  
• 
  Под блоком верхнего меню — слайд-баннеры (кол-во не ограничено, функционал слайда: любое фото или найденное изображение должно автоматически подгоняется под размеры слайда, возможность редактировать слайд (надписи на нем и т.д.) в специальной программе сайта
  

Левая часть страницы:

• 
  Фотокамера (при клике — открывается обзор каждого зала в натуральную величину)
  
• 
  Подручные сертификаты и дисконтные карты (текстовая и фото информация о наших сертификатах, дисконтных картах, условия получения и т.д.)
  
• 
  Наши купоны (при клике — открываются все наши купоны на скидку, флаеры, на них нанесен водяной знак Сказка можно его распечатать и предъявить на скидку)
  
• 
  Работа у нас (размещение наших вакансий, возможность переписки с соискателем, как на www.slando.ru, возможность соединения сайта с поисковиками работы: при размещении вакансии у нас — автоматически объявление размещается на slando)
  
• 
  Как нас найти (интернет карта-спутник с маршрутами транспорта к нам — при переходе по этой ссылке)
  

Центральная часть страницы:

• 
  Новости общие по датам (тест с возможностью вставить фото или видео)
  
• 
  Правая часть страницы:
  
• 
  Детские развивающие игры онлайн (раскраски, на логику, мышление и т.д.)
  
• 
  Просмотр мультфильмов онлайн (чтобы мы могли сами устанавливать, что смотреть, а что нет)
  
• 
  Аудио-сказки
  
• 
  Нижняя часть страницы:
  
• 
  Меню (дублирование)+карта сайта
  
• 
  Адрес
  

Моделирование веб - приложения с использованием технологий и инструментальных средств MICROSOFT.

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

Приложение идеально подходит для ИТ-специалистов, разработчиков и аналитиков (например, связанных с бизнес-процессами, кадрами и управлением), которым требуется интерпретировать, обновлять и передавать сложную информацию о процессах, инфраструктуре и приложениях.

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



Рисунок 5 Меню Visio

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

Приложения Microsoft Office, такие как Word и PowerPoint, предоставляют базовые функции для создания диаграмм.

Visio — это специализированное средство, которое более эффективно для создания широкого спектра диаграмм и экономит вам немало времени.

Запустил MS Visio. Для открытия шаблона EPC в MS Visio н выбрал при создании нового проекта «Бизнес» → «Схема EPC».

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

Построил диаграмму eEPC:

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

Использование HTML для решения типовых задач.

Задание 1. Создание простейшего HTML-документа. Форматирование шрифта и абзаца

Создал файл с гипертекстовым документом:

Запустил редактор Блокнот, ввёл текст:

Приветствую Вас на моей первой web-страничке!



Рисунок 6 Блокнот с кодом

Сохранил файл в созданной папке.

Закрыл документ, нашёл его пиктограмму в окне Мой компьютер или в окне программы Проводник.

Открыл файл. Проанализировал, с помощью какого приложения отображается файл и как выглядит введенная фраза.

Ввёл теги, определяющие структуру html-документа:

С помощью контекстного меню открыл файл с помощью редактора Блокнот. Ввёл приведенные ниже теги, в разделе заголовка документа (между тегами <TITLE> TITLE>) указать свою фамилию.







Приветствую Вас на моей первой web-страничке!

Приветствую Вас на моей третьей web-страничке!

…

---

:

Заголовок 1-го уровня

Заголовок 2-го уровня

Заголовок 3-го уровня

Заголовок 4-го уровня

Заголовок 5-го уровня

Заголовок 6-го уровня

Рисунок 19 Результат вставки фона

Язык JAVASCRIPT. Синтаксис. Основные операторы. Интеграция с HTML

Web-документ, отображаемый браузером, – это результат исполнения программ, созданных на разных языках. Для описания структуры используется язык разметки (xhtml), для описания внешнего вида – язык стилей (css). Для описания поведения документа, его реакции на действия пользователя используется язык сценариев (javascript).

ЗАДАНИЕ 1.

В JavaScript существует 3 функции (метода), позволяющие пользователю выводить диалоговые окна:

alert

confirm

prompt

Метод alert (“строка”) используется для вывода простейшего диалогового окна, содержащего текст сообщения и единственную кнопку "Ok". Программа выводит сообщение и ожидает нажатия кнопки. После нажатия на кнопку, программа начинает выполняться дальше. Текст сообщения может сцепляться с любой текстовой переменной с помощью знака «+». Чтобы текст выводился в несколько строк используют символы «\n».



Рисунок 20 Код alert


Рисунок 8Результат alert

ЗАДАНИЕ 2.

Метод confirm (“строка”) используется в тех случаях, когда пользователь должен сделать выбор. Метод confirm позволяет пользователю вывести диалоговое окно, содержащее текст вопроса и кнопки "OК" и "Отмена". Функция confirm возвращает логическое значение в зависимости от нажатой пользователем кнопки:

• "OК" соответствует значению true,

• "Отмена" - значению false.

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



Рисунок 22 Код confirm

---

Рисунок 23 Результат confirm



Рисунок 94 Результат confirm 2



Рисунок 105 Результат confirm 3


ЗАДАНИЕ 3. prompt (“строка1”, “строка2”)

Метод prompt используется в тех случаях, когда пользователю нужно ввести значение в переменную. В окно выводится сообщение «строка1», в поле ввода помещается умалчиваемое значение «строка2». Этот метод позволяет вывести диалоговое окно запроса на ввод данных. Результат работы функции присваивают переменной строкового типа.

Если введенные данные нужно использовать в арифметических выражениях, необходимо выполнить преобразование введенной строки к числовому типу. Это можно сделать при помощи следующих функций:

parseInt("строка") - преобразует строку в целое число;

parseFloat("строка") - преобразует строку в число с плавающей точкой.


Рисунок 26 Код promt

ЗАДАНИЕ 4. Метод document.write()

JavaScript - это объектно-ориентированный язык. Основной единицей в объектно-ориентированном языке является объект, который объединяет в себе данные (свойства) и средства обработки этих данных (методы). Если говорить образно, то объекты – это «существительные», свойства объекта – это «прилагательные», а методы объекта – это «глаголы». Значения свойств объектов можно изменять.

Про JavaScript говорят, что в нем все объект. А именно: объектами являются окно, в котором открывается документ, сам документ, все элементы документа и даже свойства этих элементов.

Есть также специальные встроенные объекты. Для упорядочивания огромного количества объектов создатели браузеров придумали объектную модель документа. Эта модель является структурой организации объектов на странице. Объект document соответствует всему HTML-документу.

Изучим один метод этого объекта, позволяющий динамически формировать документ. Метод document.write(“строка html-кода”) - выводит строку в окно документа. Метод document.writeln (“строка html-кода”) - выводит строку в окно документа, в конце выводится символ "пробел". Метод, применяемый к объекту, пишется после имени объекта через точку. Содержимое строки должно быть в кавычках или это может быть объединение (сумма) нескольких строк или строковых переменных. Строка должна содержать элементы разметки страницы (теги и их содержимое). Метод исполняется в процессе загрузки документа.

---

В данном примере заголовки (Начало и Конец) находятся в документе, а текст абзацев формируется динамически и затем выводится в документ.



Рисунок 27 Код document.write()



Рисунок 11 Результат document.write()

Работа с Denwer, PHP expert editor и MyphpAdmin

Установка ПО Denwer и PHP expert editor

Установил 2 ПО Denwer и PHPexperteditorна компьютер. Установка заняла 10 – 15 минут.

Для Denwer сделал виртуальный диск под именем Z.



Рисунок 29 Установка Denwer'а 1 этап



Рисунок 03 Установка Denwer'а 2 этап



Рисунок 31 Завершение установки Denwer'а

После установки Denwerа, инсталлировал PHP expert editor.

Запустил установочный файл Phpxedit_43.exe , согласился с предупреждением системы безопасности и продолжил установку. Согласился с условиями лицензионного соглашения, выбрал директорию установки, нажал продолжить (установить). После завершения установки перезагрузил ПК. Запустил программу.



Рисунок 12 Интерфейс PHP expert editor

Далее зашёл на страницу администрирования базы данных basedate nugmanov. Для этого, ввёл в поисковой строке браузера адрес: localhost/tools/phpmyadmin/.


Рисунок 13 Переход к MyphpAdmin

Открылось окно myPHPAdmin.



Рисунок 14 Интерфейс MyphpAdmin

Создание базы данных

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



Рисунок 15 Начало создания базы данных

---

Рисунок 16 База данных создана
База данных добавилась в список баз данных в панели слева и на центральном поле.
Далее создал таблицу базы данных. Для этого заполняются поля «Имя» и «Количество столбцов». После этого открывается страница для заполнения полей новой таблицы базы данных. Каждому полю присваивается имя, тип хранимых данных, длинна. 



Рисунок 17 Создание таблицы базы данных

В базе данных будет одна таблица «Сдача предметов» с 7 столбцами.



Рисунок 18 Структура таблицы



Рисунок 19 Вставка данных в таблицу

Создание нового пользователя для базы данных.

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



Рисунок 20 Привилегии пользователя



Рисунок 21 Все пользователи

Добавление пользовательских данных в базу BaseDate с веб страницы

Создал html форму для ввода данных. С самого начала подготовил к работе с php, MySql и к тестированию написанного кода на локальном компьютере. Запустил Denwer на ПК. Открыл виртуальный диск, созданный Денвером. Открыл его, дальше: home – localhost – www – там создайте новую папку и дайте ей название Baza NR.

Создал обычный html файл назвал его info_form.html и сохранил в только что созданной папке Baza NR и прописал там код формы для ввода информации. В нашей таблице сдача предметов базы данных BaseDate Nugmanov есть 7 поля, которые я заполнил.

В параметре «action» моей формы прописан файл form.php. Он будет являться файлом обработчиком, созданный далее. 

Создал файл style.css для придания стилей форме, сохранил в той же папку, что и html файл.

---