Інтерактивність! Що? І як?, Різне, Інтернет-технології, статті

www.citforum.ru

Спочатку була мережа, потім з’явилася електронна пошта, і люди стали листуватися. Їм захотілося розповісти про себе, поділитися інформацією – з’явилася всесвітня павутина (WWW). Але статичні сторінки – Це всього навсього статичні сторінки … і тоді з’явилася інтерактивність!

Спочатку визначимося з термінологією. Під інтерактивними сторінками я розумію такі, в яких реалізований інтерфейс з будь-якою програмою, що виконується на стороні сервера. Форма на web-сторінці приймає від користувача якісь дані, і броузер передає їх web-серверу, який і запускає потрібну програму. Програма після того, як відпрацювала запит, повертає web-серверу результат, а вже він формує на лету HTML-сторінку і відсилає її назад броузеру.

Отже, що ж ми можемо зробити, використовуючи інтерактивність? Найвідоміше, що спадає на думку – це лічильники, гостьові книги, формоотправітелі, он-лайн магазини, інтерфейси до баз даних. Практично, можна зробити все, що завгодно. Все залежить тільки від уміння програміста.

Як це здійснюється технічно? А от як – на стороні сервера ми розміщаємо потрібні програми, бази даних, .. і конфігуруємо web-сервер таким чином, щоб він зміг передавати запити користувачів з мережі обробній програмі і отримувати від неї результат. Робиться це за допомогою протоколу CGI – Common Gateway Interface (що по-російськи звучить як “загальний шлюзовий інтерфейс”). CGI – це набір правил, по яких сервер передає запит програмі. Будь-яка програма, написана таким чином, щоб задовольняти цим вимогам, зможе використовуватися на Web-сервері.

Мова програмування, на якому пишеться програма, великого значення не має, і може бути використаний будь-який. Найбільш популярною мовою програмування, використовуваним для написання нескладних програм, слід визнати PERL – мова, спочатку розроблений для написання звітів і ідеально підійшов для нескладних CGI-програм. Текст мови на PERL прийнято називати скриптом (не плутати з JavaScript – програма на PERL виконується на стороні сервера, в той час як JavaScript – на стороні клієнта). Мова є інтерпретують, тобто аналізують текст програми в процесі виконання. Для роботи PERL на web-сервері повинен бути встановлений і правильно сконфигурирован відповідний інтерпретатор.

Таким чином, інтерактивні сторінки можна розділити на дві частини: форма і програма. У формі нам потрібно правильно описати всі елементи інтерфейсу та вказати шлях до виконуваної програмі. Як бачите, все не так вже й складно. А що робити, якщо Ви не програміст, а Вам потрібна нескладна програма? В цьому випадку можна скористатися архівом готових скриптів, більшість з яких безкоштовні. Всі типові задачі давно вже вирішені і налагоджені. Це гостьові книги, лічильники, листи розсилок і т.п. Потрібно просто знайти потрібну й уважно прочитати опис до неї. Після цього залишається тільки правильно розмістити елементи у формі і вказати специфічні параметри для даного скрипта. Більш складні програми вже доводиться писати програмістам, які мають достатній досвід для цього.

Відправлення форми поштою

Давайте розберемо типовий приклад – відправлення форми поштою. Для цього ми скористаємося готовою програмою з архіву Matt Wright, Призначеної для відсилання вмісту форми поштою – FormMail. Цей скрипт потрібно сконфигурировать і розмістити на web-сервері в спеціальному каталозі, де розташовуються CGI-програми. Зазвичай він називається cgi-bin (для впевненості проконсультуйтеся з вашим провайдером – Надає він послуги з розміщення CGI-скриптів, і як називається каталог для розміщення скриптів). А на сторінці – описати форму. Таким чином, нам потрібно підготувати два файли: створити HTML-форму і сконфигурировать Perl-скрипт під наші потреби.

Створення форми

Почнемо, мабуть, з форми. Опис форми буде полягати між тегами <form> і </form> і містити в собі елементи форми. Ми зробимо самий мінімалістичний варіант формоотправітеля, який буде містити наступні поля: ім’я, електронна адреса, текст повідомлення. HTML-код нашої сторінки виглядає наступним чином:

<html>   Форма для відправки поштою </ title> </ head>
<body>
<form name="Request" action="/cgi-bin/formmail.pl" method="post">
<input type=hidden name="recipient" value="yourmail@domain.com"> <input type=hidden name="subject" value="Запрос інформаціі"> Ваше Ім'я: <br> <input type=text name="Імя"> <br>
E-mail: <br>
<input type=text name="E-mail"><br> Повідомлення: <br> <textarea name="Сообщеніе"> </ textarea> <br> <br> <input type=submit value="Отослать"> <input type=reset value="Очістіть">
</form>
</body>
</html></pre>
<p>Трохи роз’яснень з вищенаведеного коду. Зверніть увагу на параметр <b>action</b> в тегу <b><form></b> – Він визначає адресу нашого скрипта (. Pl – стандартне розширення для програм, написаних на PERL). Перші елементи у формі – це спеціальні приховані поля для передачі інформації скрипту: поле <b>recipient</b> визначає e-mail, на який ми хочемо відіслати вміст форми, а поле <b>subject</b> – Рядок, який буде з’являтися як “тема листа”. Далі йде вже опис безпосередньо полів форми. Їх може бути скільки завгодно, але кожне з них повинне мати ім’я (параметр <b>name</b> в тегу <b><input></b>), Тому що результатом роботи скрипта буде лист, в якому кожен рядок складається з пари значень: імені поля і його вмісту. І закінчується форма двома кнопками, що служать для відправлення повідомлення (submit) і очищення форми до початкового стану (reset).</p>
<p>Конфігурування скрипта</p>
<p>Тепер сконфігуріруем скрипт. Опускаючи несуттєві для нас деталі, лістинг нашого скрипта можна представити так:</p>
<pre>#!/usr/bin/perl
$mailprog = '/usr/lib/sendmail';
@referers = ('www.cherry-design.spb.ru','195.5.155.48');
 # Тут розташовується код скрипта.</pre>
<p>В даному випадку вся конфігурація зведеться до установки IP-адреси комп’ютера, на якому розташований web-сервер, і конфігурування шляхів для програм <b>perl</b> і <b>sendmail</b>. Перша – безпосередньо інтерпретатор мови PERL, а друга – це програма, до якої звертається скрипт, і яка здійснює посилку повідомлення поштою. Адреса розташування PERL-інтерпретатора завжди задається першим рядком в скрипті, і в даному випадку програма доступна за адресою <b>/usr/bin/perl</b>. Розташування програми sendmail задається другим рядком у нашому лістингу. І, нарешті, третя сходинка задає ім’я і IP-адреса web-сервера (для прикладу я вказав параметри мого сайту).</p>
<p>Ось, практично, і все. Наш скрипт залишилося тільки переписати в каталог. Але тут є одна тонкість – справа в тому, що скрипт буде розташовуватися на UNIX-машині, а текст в UNIX-форматі має одна відмінність від Windows: кінець рядка в UNIX позначається символом повернення каретки <CR>, а в Windows – парою символів: переклад рядка <LF> і повернення каретки <CR>. Якщо переписати такий файл по FTP в режимі BINARY, то скрипт працювати не буде! При копіюванні скрипта на web-сервер потрібно встановити режим ASCII, що автоматично перетворює кінці рядків до UNIX-формату.</p>
<p>У скрипта FormMail є багато додаткових і дуже зручних можливостей. Наприклад – переадресація сторінки з підтвердженням відправлення повідомлення або перевірка правильності заповнення полів. Якщо Вас це зацікавить, то сходіть на сторінку Метта, і там Ви знайдете не тільки опис FormMail, а й багато інших корисних скриптів. У цій статті я хотів просто показати, як застосовувати готові скрипти для потреб свого сайту, і тому опустив всі несуттєві деталі й зупинився на розгляді практичних питань.</p>

<div class="ad-top2">
<!-- Top article #956715 -->
<script>(function(e){var t="DIV_DA_"+e+"_"+parseInt(Math.random()*1e3); document.write('<div id="'+t+'" class="directadvert-block directadvert-block-'+e+'"></div>'); if("undefined"===typeof loaded_blocks_directadvert){loaded_blocks_directadvert=[]; function n(){var e=loaded_blocks_directadvert.shift(); var t=e.adp_id; var r=e.div; var i=document.createElement("script"); i.type="text/javascript"; i.async=true; i.charset="windows-1251"; i.src="//code.directadvert.ru/data/"+t+".js?async=1&div="+r+"&t="+Math.random(); var s=document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]; s.appendChild(i); var o=setInterval(function(){if(document.getElementById(r).innerHTML&&loaded_blocks_directadvert.length){n(); clearInterval(o)}},50)} setTimeout(n)}loaded_blocks_directadvert.push({adp_id:e,div:t})})(956715)</script>
</div>

<div style="float:right">
<div class="yashare-auto-init" data-yashareL10n="ua" data-yashareType="icon" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,moikrug,gplus"></div>
</div>
<h4>Схожі статті:</h4><ul><li><a href="http://easy-code.com.ua/2010/12/sekreti-stvorennya-velikogo-spisku-rozsilki/" title="Секрети створення великого списку розсилки.">Секрети створення великого списку розсилки.</a> (0)</li><li><a href="http://easy-code.com.ua/2010/12/meta-tegi-optimizaciya/" title="Мета - теги, оптимізація.">Мета - теги, оптимізація.</a> (0)</li><li><a href="http://easy-code.com.ua/2010/10/link-popularity-indeks-cituvannya/" title="Link Popularity (індекс цитування).">Link Popularity (індекс цитування).</a> (0)</li><li><a href="http://easy-code.com.ua/2010/11/veb-2-0-privertaye-vse-bilshe-uvagi/" title="Веб 2.0 привертає все більше уваги.">Веб 2.0 привертає все більше уваги.</a> (0)</li><li><a href="http://easy-code.com.ua/2010/12/page-rank-v-google/" title="Page Rank в Google.">Page Rank в Google.</a> (0)</li><li><a href="http://easy-code.com.ua/2010/12/zagolovki-title-ta-%d1%97x-optimizaciya/" title="Заголовки (TITLE) та їх оптимізація.">Заголовки (TITLE) та їх оптимізація.</a> (0)</li><li><a href="http://easy-code.com.ua/2010/11/slovo-na-zaxist-yandeksa/" title="Слово на захист Яндекса">Слово на захист Яндекса</a> (0)</li></ul>	<!--for paginate posts-->
		
	<hr/>
	
	<p><strong><em>
    Сподобалася стаття? Ви можете <a href="#comments"> залишити відгук </a> або <a href = "http://easy-code.com.ua/feed/" > підписатися на RSS </a>, щоб автоматично отримувати інформацію про нові статтях.
	    </em></strong></p>

	<!--Post Meta-->
	<div class="post-meta">
	<strong>Метки: </strong><a href="http://easy-code.com.ua/tag/potribno/" rel="tag">потрібно</a>, <a href="http://easy-code.com.ua/tag/programa/" rel="tag">програма</a>, <a href="http://easy-code.com.ua/tag/programi/" rel="tag">програми</a>, <a href="http://easy-code.com.ua/tag/skripta/" rel="tag">скрипта</a>, <a href="http://easy-code.com.ua/tag/storinki/" rel="tag">сторінки</a>, <a href="http://easy-code.com.ua/tag/storoni/" rel="tag">сторони</a>, <a href="http://easy-code.com.ua/tag/tilki/" rel="tag">тільки</a><br />	<strong>Рубрики:</strong> <a href="http://easy-code.com.ua/category/rizne/" rel="category tag">Різне</a>	</div>		
		
	<!--include comments template-->
	<div id="comments-wrap">

	<p>Коментарів поки що немає.</p>

<!--
<p><a href="http://easy-code.com.ua/2012/08/interaktivnist-shho-i-yak-rizne-internet-texnologi%d1%97-statti/feed/">RSS-стрічка коментарів.</a> 
	<a href="http://easy-code.com.ua/2012/08/interaktivnist-shho-i-yak-rizne-internet-texnologi%d1%97-statti/trackback/" rel="trackback">Адреса для трекбек</a>
</p>
-->

<h3 class="postcomment">Ваш отзыв</h3>

<p>Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <code><a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> </code></p>

<form action="http://easy-code.com.ua/wp-comments-post.php" method="post" id="commentform">
	
	<p>
	<input type="text" name="author" id="author" class="textarea" value="" size="28" tabindex="1" />
	<label for="author">Им'я</label> *	</p>

	<p>
	<input type="text" name="email" id="email" value="" size="28" tabindex="2" />
	<label for="email">E-mail</label> *	</p>

	<p>
	<input type="text" name="url" id="url" value="" size="28" tabindex="3" />
	<label for="url">Сайт</label>
	</p>

	
	<p>
	<label for="comment">Повідомлення</label>
	<br />
	<textarea name="comment" id="comment" cols="60" rows="10" tabindex="4"></textarea>
	</p>

	<p>
	<input name="submit" id="submit" type="submit" tabindex="5" value="відправити" />
	<input type="hidden" name="comment_post_ID" value="17479" />
	<input type="hidden" name="redirect_to" value="/2012/08/interaktivnist-shho-i-yak-rizne-internet-texnologi%D1%97-statti/" />
	</p>
	<p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="b3a293f2dd" /></p><p style="display: none;"><input type="hidden" id="ak_js" name="ak_js" value="105"/></p></form>

</div>
	
	<!--do not delete-->
		
	
<!--single.php end-->
</div>

<!--include sidebar-->
<!--sidebar.php-->
<div id="sidebar">

	<div class="sidebar-rss">
	<h3>Подписка через RSS</h3>
	<p><a href="http://easy-code.com.ua/feed/"><img src="http://easy-code.com.ua/wp-content/themes/elegantblue/images/rss.jpg" alt="Подписка на RSS" ></img></a>Якщо вам сподобалася інформація на нашому сайті, ви можете підписатися на оновлення через RSS.</p>
	</div>
<BR>


<div class="something">
<a href='http://easy-code.com.ua/tag/download/' class='tag-link-563 tag-link-position-1' title='648 topics' style='font-size: 12.328358208955pt;'>Download</a>
<a href='http://easy-code.com.ua/tag/microsoft/' class='tag-link-66 tag-link-position-2' title='772 topics' style='font-size: 13.522388059701pt;'>Microsoft</a>
<a href='http://easy-code.com.ua/tag/oracle/' class='tag-link-18322 tag-link-position-3' title='357 topics' style='font-size: 8.4477611940299pt;'>Oracle</a>
<a href='http://easy-code.com.ua/tag/windows/' class='tag-link-18319 tag-link-position-4' title='1,383 topics' style='font-size: 17.253731343284pt;'>Windows</a>
<a href='http://easy-code.com.ua/tag/internet/' class='tag-link-132 tag-link-position-5' title='366 topics' style='font-size: 8.5970149253731pt;'>Інтернет</a>
<a href='http://easy-code.com.ua/tag/merezhi/' class='tag-link-143 tag-link-position-6' title='438 topics' style='font-size: 9.7910447761194pt;'>Мережі</a>
<a href='http://easy-code.com.ua/tag/modeli/' class='tag-link-530 tag-link-position-7' title='360 topics' style='font-size: 8.5970149253731pt;'>моделі</a>
<a href='http://easy-code.com.ua/tag/mozhete/' class='tag-link-3 tag-link-position-8' title='569 topics' style='font-size: 11.582089552239pt;'>можете</a>
<a href='http://easy-code.com.ua/tag/mozhut/' class='tag-link-311 tag-link-position-9' title='384 topics' style='font-size: 9.044776119403pt;'>можуть</a>
<a href='http://easy-code.com.ua/tag/dopomogoyu/' class='tag-link-273 tag-link-position-10' title='731 topics' style='font-size: 13.074626865672pt;'>допомогою</a>
<a href='http://easy-code.com.ua/tag/dozvolyaye/' class='tag-link-542 tag-link-position-11' title='664 topics' style='font-size: 12.477611940299pt;'>дозволяє</a>
<a href='http://easy-code.com.ua/tag/kompani%d1%97/' class='tag-link-554 tag-link-position-12' title='546 topics' style='font-size: 11.283582089552pt;'>компанії</a>
<a href='http://easy-code.com.ua/tag/koristuvachiv/' class='tag-link-137 tag-link-position-13' title='337 topics' style='font-size: 8.1492537313433pt;'>користувачів</a>
<a href='http://easy-code.com.ua/tag/potribno/' class='tag-link-18 tag-link-position-14' title='566 topics' style='font-size: 11.432835820896pt;'>потрібно</a>
<a href='http://easy-code.com.ua/tag/programi/' class='tag-link-387 tag-link-position-15' title='1,547 topics' style='font-size: 18pt;'>програми</a>
<a href='http://easy-code.com.ua/tag/prosto/' class='tag-link-99 tag-link-position-16' title='328 topics' style='font-size: 8pt;'>просто</a>
<a href='http://easy-code.com.ua/tag/vikoristannya/' class='tag-link-690 tag-link-position-17' title='368 topics' style='font-size: 8.7462686567164pt;'>використання</a>
<a href='http://easy-code.com.ua/tag/vikoristovuvati/' class='tag-link-890 tag-link-position-18' title='427 topics' style='font-size: 9.6417910447761pt;'>використовувати</a>
<a href='http://easy-code.com.ua/tag/znachennya/' class='tag-link-198 tag-link-position-19' title='1,003 topics' style='font-size: 15.164179104478pt;'>значення</a>
<a href='http://easy-code.com.ua/tag/roboti/' class='tag-link-123 tag-link-position-20' title='1,104 topics' style='font-size: 15.761194029851pt;'>роботи</a>
<a href='http://easy-code.com.ua/tag/rozrobki/' class='tag-link-1235 tag-link-position-21' title='328 topics' style='font-size: 8pt;'>розробки</a>
<a href='http://easy-code.com.ua/tag/sistemi/' class='tag-link-476 tag-link-position-22' title='1,131 topics' style='font-size: 15.910447761194pt;'>системи</a>
<a href='http://easy-code.com.ua/tag/upravlinnya/' class='tag-link-556 tag-link-position-23' title='760 topics' style='font-size: 13.373134328358pt;'>управління</a>
<a href='http://easy-code.com.ua/tag/server/' class='tag-link-197 tag-link-position-24' title='650 topics' style='font-size: 12.328358208955pt;'>сервер</a>
<a href='http://easy-code.com.ua/tag/stvorennya/' class='tag-link-439 tag-link-position-25' title='460 topics' style='font-size: 10.089552238806pt;'>створення</a>
<a href='http://easy-code.com.ua/tag/tablici/' class='tag-link-496 tag-link-position-26' title='469 topics' style='font-size: 10.238805970149pt;'>таблиці</a>
<a href='http://easy-code.com.ua/tag/tilki/' class='tag-link-6 tag-link-position-27' title='1,295 topics' style='font-size: 16.805970149254pt;'>тільки</a>
<a href='http://easy-code.com.ua/tag/fajliv/' class='tag-link-293 tag-link-position-28' title='410 topics' style='font-size: 9.3432835820896pt;'>файлів</a>
<a href='http://easy-code.com.ua/tag/funkci%d1%97/' class='tag-link-218 tag-link-position-29' title='439 topics' style='font-size: 9.7910447761194pt;'>функції</a>
<a href='http://easy-code.com.ua/tag/informaci%d1%97/' class='tag-link-24 tag-link-position-30' title='368 topics' style='font-size: 8.7462686567164pt;'>інформації</a></div>
	<!--l_sidebar.php-->
<div id="l_sidebar">
	<ul>
<br>
	<!--favorite posts-->
	<li>
    	<h2>Нове на сайті</h2>
        <ul>
        	<li><a href='http://easy-code.com.ua/2015/11/keruyuchi-klavishi-i-menyu-informix/'>Керуючі клавіші і меню INFORMIХ</a></li>
	<li><a href='http://easy-code.com.ua/2015/10/vipushheno-reliz-fastreport-fmx/'>Випущено реліз FastReport FMX</a></li>
	<li><a href='http://easy-code.com.ua/2015/10/oracle/'>Oracle</a></li>
	<li><a href='http://easy-code.com.ua/2015/09/func-hgi-35i-vertolit-z-keruvannyam-vid-iphone/'>Func HGI-35i: вертоліт з керуванням від iPhone</a></li>
	<li><a href='http://easy-code.com.ua/2015/08/faq-po-grafiku-i-animaciyu-dlya-web/'>FAQ по графіку і анімацію для Web</a></li>
	<li><a href='http://easy-code.com.ua/2015/07/funkciya-viznachennya-kilkosti-robochix-dniv/'>Функція визначення кількості робочих днів</a></li>
	<li><a href='http://easy-code.com.ua/2015/07/inshi-mozhlivosti-obyednannya-fajliv/'>Інші можливості об’єднання файлів</a></li>
	<li><a href='http://easy-code.com.ua/2015/07/oglyad-navushnikiv-z-aktivnim-shumozaglushennyam-asus-nc1/'>Огляд навушників з активним шумозаглушенням ASUS NC1</a></li>
	<li><a href='http://easy-code.com.ua/2015/06/net-service-oriented-architecture-soa/'>.NET: Service Oriented Architecture (SOA)</a></li>
	<li><a href='http://easy-code.com.ua/2015/06/oglyad-behold-betab-7004/'>Огляд Behold BeTAB 7004</a></li>
        </ul>
	</li>
	<li>
    	<h2>Реклама</h2>
        <ul>
<div class="adcontentcen1">
<!-- Sidebar 160x600 #956693 -->
<script>(function(e){var t="DIV_DA_"+e+"_"+parseInt(Math.random()*1e3); document.write('<div id="'+t+'" class="directadvert-block directadvert-block-'+e+'"></div>'); if("undefined"===typeof loaded_blocks_directadvert){loaded_blocks_directadvert=[]; function n(){var e=loaded_blocks_directadvert.shift(); var t=e.adp_id; var r=e.div; var i=document.createElement("script"); i.type="text/javascript"; i.async=true; i.charset="windows-1251"; i.src="//code.directadvert.ru/data/"+t+".js?async=1&div="+r+"&t="+Math.random(); var s=document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]; s.appendChild(i); var o=setInterval(function(){if(document.getElementById(r).innerHTML&&loaded_blocks_directadvert.length){n(); clearInterval(o)}},50)} setTimeout(n)}loaded_blocks_directadvert.push({adp_id:e,div:t})})(956693)</script>
</div>

        </ul>
	</li>

	
	</ul>
</div>
<!--l_sidebar.php end-->	<!--r_sidebar.php-->
<div id="r_sidebar">
	<ul>

<br>
<li>
<h2>Популярне</h2>
<ul>
<!-- 2017-08-20 18:55:04 -->
<li><a href="http://easy-code.com.ua/2011/04/avtomatizaciya-biznes-procesiv-svitle-majbutnye-vitchiznyanix-kompanij/">Автоматизація бізнес-процесів – світле майбутнє вітчизняних компаній (13)</a></li>
<li><a href="http://easy-code.com.ua/2011/01/riznovidi-printeriv-zvichajni-ta-nezvichajni-printeri/">Різновиди принтерів. Звичайні та незвичайні принтери (6)</a></li>
<li><a href="http://easy-code.com.ua/2010/11/velika-kognitivna-revolyuciya/">Велика когнітивна революція (9)</a></li>
<li><a href="http://easy-code.com.ua/2012/08/nalashtuvannya-ekrannix-zastavok-v-windows-7-za-dopomogoyu-reyestru-windows-operacijni-sistemi-statti/">Налаштування екранних заставок в Windows 7 за допомогою реєстру, Windows, Операційні системи, статті (15)</a></li>
<li><a href="http://easy-code.com.ua/2011/01/recenzuvannya-dokumentiv-u-word/">Рецензування документів у Word (10)</a></li>
<li><a href="http://easy-code.com.ua/2012/08/suputnikovij-internet-ta-telebachennya-na-noutbuci-za-dopomogoyu-prof-dvb-s-1100-usb-gadzheti-oglyadi/">Супутниковий інтернет та телебачення на ноутбуці за допомогою Prof DVB-S 1100 USB, Гаджети, огляди (13)</a></li>
<li><a href="http://easy-code.com.ua/2014/11/pereklad-pdf-dokumentiv-za-dopomogoyu-google-translate/">Переклад PDF-документів за допомогою Google Translate (10)</a></li>
<li><a href="http://easy-code.com.ua/2014/07/kalkulyator-teplotexnichnij-rozraxunok/">Калькулятор «Теплотехнічний розрахунок» (19)</a></li>
<li><a href="http://easy-code.com.ua/2012/06/formatuvannya-abzaciv-u-word-2010-ms-office-programni-kerivnictva-statti/">Форматування абзаців у Word 2010, MS Office, Програмні керівництва, статті (31)</a></li>
<li><a href="http://easy-code.com.ua/2012/08/gibernaciya-son-i-gibridnij-splyachij-rezhim-v-windows-7-pitannya-i-vidpovidi-windows-operacijni-sistemi-statti/">Гібернація, сон і гібридний сплячий режим в Windows 7 – питання і відповіді, Windows, Операційні системи, статті (11)</a></li>
<li><a href="http://easy-code.com.ua/2011/02/ustanovka-movnix-paketiv-windows-7-vruchnu/">Установка мовних пакетів Windows 7 вручну (9)</a></li>
<li><a href="http://easy-code.com.ua/2011/03/serverni-operacijni-sistemi-providnix-virobnikiv/">Серверні операційні системи провідних виробників (9)</a></li>
<li><a href="http://easy-code.com.ua/2011/10/suputnikovij-internet-bez-tarilki-efirne-cifrove-movlennya-za-standartom-dvb-t-gadzheti-oglyadi/">Супутниковий інтернет без тарілки – ефірне цифрове мовлення за стандартом DVB-T, Гаджети, огляди (8)</a></li>
<li><a href="http://easy-code.com.ua/2012/09/uroki-photoshop-yak-pokrashhiti-foto-znyate-na-mobilnik-fotoobroblennya-programi-dlya-roboti-z-grafikoyu-programni-kerivnictva-statti/">Уроки Photoshop: Як покращити фото зняте на мобільник, фотооброблення, Програми для роботи з графікою, Програмні керівництва, статті (10)</a></li>
<!-- 2017-08-20 18:55:04 --></ul>
</li>


	</ul>
</div>
<!--r_sidebar.php end-->

</div>
<!--sidebar.php end--><!--include footer-->
</div>
<div id="footer">
<p>
При використанні матеріалів даного сайту пряме і явне посилання на сайт <a href="http://www.easy-code.com.ua/"> www.easy-code.com.ua </a> є обов'язковим.
</p>
<!--footer.php-->
<div id="footer-wrap">
<noindex>
<!--LiveInternet counter--><script type="text/javascript"><!--
document.write("<a href='http://www.liveinternet.ru/click' "+
"target=_blank><img src='//counter.yadro.ru/hit?t19.6;r"+
escape(document.referrer)+((typeof(screen)=="undefined")?"":
";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?
screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+
";"+Math.random()+
"' alt='' title='LiveInternet: показано число просмотров за 24"+
" часа, посетителей за 24 часа и за сегодня' "+
"border='0' width='88' height='31'><\/a>")
//--></script><!--/LiveInternet-->
<!-- Yandex.Metrika counter -->
<div style="display:none;"><script type="text/javascript">
(function(w, c) {
    (w[c] = w[c] || []).push(function() {
        try {
            w.yaCounter10604395 = new Ya.Metrika({id:10604395, enableAll: true});
        }
        catch(e) { }
    });
})(window, "yandex_metrika_callbacks");
</script></div>
<script src="//mc.yandex.ru/metrika/watch.js" type="text/javascript" defer="defer"></script>
<noscript><div><img src="//mc.yandex.ru/watch/10604395" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->

<script type="text/javascript" src="//yandex.st/share/share.js"
charset="utf-8"></script>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {lang: 'ru'}
</script>
</noindex>
<BR><strong>ЕasyСode</strong>	

                 
<!--necessary-->
<script type='text/javascript' src='http://easy-code.com.ua/wp-content/plugins/akismet/_inc/form.js?ver=3.3'></script>
<script type='text/javascript' src='http://easy-code.com.ua/wp-includes/js/wp-embed.min.js?ver=4.7.5'></script>
<script type='text/javascript' src='http://easy-code.com.ua/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='http://easy-code.com.ua/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script>
<script type='text/javascript' src='http://easy-code.com.ua/wp-content/plugins/easy-fancybox/fancybox/jquery.fancybox-1.3.8.min.js?ver=1.5.8.2'></script>
<script type='text/javascript' src='http://easy-code.com.ua/wp-content/plugins/easy-fancybox/js/jquery.easing.min.js?ver=1.3.2'></script>
<script type='text/javascript' src='http://easy-code.com.ua/wp-content/plugins/easy-fancybox/js/jquery.mousewheel.min.js?ver=3.1.12'></script>
<script type="text/javascript">
jQuery(document).on('ready post-load', function(){ jQuery('.nofancybox,a.pin-it-button,a[href*="pinterest.com/pin/create/button"]').addClass('nolightbox'); });
jQuery(document).on('ready post-load',easy_fancybox_handler);
jQuery(document).on('ready',easy_fancybox_auto);</script>
</div>
</div>
<div class="soc-buttons">
<div  class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="vkontakte,facebook,twitter,odnoklassniki,moimir,gplus" data-yashareTheme="counter"></div>
</div>
<script>!window.jQuery && document.write('<script src="http://yastatic.net/jquery/2.1.3/jquery.min.js"><\/script>');</script>
<script src="http://easy-code.com.ua/wp-content/themes/elegantblue/js/jquery.hc-sticky.min.js"></script>
<script>
jQuery(document).ready(function($){
$('.soc-buttons').hcSticky({
    top: 25,
    bottomEnd: 90,
    wrapperClassName: 'sidebar-sticky2',
    noContainer: false
});
});
</script>
<script type="text/javascript" src="//yastatic.net/share/share.js" charset="utf-8"></script>
</body>
</html>