Что такое DOCPAD?
Мода на генераторы статических сайтов не пройдет никогда, и вот одним из таких инструментов для управления и создания сайтов является DocPad. Он создан на основе Node.js и Express.js.Описывать установку, пожалуй не буду, перейду сразу к докам для начинающих.
С чего начинается создание сайта с помощью DocPad?
Ну конечно же с папки в которой все будет хранится! )))Ну и как предлагает нам официальная документация (для стартового проекта используем рекомендуемое имя), назовем папку my-new-website, что по-ангельски означает "мой-новый-вэбсайт"!
Открываем командную строку Node.JS и топаем в папку с помощью команды:
cd путь_к_папке/my-new-website
Запускаем docpad командной
docpad run
Процесс пошел (в первый раз при запуске вам нужно будет согласится с предлагаемым множеством букав) и вам выпадет список предлагаемых заготовок-скелетонов. Нам нужен пустой (вводим цифирь 20)! Так что выбираем No Skeleton. Ну и ввод!
Побежит кучка строчек и все это дело в конце "зависнет" мигающим курсором.
Сие означает что наш сайт сгенерировался в первый раз и ожидает нас по адресу http://localhost:9778/
Откроем его в браузере.. а там пока пусто.. что и следовало ожидать. Ну не совсем пусто..Тупо - текст "Not Found", что одно и тоже.
Вообщем процесс работает и отслеживает все дела. Чтобы прервать и вывести его из забытия давим CTRL-C и соглашаемся с предложением об амине.
И что дальше?
После того, как мы выбрали No Skeleton, товарищ docpad создал в нашей папке проекта кучу своих подпапок по стандартуНас интересует папочка src - там будут храниться закрома Родины. А сейчас там внутри три папки: documents, files и layouts.
Давайте создадим первую страницу сайта!
Для этого в папке documents создаем пустой файл под названием index.html и напхаем в него обычного html-ного содержимого:
Welcome!
Welcome to My Website!<html> <head> <title>Welcome! | My Website</title> </head> <body> <h1>Welcome!</h1> <p>Welcome to My Website!</p> </body> </html
Теперь топаем в нашу командную строку и заново запускаем docpad run!
Открываем заветный http://localhost:9778/
Ну и видим:
Welcome!
Welcome to My Website!
И в чем прикол? Может без всей этой пурги можно было такой файлик создать, да открыть в хроме... Технологии однако.. Вот дальше и будет интереснее!
Продолжение банкета. Шаблоны для ленивых.
Для того, чтобы не расслабляться, авторы предлагают создать нам еще одну страницу - About.html
Ну послушаемся и пройдет в папку documents, где и создадим файл about.html
Напихаем в него чего-нить символичного вроде:
<html> <head> <title>About Me | My Website</title> </head> <body> <h1>About Me</h1> <p>I like long walks on the beach. <strong>Plus I rock at DocPad!</strong></p> </body> </html>
About Me
I like long walks on the beach. Plus I rock at DocPad!Кто не в теме - там про прогулки по пляжу и крутого перца, рулящего Docpad-ом. ))
Вообщем имеем две страницы - index и about.
Открываем адресок
http://localhost:9778/about.html
А там опять нихрена... Ну так надо docpad остановить и запустить заново )))
И тогда нам явится что-то вроде:
About Me I like long walks on the beach. Plus I rock at DocPad!
Ну.. давайте еще десять страниц создадим? ))) Шучу ))
Дальше товарищи создатели справедливо пишут - крутые перцы черную работу перекладывают на коней! Не будь конем!
И вот тут они предлагают пользоваться шаблонами.
Топаем в папку layouts и создаем файл default.html.eco
И не пугайтесь такого количества точек. Это значит что файл сначала обработается шаблонизатором eco ))
Создатели тупо предлагают наполнить сей файл содержимым следующего рода:
<%= @document.title %>
<%- @content %> <html> <head> <title><%= @document.title %> | My Website</title> </head> <body> <h1><%= @document.title %></h1> <%- @content %> </body> </html>И что это? Пока не знаем.. идем дальше!
Далее, открываем наш старый файлик index.html и стираем всю ботву, что там писали. Взамен берем перо и пишем:
--- title: "Welcome!" layout: "default" isPage: true --- Welcome to My Website!
Каково? А это еще не все. Открываем еще и about.html и пишем вместо старых требухов:
--- title: "About Me" layout: "default" isPage: true --- I like long walks on the beach. Plus I rock at DocPad!
Вот оно чо, Михалыч! А чо это, собственно?
Ну я не знаю, как вы, а я вижу, что зазря копипастил тучу текста )
Теперь можно просто указать в файле title, файл шаблона, дать понять, что это страница (isPage-true), ну и после --- накалякать собственно содержимое, которое в файле шаблона будет выведено вместо <%- @content %>
Ого! Технология, однако! Это ж куча времени теперь сэкономиться )))
Но это только вступление.. Продолжение будет. А теперь срочно в библиотеку и читать что-нить от головы.
Комментариев нет:
Отправить комментарий