| # | Название видеоурока | Видео / Тесты | Решило | Рейтинг | Доступ |
|---|---|---|---|---|---|
| 1 |
HTML - Шахматные фигуры
|
без видео 7 тестов |
|||
|
Мы начинаем ФОТОКУРС по созданию игры "шахматы". Здесь не будет видео, только картинки. На первом уроке мы выведем все фигуры на экран. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 15 мин. [Показать отчёт] Научился: узнал что уже предопределены изображения шахматных фигур Сложности: набирать без спец.программы Комментарии: всё отлично, идём дальше |
|||||
| 2 |
CSS - Шахматная доска
|
без видео 4 теста |
|||
|
На этом уроке мы создадим файл стиля chess.css для доски и белых/чёрных клеток. Далее создадим HTML для всей доски. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: слабоват я в HTML Сложности: найти ошибку Комментарии: проверил по скринам, вроде всё правильно (то что видно). но не отображается сетка, показывается белый квадрат с черной рамкой, а внутри пусто. может кто подскажет в чем проблема? |
|||||
| 3 |
HTML - Фигуры на Доске
|
без видео 2 теста |
|||
|
На этом уроке мы совместим первые два урока и разместим все фигуры на доске.
Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 1 час. 00 мин. [Показать отчёт] Научился: разобрался почему в прошлом уроке у меня была проблема. Спасибо 10157. Кирилл Лебедев. Но ещё оказывается нужно было раскопировать эти три строчки, чтобы было заполнение по всему полю, а не только первые три квадратика. Сложности: разбираемси по-маленьку Комментарии: не всё показано на скрине, так что приходится додумывать самостоятельно, что помогает лучше понять материал |
|||||
| 4 | PHP - Установка EasyPHP |
без видео 1 тест |
|||
|
Далее для работы нам потребуется технология PHP. Для этого можно скачать и установить EasyPHP. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: проходили Сложности: проходили Комментарии: проходили |
|||||
| 5 | PHP - Запуск скрипта |
без видео 2 теста |
|||
|
На этом уроке мы запустим первый скрипт на РНР.
Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: команду echo Сложности: всё пока легко Комментарии: -- |
|||||
| 6 | PHP - Циклы для клеток |
без видео 1 тест |
|||
|
На этом уроке мы добавим щепотку РНР - для вывода клеток будем использовать два вложенных цикла. Функция ord() возвращает номер буквы/символа в таблице ASCII. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 1 час. 00 мин. [Показать отчёт] Научился: как вставлять код php Сложности: не разобрался в ошибке Комментарии: в отчете Артема http://www.videosharp.info/6925/checking/chess=849 узнал что надо добавить localhost/ но так и не смог его добавить, точнее после того как добавлял показывалось пустое окно. Если это действительно надо сделать, то надо как-то осветить это в уроке, не все мы тут разбираемся в PHP... p.s. ошибку так и не исправил(( |
|||||
| 7 | PHP - Массив для фигур |
без видео 2 теста |
|||
|
На этом уроке мы создадим массив шахматной доски. И запишем в него начальное расположение фигур. Каждая фигура обозначается одной буквой, согласно нотации Форсайта — Эдвардса. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 1 час. 00 мин. [Показать отчёт] Научился: запустить IIS сервер и на нем запустить PHP Сложности: разобраться что необходимо Комментарии: тяжеловато самому разбираться, пришлось подключить коллег |
|||||
| 8 | PHP - Превращение букв |
без видео 1 тест |
|||
|
На этом уроке мы напишем функцию GetFigureHTML, которая будет переводить буквы фигур в HTML-коды. Можно написать длинный и правильный код, либо короткий-хакерский вариант. При выводе доски на экран нужно добавить вызов созданной функции. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: писать функции в коде на языке PHP Сложности: не сложным, а интересным, когда ошибку сделал и найти её, поискал, исправил, и теперь всё работает)) Комментарии: непривычный формат в фото, без видео, практически без объяснений почему сделали так а не иначе, очень похоже как нашел исходник чужой большой программы, вроде всё вместе работает, но самому сделать такую будет тяжело, только под копирку |
|||||
| 9 | HTML5 - Поднятие фигур |
без видео 1 тест |
|||
|
На этом уроке мы подготовим фигуры к переносу. Для этого нам понадобятся возможности HTML 5.0 и JavaScript. (1) Для переноса фигур нужно их поместить в отдельный блок span. (2) Каждому span-блоку нужно выдать разрешение на перенос draggable. (3) Каждому блоку нужно присвоить уникальный id-код, мы будем использовать координаты клеток. После этого вы сможете хватать фигуру и таскать её по полю. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: как можно легко обернуть каждый элемент Сложности: понять для чего это нужно, пока не понял, посмотрим что будет после реализации хода Комментарии: --- |
|||||
| 10 | JavaScript - Тронул? Коди! |
без видео 2 теста |
|||
|
На этом уроке мы напишем функцию drag(), которая вызывается в самом начале переноса фигуры. Цель этой функции - сохранить id-код span-объекта, в котором фигура расположена. Эта информация нам понадобится при опускании фигуры. Внимательно прочитайте все комментарии и протестируйте работу программы. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: запускать скрипты Сложности: всё понятно Комментарии: а что означают точки в предложении, какие-то разделители. но что они разделяют и зачем... в PHP коде, например: id ='$x$y'>" . getFigureHTML(@$board (вырвано из контекста) |
|||||
| 11 | JavaScript - Посадку давай! |
без видео 1 тест |
|||
|
Карлсон заметил, что во время таскания фигуры по доске всё время виден значок «стоянка запрещена». Так происходит потому, что ни одна площадка не разрешает посадку нашей фигуре. Чтобы разрешить посадку - нужно написать функцию allowDrop() и вызывать её в атрибуте ondragover каждого divа на шахматной доске. Теперь посадка будет разрешена, правда, пока ещё приземляться мы не умеем. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: не понял что мы сделали, ничего не поменялось(( Сложности: сложным не было, просто непонятно для чего, как бы сказали "а", но не сказали "б" Комментарии: может быть в дальнейшем станет понятнее... |
|||||
| 12 | JavaScript - Завершение хода |
без видео 1 тест |
|||
|
На этом уроке мы завершим посадку фигуры на новую клетку шахматной доски. При отпускании фигуры происходит событие ondrop, в атрибуте которого мы сделаем вызов функции drop(). Эта функция принимает событие event. Нам опять нужно отменить действие по умолчанию и принять полученный объект. Помните, мы сохраняли id-код span'a, фигуру которого мы переносим? Теперь мы получаем этот код, чтобы получить доступ к span элементу. На этот раз в event.target находится площадка приземления, мы используем её метод appendChild() для размещения объекта. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: побольше узнал о javascript Сложности: пока всё понятно Комментарии: идём дальше... |
|||||
| 13 | JavaScript - Я тебя съем! |
1 тест |
|||
|
На этом уроке мы реализуем съедание фигур. Для этого перед посадкой нам нужно проверить, есть ли кто-нибудь на аэродроме? hasChildNodes()? используем функцию removeChild() для его удаления. Используем 0-ой номер для доступа к первому и единственному элементу. ЗАДАНИЕ: Поставить мат и сделать скриншот. Останется ещё один баг - если мы попробуем приземлить фигуру на исходную клетку - она самоуничтожится. Чтобы избежать этого добавим проверку - если на площадке точно такая же фигура - то ничего делать не нужно. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: делать доп.проверки. Сложности: пока не очень понимаю логику, надо тренироваться Комментарии: всё понятно |
|||||
| 14 | ФИНАЛЬНЫЙ УРОК |
без видео 1 тест |
|||
|
Мы с вами закончили создание нано Шахмат. Для создания доски мы использовали следующие технологии: HTML - для отображения доски CSS - для оформления клеток PHP - для формирования повторяющихся строк JavaScript - для перемещения фигур. Напиши в отчёте, понравился ли тебе этот миникурс, что нового ты узнал, как ты ещё будешь дорабатывать свои шахматы. Задание: Записать видео, на котором разыграть матовую комбинацию. Какой курс ты будешь проходить следующим? Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: внедрять в html страницы код javascript, php конечно для самостоятельной практики маловато, поэтому надо искать ещё варианты обучения Сложности: не описана возможность запуска кода php на неподготовленной системе, искал сам Комментарии: отличный курс для начала обучения javascript и php в программу можно написать проверку на правильность ходов, но самостоятельно я это не смогу реализовать, знаний маловато. следующий курс это "Боты сапера" |
|||||
| 15 | VIP. PHP - Создание картинки |
без видео 1 тест |
|||
|
На этом уроке мы воспользуемся GD библиотекой для создания картинки и рисования линий в РНР скрипте. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: закрашивать области, рисовать линии Сложности: понимать как это всё работает, а ещё больше не совершить ошибки, тупо переписывая, никакой автоподстановки, никакого отладчика...C# круче)) Комментарии: надо будет отложить, чтобы потом перерешать |
|||||
| 16 | VIP. PAINT - Координаты отрезков |
без видео 1 тест |
|||
|
На этом уроке мы поработаем с программой MS Paint. Запустите mspaint, можете включить сетку (в старых версиях не доступно). Используя инструмент «Линия» нарисовать 2 или 3 буквы своих инициалов. Выписать координаты каждой линии, для этого наведите мышку на конец каждой линии и выпишите последовательно координаты всех отрезков. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 30 мин. [Показать отчёт] Научился: получение координат из paint Сложности: --- Комментарии: если анализировать вашу первую строку, то координаты конца первой линии и начала второй в разных местах, почему? |
|||||
| 17 | VIP. PHP - Рисуем буквы |
без видео 1 тест |
|||
|
На этом уроке мы нарисуем ваши инициалы в РНР. Отчёт отправил: 6452. Кирилл Шмойлов Выполнено за 16 мин. [Показать отчёт] Научился: рисовать линии в PHP Сложности: добавить свой цвет(ещё и подобрать) Комментарии: вот и подошел курс к завершению, курс открыл больше вопросов, но это и замечательно, значит есть впереди что изучать, разбираться, внедрять. Спасибо за курс. Необычный формат, заставляет отойти от рамок "обычности" что тоже развивает мышление, думается не так как обычно, развивает гибкость ума. У меня на работе есть мужчина, так он обычный правша, но мышь кладет с левой стороны, что тоже заставляет работать оба полушария мозга, попробуйте ;-) |
|||||
| Итого: 17 видеоуроков |
02 мин. 30 тестов |
18 чел. | |||
| Финалисты: Сергей Соколов, Новопашин Владимир, Алексей В., Иван Воронин, Кирилл Шмойлов, Tekashnik, Елена, Константин, Максим Лапшинов, Дмитрий, Николай Денисов, Yefim, Andrew, Слава, Dmitry Sinitsin, Tom, Александр Шлома, MaxB . | |||||