Размещено на http://www.allbest.ru/

Министерство образования и науки Хабаровского края

Ванинский филиал краевого государственного бюджетного

профессионального образовательного учреждения

«Советско-Гаванский промышленно-технологический техникум»

Специальность: 09.02.04

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

Отчёт по производственной практике

«Участие в разработке информационных систем»

Руководитель практики: Т.Н. Андриенко

Студент группы ИС(ф)-1

3 Н.А. Телятникова

2016



Содержание

Введение

1. Основная часть

1.1 Организационные мероприятия. Общее ознакомление с базой прохождения практики. Техника безопасности

1.2 Изучение организационной структуры предприятия, должностных инструкций на рабочих местах, документооборота

1. 3.Разработка фрагмента ИС средствами программирования

1.4 Разработать методику выявления ошибок и алгоритм тестирования информационной системы

1.5 Сформировать документацию согласно принятых стандартов созданного программной части информационной системы

1.6 Описать технологию защиты данных используемой информационной системы

1.7 Создание и администрирование существующего сайта предприятия

2. Технологическая часть

2.1 Создание Web-сайта на примере предприятия «Рыболовецкая артель (колхоз) имени 50 лет Октября»

2.2 Разработка интерфейса сайта

2.3 Функции созданного сайта

Список используемых источников



Введение

В соответствии с учебным планом я, Телятникова Наталья Александровна, походила производственную практику с 07.11.2016г. по 25.12.2016г. на предприятии Рыболовецкая артель (колхоз) им. 50 лет Октября.

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

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

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

Развить коммуникативные навыки и получить больше опыта работы в коллективе.

Так же, целью производственной практики является:

- знакомство с реальной практической работой учреждения;

- развитие навыков самостоятельного решения проблем и задач, связанных с проблематикой, выбранной специализации;

- овладение методикой работы, применяемой в данном учреждении;

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

- применение полученных в процессе обучения

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



1. Основная часть

1.1 Организационные мероприятия. Общее ознакомление с базой прохождения практики. Техника безопасности

Соблюдение правил безопасной работы является необходимым условием предупреждения производственного травматизма.

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

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

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

Для исключения поражения электрическим током запрещается:

- часто включать и выключать компьютер без необходимости;

- прикасаться к экрану и к тыльной стороне блоков компьютера;

- работать на средствах вычислительной техники и периферийном оборудовании мокрыми руками;

Запрещается под напряжением очищать от пыли и загрязнения электрооборудование.

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

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

После проведения первичного инструктажа рабочие в течение первых 2,5 смен выполняют работу под наблюдением мастера или бригадира, после чего оформляется допуск к самостоятельной работе.

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

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

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

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

Искусственное дыхание пораженному электрическим током производится вплоть до прибытия врача. На рабочем месте запрещается иметь огнеопасные вещества.

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

1.2 Изучение организационной структуры предприятия, должностных инструкций на рабочих местах, документооборота

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

На предприятии имеют место элементы рациональной бюрократии, имеющие следующие характеристики:

1.Четкое разделение труда.

2.Иерархичность уровней управления.

3.Наличие стройной системы правил и стандартов.

4.Дух формальной обезличенности.

5.Найм на работу в соответствии с техническими квалификационными требованиями.

6.Защищенность служащих от произвольных увольнений.

Ведущий специалист подчиняется начальнику сектора по кадровому, правовому, документационному, информационному и ресурсному обеспечению.

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

Ведущий специалист должен знать:

- Конституцию Российской Федерации, действующие законодательство Российской Федерации и Хабаровского края, нормативные правовые акты Российской Федерации и Хабаровского края применительно к исполнению должностных обязанностей;

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

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

Кроме того, при выборе способа организации делопроизводства предприятия учитывались предписания Государственной системы документационного обеспечения управления. К примеру, в соответствии с ГСДОУ регистрация документов, поступающих на предприятие, а также документов, образующихся в его повседневной деятельности, обычно производится децентрализовано.

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

1.3 Разработка фрагмента ИС средствами программирования

Проходя практику на предприятии Рыболовецкой артели (колхоз) им. 50 лет Октября. В учебных целях я создала информационную систему по продаже бытовой техники, которая описана ниже.

Проектирование схемы базы данных.

В нашем случае для описания предметной области необходимо три таблицы. Условно назовем их "Группа товаров", "Товары" и "Производитель". В каждой из них хранятся соответствующие атрибуты.

Для трех таблиц определим необходимые формат и длину полей, а также зададим ключевые поля.

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

Для создания формы нужно открыть вкладку «Формы» окна базы данных и нажать Создать»

После этого в появившемся окне следует выбрать способ создания формы «Мастер форм» и выбрать таблицу, по которой необходимо сделать форму, в нашем случае таблица «Товары».

Далее при помощи кнопок Перенести все записи или Перенести выбранную запись нужно выбрать поля, которые будут отражены в форме Нажимаем кнопку «Далее».

Затем нужно выбрать внешний вид формы, стиль задать имя формы и форма готова

В нашей форме «Товары» есть поле объекта OLE для размещения изображений товаров. В свойствах этого поля, на вкладке «Макет» устанавливаем размеры: «Вписать в рамку». Это позволит вставлять изображения любых размеров - Access автоматически подгонит картинку под размер поля.

Теперь нужно сохранить изменения макета через меню Файл-Сохранить.

Рисунок 1.1 - Макет представленного товара

Предположим, что в базе данных накопилось довольно много товаров и вдруг срочно понадобилось найти один из них. Для этого нужно:

- установить курсор в поле «Наименование товара».

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

В моем проекте СУБД для магазина бытовой техники и электроники в

форме Товары при заполнении поля «Стоимость закупки» в поле «Стоимость продажи» автоматически вычисляется цена для продажи товара. Для автоматизации вычислений необходимо:

- щелкнуть правой кнопкой мыши по интересующему полю (в нашем случае это «Стоимость продажи») и выбрать пункт «Свойства.

- откроется окно «Поле: Стоимость продажи». Выбираем вкладку данные и вписываем в поле «Данные» формулу для расчета (Рисунок 1.2). Нам необходимо, чтобы стоимость продажи на 50% превышала стоимость покупки.

Закрываем это окно и сохраняем изменения в таблице. Для просмотра созданной формы, как она будет выглядеть при распечатывании на листе щелкаем по кнопке Предварительный просмотр (Рисунок 1.2).

Рисунок 1.2 Предварительный просмотр созданной формы

Создадим запросы на наличие и отсутствие товара.

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

Рисунок 1.3 - Соединение простых запросов

В следующем окне нажимаем «Далее». Теперь задаем имя запроса «Наличие товара» и отмечаем галочкой пункт «Изменить макет запроса»,

нажимаем «Готово». Запрос откроется в режиме конструктора. Теперь в столбце «Наличие товара» в строке «Условие отбора» задаем параметр «Истина». Поскольку в нашей таблице поле «Наличие товара» логическое, значения может быть два: Истина и Ложь. «Истина» - товар в наличии, «Ложь» - товара нет в магазине. Запрос на отсутствующий товар создается также, только в параметрах указываем значение «ЛожьПри выполнении запроса появится таблица товаров в наличии или отсутствующих в зависимости от запроса (Рисунок 1.4).

Теперь созданные запросы можно использовать в дальнейшем для отчетов по учету товара.

Рисунок 1.4- наличие товара

Аналогично создаем запрос «Данные о поставщиках». Запрос будет выдавать сведения о интересующих поставщиках и поставляемых ими товарах, а также ценах на эти товары. В запрос добавляем все поля из таблицы «Поставщики» и поля «Код товара», «Наименование товара», «Стоимость поставки» из таблицы «Товары». Переходим в режим конструктора.

Выполняем запрос. Появится окно с предложением ввести наименование поставщика. В следующем окне вводим код поставщика.

Оставить одно из полей пустым (именно поэтому в условиях отбора мы указали «Или»). Запрос будем выбирать данные о поставщиках по наименованию или по коду.

Рисунок 1.5 - Окно запроса данных о поставщиках

Группировка проведена по категории товару марке и модели. Отчет создан при помощи мастера создания отчетов и откорректирован при помощи конструктора отчетов. (Рисунок 1.6)

Рисунок 1.6 - Отчет ы режиме конструктор

Создание иерархической формы по двум связанным таблицам.

Для создания такой формы можно использовать мастер создания форм. Для корректировки вида формы используют режим «конструктор». Для сохранения закрытия и выхода из Microsoft Access в форме используются соответствующие кнопки созданные при помощи мастера создания кнопок. Для перехода к отчету содержащему информацию о всех товарах используется гиперссылка.

После перехода в режим формы можно добавлять или корректировать данные из двух таблиц. (Рисунок 1.7)

Рисунок 1.7 - Иерархическая форма

1.4 Разработать методику выявления ошибок и алгоритм тестирования информационной системы

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

Рассмотрим следующую ситуацию.

Существует процедура, которая содержит Microsoft Visual Basic для приложений (VBA) функции. Базы данных Microsoft Office Access проект содержит ссылку на отсутствующую библиотеку объектов или библиотеку типов. Запустим модуль или выполним процедуру. В этом случае может появиться одно из следующих сообщений об ошибке:

Сообщение об ошибке № 1( Рисунок 1.8)

Рисунок 1.8 - Ошибка в проекте Microsoft Office Access

Базы данных Microsoft Office Access или проект содержит отсутствующую или неправильную ссылку на файл Имя файла.

Чтобы убедиться в правильности работы базы данных или проекта, необходимо исправить эту ссылку.

Сообщение об ошибке № 2 (Рисунок 1.9.)

Ошибка компиляции: Не удается найти проект или библиотеку

Рисунок 1.9 - Ошибка при компиляции функции

Причина: Эта проблема возникает, так как библиотека по крайней мере один объект, на который имеется ссылка или хотя бы один тип, на который имеется ссылка отсутствует или поврежден.

Её решение:

Чтобы устранить эту проблему, найдите отсутствующую библиотеку объектов или найдите отсутствующие библиотеки типов. Чтобы сделать это, выполните следующие действия:

1. В Access 2007 откройте базу данных или открыть проект.

2. На вкладке Инструменты для баз данных и выберите в группе макросов Visual Basic .

3. В редакторе Visual Basic выберите в меню Сервис и выберите

пункт ссылки.

4. В диалоговом окне ссылки найдите библиотеку объектов или библиотеку типов, отображается следующее:

5. ОТСУТСТВУЕТ: ReferenceName

6. Щелкните, чтобы снять флажок рядом с библиотекой объектов или библиотеки типов, найденных на шаге 4.

Если известно расположение файла отсутствует объект библиотеки или местоположение отсутствует файл библиотеки типов, нажмите кнопку Обзор, чтобы найти файл библиотеки объектов или файл библиотеки типов.

1.5 Сформировать документацию согласно принятых стандартов созданного программной части информационной системы

Техническое задание на разрабатываемое программное средство оформляется в соответствии с ГОСТ 19.201-78 Единая система программной документации

Общие сведения.

Наименование работы.

Разработка АИС «Магазин бытовой техники и электроники».

Заказчик.

ООО «Все для дома».

Исполнитель: Телятникова Н.А

Основание для проведения работы.

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

Плановые сроки.

Начало: 20 января 2010 года, окончание 20 июня 2010 года.

Источники и порядок финансирования работы. Отсутствует.

Порядок оформления представления.

Сдача работы должна быть осуществлена не позднее 25 июня.

Исполнитель показывает пояснительную записку в письменном виде по проделанной работе и электронный вариант с обязательным приложением диаграмм IDEF0, IDEFX, алгоритмы работы ИС, ТЗ, руководство оператора.

Назначение и цели создания.

Назначение.

Предназначен для автоматизации процесса страхования и учета.

Задачи.

Ведет реестр клиентов, осуществляют генерацию заказов, генерирует отчеты.

Требования.

Требования к системе в целом.

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

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

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

Требования к видам обеспечения:

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

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

Требования к надежности системы.

1. Основная база данных должна содержать все основные таблицы, требование - максимальная надёжность.

2. При выводе данных с постраничной организацией, из базы данных должна выводиться только строки текущей страницы.

3. Поля ввода данных на страницах сайта должны быть защищены от попыток ввода злонамеренной информации.

4. При сбое в работе аппаратуры восстановление нормальной работы системы должно производиться после:

- перезагрузки операционной системы;

- запуска исполняемого файла системы;

5. При ошибках в работе аппаратных средств (кроме носителей данных и программ) восстановление функции системы возлагается на ОС.

6. При ошибках, связанных с программным обеспечением (ОС и драйверы устройств), восстановление работоспособности возлагается на ОС.

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

Требования по развитию и модернизации системы.

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

Для осуществления оперативного обновления клиентского программного обеспечения в системе должна быть предусмотрена подсистема автоматического обновления.

1.6 Описать технологию защиты данных используемой информационной системы

На предприятии Рыболовецкой артели (колхоз) им. 50 лет Октября используется антивирусная программа Kaspersky .

Защита от некорректного использования информационных ресурсов заключается в корректном функционировании программного обеспечения с позиции использования ресурсов вычислительной системы.

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

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

Их можно разделить на две группы:

- угрозы, реализация которых выполняется при постоянном участии человека;

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

Задачи по защите от угроз:

- запрещение несанкционированного доступа (НСД) к ресурсам вычислительных систем;

- невозможность несанкционированного использования компьютерных ресурсов при осуществлении доступа;

- своевременное обнаружение факта несанкционированных действий, устранение их причин и последствий.

Функции позволяют нам мгновенно проверить безопасность любого исполняемого файла на своем компьютере. Актуальная информация о репутации программы поступает в режиме реального времени из «облака».

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

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

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

1.7 Создание и администрирование существующего сайта предприятия

Сайт предприятия Рыболовецкой артели (колхоз) им. 50 лет Октября был разработан через программу 1С-Bitrix.

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

Основные возможности 1С-Bitrix:

- Управление структурой и контентом сайта;

- Публикация материалов;

- Создание форумов;

- Управление рекламой;

- Ведение статистики;

- Рассылка сообщений;

- Осуществление других операций.

Создание сайта 1С-Bitrix

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

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

Приступаем к созданию Admin , и ее инструкцию.

Первое, что нам надо сделать -- это создать отдельную подпапку. Назовём её дефолтно -- «admin». Наша админ-панель в будущем будет располагаться по адресу http://мой_сайт.ru/папка_где_лежит_скрипт/admin/ Вообще, называть папку именно «admin» вовсе не обязательно, можно назвать её как угодно.

Второе, что нам надо сделать -- это создать файл конфигурации админки. Для этого создаём в папке с дефолтным названием «admin» файл с не менее дефолтным именем -- «config.php». Вписываем в него следующее содержимое (Рисунок 1.10):

Рисунок 1.10 - Код файла «config.php».

Значения переменных adminlogin и adminpassw заменяем логином и паролем -- реквизитами доступа в будущую админку. В вышеуказанном примере логин -- «admin», пароль -- «12345».

Теперь создаём файл входа в Admin. Создаём новый файл в папке admin под названием «index.php», и заполняем его кодом следующего содержания (Рисунок 1.11):

Рисунок 1.11 - Код файла «index.php»

Теперь нужно написать скрипт выхода из Admin. Скрипт проверяет, выполнен ли вход и, если вход выполнен, производится выход. Создаём файл «admin_logout.php» и впихиваем в него следующий код (Рисунок 1.12):

Рисунок 1.12 - Код файла «admin_logout.php»

Admin создан, в неё можно зайти и выйти. Проверять это, пока не нужно т.к. ещё файла админки нету

Создаем файл «admin_main.php» открываем его и прописываем код (Рисунок 1.13):

Рисунок 1.13 - Код файла «admin_main.php»

И получаем выполненную Admin.

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

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

Самым главным преимуществом 1С-Bitrix, является возможность полной интеграции с базой данных 1С. Это позволяет загружать информацию один раз и дальше использовать ее для самых различных нужд (бух. отчетность, оформление продаж интернет-магазина, вывод данных о товаре на страницах сайта). Кроме того, также поддерживается обмен данными с Microsoft Office, OpenOffice, ActiveDirectory и прочими популярными офисными программами.

Единственным недостатком этой системы является ее платная основа. Но стоит потратить небольшие суммы на регулярные техническую поддержку и обновление программного обеспечения.

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



2. Технологическая часть

2.1 Создание Web-сайта на примере предприятия «Рыболовецкая артель (колхоз) имени 50 лет Октября»

Я создала сайт для предприятия Рыболовецкая артель (колхоз) им. 50 лет Октября «Рыба Дальнего Востока».

Для создания данного сайта я использовала сеточную систему в Bootstrap 3

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

Там можно, получите полное объяснение принципов работы системы, относящихся к ней медиа запросов и т.п.

Тот ряд Html элементов (например, анонсы статей на главной странице), который вы захотите позиционировать в сетке, нужно будет окружить контейнером (например, заключить в теги Div) и прописать для него класс .row (выглядеть открывающий тег в этом случае будет как <div class="row">).

Ну, а сами элементы внутри ряда мы сможем распределить по одной или сразу по нескольким типам сеток с помощью прописывания атрибута class со значением, например, .col-xs-цифра .

Нам нужно получить три равные по размеру колонки, то что нужно разделить 12 (размерность сетки в Bootstrap 3) на 3 (требуемое число колонок).

Значит для каждого Html элемента внутри ряда (это опять же могут быть контейнеры Div) нужно будет прописать одинаковые классы -- <div class="col-xs-4">. Если нужны колонки не равной ширины, то нужно будет просто соблюсти условие, при котором цифры после col-xs- во всех трех классах в сумме должны составлять 12 (например, 2-4-6).(Рисунок 2.1)

Рисунок 2.1 - Размер колонок

Далее, продолжаем прописывать в коде и уменьшая ширину окна браузера до значенийменьших 768 пикселей. (Рисунок 2.2)

Рисунок 2.2 - Код задаваемого размера окна браузера

2.2 Разработка интерфейса сайта

Для разработки сайта «Рыба Дальнего Востока», я делала следующие.

Просматривая исходный код сайта мы увидим тег Style добавленный в стили для визуального оформления макетов (отступы, цвета сеток и т.п.), которые особой смысловой нагрузки не несут. Если прокрутите исходный код вниз, то заметим такой вот блок (Рисунок 2.3):

Рисунок 2.3 - Код оформление макета

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

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

Дальше в исходном коде идет формирование первого ряда (Рисунок 2.4):

Рисунок 2.4 - Код формирования первого ряда кнопок

Это мастер-сетка, где скомбинированы все 3 сеточные системы вы это видно по атрибутам ячеек class="col-lg-4 col-md-1 col-sm-5 col-xs-5", в которых перечислены префиксы классов всех трех сеток.

Сам ряд, задавался с помощью помещения всех составляющих его элементов в контейнер с классом class="row".

Рисунок 2.5 - Пропорции ячеек

Ну и с помощью цифр после префиксов задаем пропорции для каждой из ячеек своего макета, в нужных 2 колонках -- «col-lg-4» «col-lg-4» «col-lg-4». (Рисунок 2.5)Тогда наш ряд будет представлять из себя 2 колонки равной ширины (по одной трети от общей ширины ряда) в «большой» сетке, ибо используется префикс col-lg.

Создадим ряд (строк) и ячеек с помощью классов Бутстрапа.

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

Если мы посмотрим исходный код файла index.html, то увидим, что в нем уже подключен Bootstrap и jquery.(рисунок 2.6).

Рисунок 2.6 - Исходный код файла index.html

А также, добавлен контент для имитации внешнего вида среднестатистической вебстраницы. Структура получится такая(Рисунок 2.7):

Рисунок 2.7 - Файл с веб-страницей

2.3 Функции созданного сайта

Открыв файл index.html в браузере мы увидим веб-страницу.

Бросается в глаза то, что все блоки на странице расположены друг под другом.

В исходном Html коде файла index.html я использовала директивы, чтобы показать границы предполагаемых мною рядов (строк), для которых использовала для настройки отображения колонок с использования каких-то сеточных систем Bootstrap. Рядов всего четыре -- header (шапка с названием сайта и логотипом), заголовок и описание страницы, содержательная часть и footer.

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

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

Теперь нам нужно будет добавить в файл index.html разметку Bootstrap, которая обозначит местоположение рядов. Для создания рядов, как вы помните, достаточно будет заключить все его содержимое в контейнер и прописать в нем класс class="row".

Использование разных сеток для создания колонок с контентом при разной ширине экрана.

И так, в Bootstrap 3 имеет место быть 12-ти колоночная сетка.

Для реализации задуманного нам опять же придется «обернуть» будущие ячейки в контейнер, которому мы пропишем классы из арсенала Bootstrap с нужными префиксами.

Берем среднюю сетку, как компромиссный вариант. В этом случае в контейнеры всех четырех ячеек нужно будет добавить класс «col-md-3»-<div class="col-md-3">.(Рисунок 2.8)

Рисунок 2.8 - Код ячейки

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

Так же в этой части сайта стоит скрипт всплывания контента из левой части экрана при заходе на страницу.

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

Footer сайта выполнен из картинки океана с копирайтом и контактными данными рыболовецкой артели.

В подвальной части сайта так же используется скрипт появления текста при переходе пользователя к данной части сайта.

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

Так же, целью производственной практики являлось:

- знакомство с реальной практической работой учреждения;

- развитие навыков самостоятельного решения проблем и задач, связанных с проблематикой, выбранной специализации;

- овладение методикой работы, применяемой в данном учреждении;

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

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

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



Список используемых источников

1. Аляев, Ю.А. Алгоритмизация на языки программирования Visual Basic,2012 г.

2. Иванова Г.С. Основы программирования: Учебник для вузов. - М.: Изд-во МГТУ им. Н.Э. Баумана, 2013г.

3. Кормен Т., Лейзерсон Ч., Ривест Р. Алгоритмы: построение и анализ. - М.: МЦНМО, 2012г.

4. Левитин В. Алгоритмы: введение в разработку и анализ. : Пер. с англ. - М. : Вильяме, 2012г.

5. Окулов С.М. Основы программирования. - 3-е изд. - М.: БИНОМ. Лаборатория знаний, 2013г.

6. Орлов С. Технологии разработки программного обеспечения. - СПб.: Питер, 2013г.

7. Сырецкий Г. Информатика. Фундаментальный курс. Основы информационной и вычислительной техники.: БХВ-Петербург, 2014г.

8. Информатика. Базовый курс. Учебник для Вузов/под ред. С.В. Симоновича, - СПб.: Питер, 2015г.

9. Симонович С. В., Евсеев Г.А., Практическая информатика, Учебное пособие. М.: АСТпресс,2012г.

10. П. Эйткен. Программирование на VISUAL BASIC 6/Пер. с англ. - К.: ДиаСофт,2012г.

11. Дунаев В. В. HTML, скрипты и стили. Спб.: БХВ - Петербург, 2011г.

12. Мэтью Д. HTML5. Разработка веб-приложений. М.: Рид Групп, 2012г.

13. Никсон Р. Создаем динамические веб-сайты с помощью PHP, MySQL и JavaScript. Спб.: Питер, 2011 - 496 с.

14. Михеева, Е.В. Информационные технологии в профессиональной

деятельности,2014г.

15. Михеева Е.В. Информационные технологии в профессиональной деятельности: Издательский центр «Академия», 2013г.

16. Поповский А.В. Информатика. Институт новых информационных технологий, 2012г.

17. под ред. С.В. Симоновича; рец.: Каф. Московского гос. технического ун-та им. Н.Э. Баумана, С.В. Калин: Информатика. - СПб.: Питер, 2015г.

18. под ред. С.В. Симоновича; рец.: Кафедра САПР Московского гос. технического ун-та им. Н.Э. Баумана, С.В. Калин: Информатика. - СПб.: Питер, 2013г.

19. П.Л. Салманов и др. ; В.И. Чернов и др.: Информатика. - М.: Дрофа, 2015г.

20. Родигин Л.А.: Базы данных для карманного персонального компьютера Pocket PC. - М.: КноРус, 2014г.

21. Брайан Сайлер, Джефф Спотс. Использование VisualBasic6.0. - СПб: Москва - СПб - Киев, 2014г.

22. Уткин В.Б.: Информационные системы в экономике. - М.: Академия, 2013г.

23. Филимонова Е.В.: Информационные технологии в профессиональной деятельности. - Ростов н/Д: Феникс, 2013г.

24. Алешин Л.И.: Информационные технологии. - М.: Литера, 2012г.

25. Архангельский А.Я.: Программирование в HTML - М.: Бином-Пресс, 2014г.

26. под ред. проф. А.Н. Романова, проф. Б.Е. Одинцова: Информационные системы в экономике - М.: Вузовский учебник, 2015г.

Размещено на Allbest.ru

...