- •Занятие 1. "Быстрый старт: организация рабочего места веб-разработчика. Создание и запуск первого проекта"
- •Установка и настройка пакета Denwer
- •Установка среды разработки Eclipse для php
- •Создание и запуск веб-проекта php
- •Добавление php кода к веб-проекту
- •Занятие 2. "Технология верстки веб-страницы: изучениеHtml"
- •Предназначение html иCss
- •Вспомним основные тегиHtml
- •Правила записиHtml-кода
- •Занятие 3. "Технология верстки веб-страницы: изучениеCss"
- •Несколько слов оCss
- •Основы css
- •Посмотрим на результат в браузере (см. Рис. 3.5)
- •Селекторы css
- •Селектор по идентификатору:
- •Селектор по классу:
- •Основной способ подключения css
- •Основные csSстили
- •Из списка стандартных цветов.
- •При помощи указания компонентов цвета: rgb, в этом случае перед компонентами цвета ставится символ "#" – решетка.
- •Проект "Винни-Пух и компания"
- •Технология создания крупного проекта
- •Реализация клиентской части на Java
- •Title - указывается название колонки;
- •Галочка editable - включает/отключает возможность редактирования ячеек колонки пользователем;
- •Галочка resizable - включает/отключает возможность изменения ширины колонки пользователем (см. Рис. Тот же).
- •Обмен данными с сайтом
- •Занятие 5. "Начало создания серверной части проекта"Винни-Пух и компания"
- •Создание серверной части проекта на php
- •Кодировка проектаUtf-8
- •Обработка get-запроса вPhp
- •Работа с MySql изPhp
- •Занятие 6. "Завершение создания php-скрипта для приема данных от клиентской части на Java"
- •ФормированиеSql-запросов из php
- •Занятие 7. "Верстка основного каркаса сайта интернет-магазина"
- •Методики верстки
- •При большой вложенности таблиц друг в друга снижается скорость загрузки страницы браузером.
- •Индексация страницы поисковой системой происходит сложнее, что влияет на оптимизацию сайта для поисковых систем(сайт хуже находится).
- •При открытии страницы в старых браузерах страница может отображаться не корректно –старый браузер не поддерживает современные css- свойства.
- •Типы верстки
- •Верстка основного каркаса сайта
- •Изучение верстки других сайтов
- •Занятие 8. "Создание главного меню и раздела описания товаров"
- •Создание таблицы описания товаров
- •Формирование верхнего горизонтального меню
- •Создание белой прямоугольной области
- •Получение описания товаров из базы данных и вывод на веб-страницу
- •Занятие 9 "Создание левой и правой боковой части страницы"
- •Создание таблицы дляHtml-разметки
- •Программирование пунктов меню
- •Получение html-разметки из базы данных
- •Создание левой боковой части страницы
- •Использование Flash на веб-странице
- •Создание правой боковой части страницы
- •Занятие 10. "ПодключениеJavaScript. Создание разделов сайта: Главная и Контакты"
- •Реализация раздела сайта: Главная
- •Реализация раздела сайта: Контакты
- •Немного оJavaScript
- •Создание эффекта подмены изображения
- •Создание эффекта появления изображения
- •Занятие 11. "Создание раздела сайта: Заказать"
- •Создание верхней части раздела
- •Отправка и получение данных с веб-страницы
- •Использование файлов для хранения данных
- •Открытие файла для записи/чтения;
- •Запись/Чтение;
- •Закрытие файла.
- •Создание функции для получения и сохранения данных
- •Создание таблицы и формы отправки данных
- •Создание тегов для верхней части таблицы с заголовком.
- •Создание функции формирования десяти строк таблицы с остатками.
- •В заключение внешний вид подкорректируем при помощи css.
- •Занятие 12. "Отладка проекта"
- •Кросс-браузерная отладка
- •Посмотреть сайт на различных разрешениях экрана. Для этого необходимо изменять текущее разрешение экрана.
- •/*Вертикальное выравнивание по верхней части*/
- •Создание дополнительных настроек в тегахHead
- •Перенос сайта на веб-сервер
- •Выгрузка базы данных с исходного компьютера.
- •Загрузка базы данных на веб-сервер.
- •Проверка взаимодействия с клиентской частью наJava
- •Заключение
- •Постановка задачи(логическое описание проекта):
- •Техническое описание проекта:
Проверка взаимодействия с клиентской частью наJava
Осталось выполнить последний заключительный шаг –проверить взаимодействие с клиентской частью наJava. В среде разработки Eclipseдля JavaSE,откроем проект под названием puh. Перейдем в обработчик события кнопки Выполнить (см. рис. 12.34):
Рис. 12.34
В обработчике события нужно найти строку:
// Формируем GET-запрос для отправки
String str = "http://puh/tovar.php"+makeGet();
В этой строке указан путь к файлу tovar.phpдля обмена данными. Учитывая, что у нас новое доменное имя, поменяем путь:
// Формируем GET-запрос для отправки
String str = "http://доменное_имя_вашего_сайта/tovar.php"+makeGet();
Запустим приложениеJavaи одновременно откроем сайт, перейдем в раздел Заказать. В клиентском приложении введем количество поступления: Мед: 10, Прополис: -10.Нажмем на кнопку Выполнить(клиентская часть), а на сайте - Заказать для обновления остатков. Данные по остаткам должны совпадать (см. рис. 12.35). Обратите внимание, что при введении отрицательного количества - можно фиксировать отгрузку товаров!
Рис. 12.35
После проверки взаимодействия нужно выполнить перекомпиляцию JAR-архива. Подробное описание этой процедуры можно посмотреть в конце четвертого занятия данного методического пособия.
Итог занятия:На этом занятии мы:• завершили создание проекта;• поговорили о проблемах кросс-браузерности сайта;• рассмотрели схему переноса готового сайта на веб-сервер.
Заключение
Мы поздравляем вас с прохождением третьего модуля курса "Основы программирования на языке Java"!
На этом курсе, кромеJava в мы использовали и другие языки программирования: PHPи JavaScript.
Теперь вы поднялись на более высокую ступень в разработке программного обеспечения. Реализовать проект, состоящий из нескольких частей и использующий сразу несколько технологий,сложнее, чем написать небольшое приложение.
Мы создали распределенный проект, состоящий из клиентской и серверной частей.
На курсе вы познакомились с основами веб-разработки.Этих знаний будет достаточно, чтобы начать создавать веб-сайты и дальше самостоятельно изучать эту большую и интересную область программирования.Сложно представить сегодня программирование без интернета. ЯзыкJavaявляется языком программирования, ориентированным на интернет. Приложение Javaможно легко связать с веб-сайтом.
Именно это мы с вами и выполнили, связав клиентскую часть наJava с серверной частью на PHP.
Умение разбивать задачу на части, производить отладку программного кода очень важны при создании любого приложения. Работая над отладкой Java, PHP, JavaScript, SQL, HTML, CSS вы закалили свой дух, чтобы перейти к самостоятельной реализации проектов на языке Java. После работы над проектом с использованием сразу нескольких технологий –вы почувствуете, что писать программы для настольных операционных систем на Java–стало легче!
Схема проекта"Винни-Пух и компания"
Постановка задачи(логическое описание проекта):
Организация " Винни-Пух и компания " занимается продажей продуктов пчеловодства. В ее магазине можно приобрести следующие товары: мед, прополис,пчелиный воск, цветочная пыльца и др.
Владельцы компании решили организовать продажу товаров через интернет-магазин и обратились в Клуб программистов за помощью.
Автоматизируем деятельность компании по следующей схеме.
На сайте магазина будет отображена информация о товаре и его количестве на складе в настоящий момент.
Если клиент решил заказать этот товар, он нажимает на кнопку"Заказать". После оформления заказа количество (остаток) товара на складе изменяется, меняется и информация на сайте.
Например,клиента заинтересовал "Мед".
На сайте отображается количество товара – 5 бочонков.
Клиент заказал 3 бочонка.После оформления заказа на сайте должна отобразиться информация:
5-3=2 бочонка –именно столько осталось на складе после оформления заказа клиента.
Т.е. в данной ситуации мы из начального остатка ВЫЧИТАЕМ количество заказанного товара.
Такая операция называется РАСХОДОМ ИЛИ РЕАЛИЗАЦИЕЙ ТОВАРА СО СКЛАДА или просто РАСХОДОМ/РЕАЛИЗАЦИЕЙ.
Запасы товаров на складе регулярно пополняются. Информацию о количестве поступившего товара вводят сотрудники компании при помощи специальной программы. После ввода количества поступившего товара меняется информация на сайте об остатках товара.
Например, на складе осталось 2 бочонка меда.
Сотрудник компании вводит информацию о пополнении запаса товара –пришло еще 10 бочонков. Тогда на сайте должна отобразиться информация:
2+10=12 бочонков.
В этом случае мы к начальному количеству ПРИБАВЛЯЕМ количество поступившего товара.
Такая операция называется ПРИХОДОМ ИЛИ ПОСТУПЛЕНИЕМ ТОВАРА НА СКЛАД или просто ПРИХОДОМ/ПОСТУПЛЕНИЕМ.
Поступление и реализацию часто называют ДВИЖЕНИЕМ ТОВАРОВ.
Т.о., нам нужно будет создать три компоненты:
программу для ввода информации о количестве поступившего товара;
базу данных, где будет храниться информация о товарах компании и об их остатках на складе;
сайт интернет-магазина компании.
Между этими компонентами должен быть реализован обмен информации.
