ВСТУП

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

• 
  постачання свіжих та високосортних продуктів;
  
• 
  забезпечення вчасної поставки;
  
• 
  конкурентних цін і вигідних умов партнерства;
  
• 
  додаткових супутніх послуг;
  
• 
  маркетингової підтримки.
  

• 
  супровід і подальше вдосконалення розробленого раніше ПЗ;
  
• 
  розробка нового ПЗ, необхідного для роботи підрозділів компанії та захисту даних.
  

• 
  Здійснює розробку проектів ПЗ, побудова архітектури програмних систем.
  
• 
  Проводить аналіз інформації, що надходить, про збої в роботі програмного забезпечення, пов'язаних з помилками в ПЗ і вживає заходів до їх оперативного усунення.
  
• 
  Надає консультативну допомогу відділу впровадження з питань функціонування програмного забезпечення і технологій.
  
• 
  Згідно технічних завданнях, що надходять з відділу впровадження, здійснює доопрацювання і розробку нового програмного забезпечення.
  
• 
  Здійснює попереднє тестування нових версій ПЗ на правильність реалізації алгоритмів і відповідність технічним завданням.
  
• 
  Здійснює розробку документації з установки ПЗ і керівництва адміністратора.
  

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

• 
  верстка сторінок ресурсу;
  
• 
  стилізація сторінок ресурсу;
  
• 
  реалізація бізнес логіки ресурсу;
  
• 
  реалізація зберігання даних;
  
• 
  робота з аунтифікацією та захистом;
  
• 
  тестування створеного ПЗ;
  
• 
  налаштування і супровід серверного ПЗ;
  

• 
  створення бізнес логіки додатку;
  
• 
  реалізація оновлення та пошуку даних;
  
• 
  реалізація захисту веб-додатку;
  
• 
  написання API веб-додатку.
  

• 
  створення структури веб-документу;
  
• 
  стилізація веб-документу;
  
• 
  адаптація для різноманітних девайсів;
  
• 
  написання клієнтських скриптів.
  

• 
  Десять системних блоків Asus Mk31m з процесорами Intel Core i5-5301. Процесор Intel Core i5-5301належить до четвертого покоління (Haswell) лінійки Intel Core. Модуль оперативної пам'яті типу DIMM DDR III KVR1333D3N9 / 4G від компанії Kingston об'ємом 4 ГБ c частотою 1333 МГц і пропускною спроможністю 10.6 ГБ / с. Шість PCIe x1, чотири SATA-порту, 10 USB-портів. Цієї кількості масовим комп'ютерів вистачає. Тип видеокарты: GeForce GTX 7xx. Модель видеокарты: GeForce GTX 750 Ti. Объем памяти: 2 Гб.
  
• 
  Десять моніторів LG VX24AH. Робоча роздільна здатність складає 2560х1440 пікселів, співвідношення сторін 16: 9, та оснащений двома стереодинамиками.
  
• 
  Десять клавіатур LEA Combo MK520. Завдяки клавішах ввігнутої форми, повнорозмірній розкладці і підставці для зап'ясть клавіатура забезпечує природне положення рук користувача.
  
• 
  Десять мишей M175 WL (910-002778) Black. Бездротова миша з підтримкою технології Plug-and-Play. Безпровідна мережа є не менш надійно, ніж провідне, і забезпечує повну свободу рухів. Швидка передача даних здійснюється без затримок і переривань.
  

• 
  розробка власної площадки;
  
• 
  замовлення даної площадки в спеціалізованої фірми;
  
• 
  використання готових площадок.
  

• 
  чітке співпадіння з макетом (відхилення до 5 пікселів);
  
• 
  використання зрозумілих назв ідентифікаторів;
  
• 
  реалізація клієнтських скриптів;
  
• 
  максимально простий код, для зменшення обсягів програми;
  
• 
  створення кросбраузерної верстки;
  
• 
  створення адаптивної верстки;
  
• 
  вчасне виконання роботи;
  
• 
  коментування коду;
  
• 
  написання документації.
  

• 
  головна сторінка;
  
• 
  каталог;
  
• 
  категорія;
  
• 
  підкатегорія;
  
• 
  сторінка товару;
  
• 
  сторінка порівняння;
  
• 
  сторінка вподобаних;
  
• 
  корзина;
  
• 
  сторінка реєстрації;
  
• 
  сторінка авторизації;
  
• 
  особистий кабінет;
  
• 
  історія покупок.
  

• 
  smartTv від 1950рх. до 4000рх;
  
• 
  desktop від 1200рх. до 1950рх;
  
• 
  tablet від 768рх. до 1199рх;
  
• 
  phone від 320рх. до 767рх.
  

• 
  слайдери;
  
• 
  валідатори форм;
  
• 
  аjax сповіщення;
  
• 
  коментування товарів.
  

Рис. 4.2 – Зразок написання html розмітки

Паралельно зі створенням верски проводилась її стізація. Нижче наведено зразок коду стилізації для елементу html розмітки:

wrapper-descript-tovar . info {

//Вказуємо ідентифікатор елемента із html розмітки.

@include wrapperBlock(100%, 0, 0 15px);

//Надаємо елементу еластичної форми та вказуємо відступи по краям в 15 //пікселів.

@include flexbox;

//Вказуємо що всі внутрішні елементи мають бути розміщені в одну лінію.

@include flex-wrap(wrap);

//Зазначаємо що вразі великої кількості елементів вони можуть бути перенесені //на наступний рядок.

@include flex-direction(row);

//Зазначаємо що лінія по якій розміщуються елементи є горизонтальною

background: $background-gray;

//Здаємо колір фону, $background-gray – змінна.

border-top: 1px solid $gray-border;

//Вказуємо рамку по верхній границі елементу

border-bottom: 1px solid $gray-border;

//Вказуємо рамку по нижній границі елементу.

.kod {

//Вказуємо ідентифікатор елемента із html розмітки.

@include fontStyle(14px, $dark-gray, 0px 1px 0px #fff);

//Зазначаємо шрифт та розміри тексту.

span {

@include fontStyle(12px, $dark-gray, 1px 1px 2px #fff);

//Зазначаємо шрифт та розміри тексту.

text-transform: uppercase;

//Вказуємо що всі літери мають бути в верхньому регістрі.

margin-left: 15%;

//Задаємо відступ з лівого боку елемента, ширина якого буде рівна 15% ширина //даного елемента

}

//Закриваємо обраний селектор.

}



Рис. 4.3 – Зразок стилізаціїhtml розмітки

В результаті виконання роботи був створений повнофункціональний, адаптивний, кросбраузений інтерфейс сайту. Описаний вище код є

ВИСНОВКИ

ПЕРЕЛІК ПОСИЛАНЬ

1. 
   Информатика. Модуль 4. Программирование задач со списками и файлами. Объектно-ориентированное программирование / [Швайко И.Г., Прокоп Ю.В., Леоненко Л.Л., Северин М.В.] − Одеса: ОНАЗ, 2008. – 104 с.
   
2. 
   С++. Основи програмування. Теорія та практика: [підручник] / [О.Г. Трофименко, Ю.В. Прокоп, І.Г. Швайко та ін. ] − Одесса: Фенікс, 2010. – 544 с.
   
3. 
   Седжвик Р. Фундаментальные алгоритмы на С++ / Седжвик Р − М. Диа-Софт.,2001. – 688 с.
   
4. 
   Топп У. Структуры данных в С++ / У. Топп, У. Форд – М.: Бином, 2000. – 816 с.
   
5. 
   Вирт Н. Алгоритмы и структуры данных / Вирт Н. – М.: Мир, 1989. – 896 с.
   
6. 
   Архангельский А.Я. Программирование в С++ Builder 6 и 2006 / А.Я. Архангельский, М.А. Тагин − М.: Бином-Пресс, 2007. – 1184 с.
   
7. 
   Архангельский А.Я. Приемы программирования в С++ Builder 6 и 2006: вычислительные задачи, работа с документами / А.Я. Архангельский,
   

8. 
   Вирт Н. Систематическое программирование / Вирт Н. − М. Мир., 1976. – 182 с.
   
9. 
   Шамис В.А. С++ Builder 5. Техника визуального программирования / Шамис В.А. – М.: Нолидж, 2001. – 688 с.
   
10. 
    Лафоре Р. Объектно-ориентированное программирование в С++ / Лафоре Р – СПб.: Питер, 2003. – 928 с.
    
11. 
    Павловская Т.А. С++ Программирование на языке высокого уровня / Павловская Т.А. – СПб.: Питер, 2003. – 464 с.
    
12. 
    Лаптев В.В. С ++. Объектно-ориентированное программирование: Учебное пособие.- СПб.: Питер, 2008. – 464 с.: ил.
    

1. 
   Приклад html верстки (Гловна сторінка)
   

067 777 7777

068 777 7777

044 777 7777

пн-пт 9-20

сб-вс 9-17

Каталог

Сантехника

Ванны

Акриловые

Квариловые

Душевые системы

Душевые наборы

Верхний душ

Ручные душевые лейки

Гигиенический душ

Душевые панели

Держатели и шланговые соединения для душа

Шланги

Аксессуары для ванной комнаты

Полотенце держатели

Полочки

2. 
   Приклад стилізації html верстки (Гловна сторінка)
   

@import 'base';

@import '../components/products-block';

@import '../components/page-sort';

@import '../components/hexagons';

.main-selling {

padding: 1em 0 0px 0;

height: auto;

position: relative;

@include elementWidth(100%);

.view-selling-slider {

padding-bottom: 15px;

}

.selling-slide-wrapper {

position: relative;

box-sizing: border-box;

display: block;

color: $dark-gray;

margin: 0 auto;

box-sizing: border-box;

.name {

display: block;

@include elementWidth(100%);

padding: 0px;

box-sizing: border-box;

text-align: center;

text-transform: uppercase;

}

.image-wrapper {

@include elementWidth(100%);

height: 220px;

float: right;

text-align: center;

margin: .5em 0;

margin-bottom: 1em;

.image {

max-width: 100%;

max-height: 100%;

display: block;

margin: auto;

display: inline-block;

vertical-align: middle;

}

&:before {

content: '';

display: inline-block;

vertical-align: middle;

height: 100%;

}

}

.about_product {

font-size: .7em;

line-height: 200%;

.characteristic {

color: darken($background-gray, 20%);

text-transform: lowercase;

margin-right: 1em;

}

.value {

color: $dark-gray;

text-transform: uppercase;

}

}

.buy {

@include elementHeight(46px);

position: relative;

width: 100%;

@include flexbox();

@include flex-direction(row);

@include justify-content(space-between);

.price {

font-size: 1.5em;

display: inline-block;

width: 100%;

}

.btn {

display: inline-block;

position: static;

right: 0px;

}

&::before {

content: '';

vertical-align: middle;

@include elementHeight(100%);

display: none;

}

}

}

.view-selling-slider {

padding-bottom: 0;

@include flexbox();

@include flex-wrap(wrap);

}

.main-selling-next-arrow,

.main-selling-previous-arrow {

background-color: transparent;

border: none;

background-image: url("#{$url-img}bg_arrows3.png");

background-size: contain;

background-position: center center;

background-repeat: no-repeat;

width: 43px;

height: 50px;

position: absolute;

bottom: 10px;

z-index: 250;

cursor: pointer;

-webkit-transition: opacity 0.5s;

transition: opacity 0.5s;

opacity: .9;

font: normal normal normal 14px/1 FontAwesome;

font-size: inherit;

text-rendering: auto;

-webkit-font-smoothing: antialiased;

&::before {

position: absolute;

opacity: 1;

font-size: 30px;

line-height: 0;

}

&:hover {

opacity: 1;

}

}

.main-selling-next-arrow {

right: 15px;

&::before {

content: '\f105';

right: .5em;

Приклад з JavaScript коду (Слайдер)

$('.noveltySlider').length != 0) {

$('.noveltySlider .block').each(function () {

var index = $(this).attr('data-index');

if (find(slick_clone, index) == false) {

slick_clone[slick_clone.length] = index;

$('.noveltySlider .slider.number' + index).slick({

slidesToShow: 1,

slidesToScroll: 1,

swipe: false,

fade: true,

asNavFor: '.noveltySlider .icons.number' + index,

prevArrow: $('.noveltySlider .block.number' + index + ' .navigation .prev-icon'),

nextArrow: $('.noveltySlider .block.number' + index + ' .navigation .next-icon'),

adaptiveHeight: true

});

$('.noveltySlider .icons.number' + index).slick({

slidesToShow: 4,

slidesToScroll: 1,

asNavFor: '.noveltySlider .slider.number' + index,

arrows: false,

focusOnSelect: true,

responsive: [

{

breakpoint: 1600,

settings: {

slidesToShow: 3,

slidesToScroll: 1

}

},

{

breakpoint: 991,

settings: {

slidesToShow: 2,

slidesToScroll: 1

}

}

]

});

}

});

}