Гораздо проще и доступнее использовать любой хостинг с доступом к сайту по SFTP. Неважно, какой именно: shared, vps или cloud.
Конкретно для нашей задачи, чтобы сделать рабочее окружение максимально одинаковым и доступным для всех участников обучения, мы будем использовать бесплатный аккаунт на MODXCloud и 30 дневную пробную версию IDE PhpStorm.
Регистрация и настройка MODXCloud
Тут все проще некуда. Регистрируемся, заходим, создаём облако.
Настройка PhpStorm
Причины, по которым я выбрал именно PhpStorm описаны в отдельной заметке, так же есть кое-что про настройку. Честно скажу, информация уже устарела и сейчас я использую более простые способы работы, без монтирования директорий.Итак, скачиваем и устанавливаем PhpStorm. Скорее всего, вам потребуется загрузить еще и Java 7, он сам должен об этом сказать.
Мы получаем пробную версию без ограничения функциональности, на 30 дней. Этого вполне достаточно, чтобы пройти весь курс и определиться, нужно ли покупать эту прекрасную IDE, или стоит поискать бесплатные аналоги. Лично я купил её на прошлой новогодней распродаже, кажется, за $25. Надеюсь, и в этом году нас всех порадуют — ибо нужно продлять лицензию =)
Запускаем IDE, создаём новый проект Sendex.
Для оформления я использую тему Twilight со шрифтами Ubuntu Mono, почти все настройки по умолчанию. Стиль оформления кода стандартный, с одним изменением — настоящая, а не smart, табуляция. Древний холивар «табы vs пробелы» я решил для себя просто — табы.
Дальше мы настраиваем связь с сервером. Это один из самых важных моментов в дальнейшей работе. Выбираем в меню: Tools → Deployment → Configuration, добавляем новый сервер и вбиваем данные от MODXCloud:
Если видим слово successfully, значит все хорошо.
С этого момента мы уже можем спокойно работать с файлами и директориями на сервере. Для этого нужно найти вкладку Remote host справа и кликнуть. В директории www лежит наш сайт, в котором можно создать директорию Sendex.
Теперь второй важный момент — нам нужно настроить синхронизацию между удалённой директорией Sendex и локальным проектом. Это делается там же, в настройках Deployment, вкладка Mapping:
Создаём в проекте файл test.php и копируем туда код для проверки:
<?php
// Подключаем
define('MODX_API_MODE', true);
require '../index.php';
// Включаем обработку ошибок
$modx->getService('error','error.modError');
$modx->setLogLevel(modX::LOG_LEVEL_INFO);
$modx->setLogTarget(XPDO_CLI_MODE ? 'ECHO' : 'HTML');
echo '<pre>';
print_r($modx->config);Теперь нужно синхронизировать проект с удалённым сервером при помощи контекстного меню. Сразу после выгрузки файла мы можем его запускать на сервере по ссылке c2263.paas2.ams.modxcloud.com/Sendex/test.php
Как видите, мы уже работаем с ядром MODX из этого файла, который находится у нас в проекте и синхронизируется с удалённой директорией.
Одна загвоздка — в редакторе всё как-то некрасиво выглядит и ругается на undefined variable 'modx':
Это оттого, что PhpStorm не знает MODX из коробки, и нам нужно подключить его в проект. Тогда IDE проиндексирует файлы и научится понимать объявленные переменные и их методы.
Нужно скачать последнюю версию MODX Revolution с официального сайта, распаковать куда-то на вашем компьютере и подключить в проект через контекстное меню External Libraries в окошке файлов проекта:
Обратите внимание, что после подключения MODX в проект, мы видим все его методы при наборе — волшебный PhpStorm начинает нам их подсказывать.
Более того, по методам и переменным можно переходить, просто нажав на них Ctrl+B.
Вот, видео из старой заметки, тут все понятно:
Заключение
Итак, мы создали хостинг, создали проект, настроили IDE и синхронизацию файлов. Правильное рабочее окружение — очень важно, от него зависит комфорт и удовольствие при разработке.На следующем занятии мы склонируем modExtra из репозитория и разберем его структуру.
← Следующая заметка
Разбор структуры компонента, зачем нужны assets, core и _build
Разбор структуры компонента, зачем нужны assets, core и _build
Предыдущая заметка →
Вводное занятие
Вводное занятие
Ну и коммитить нам пока нечего, это будет позже.
Просто у меня на счету было 135 руб. вроде, сейчас их нет...)
Это же не счет, а поддержка меня и моего сайта. Тебе вернуть эти 135 рублей, скажи куда?
К тому же, ограничение в iptables нужно ставить на production сервере, а не на dev. А еще есть виртуальные машины и локальные серверы.
Я вот себе даже на Mac OS X поднял nginx + php5-fpm и переписал скрипты добавления\ удаления сайтов — отлично работают.
Надо бы потестить на досуге.Это виртуальная машина, значит? Ну тут тогда другие сложности: энергопотребление и невозможность выполянять скрипты из IDE на сервере. Я в последнее время очень полюбил пакеты собирать хоткеем.Но все равно скачал и посмотрю на досуге, спасибо!
Саму конфигурацию можно хранить в гите и все кто будут разрабатывать будут делать это в таком же окружении.
По поводу энергопотребления, gfxCardStatus говорит что видео остается интегрированным после старта. Ну и субъективно разница во времени работы не чувствуется, когда запущенно или нет
Спасибо за наводку, уже поставил, но пока некогда погонять.
Собственно вопрос — сильно ли отличаются WEB и PHP штормы, что для фронтенда подойдет больше, и стоит ли заморачиваться с ними, или остаться на том, что есть и, в перспективе, на LightTable переехать когда его до ума доведут. Ну и если кто расскажет как он окружение организует — тоже буду весьма признателен.
Ну и до кучи — как там сейчас дела в линукс обстоят для фронтенда? Я когда-то давно году в 2003-2008 сидел на Debian, потом как-то не сложилось, но всегда хотелось назад, и вот думаю, может обратно вернуться? Глянул, большая половина инструментов под линукс есть. Отговорите или наоборот)
Ну и честно говоря, я не вижу каких-то мега особенностей. Тот же PhpStorm отлично редактирует CSS, Javascript и выгружает на сервер — мне больше ничего не нужно.
В Linux уже давно всё хорошо, если он не глючит на твоём железе. У меня вот на ноутбуках подгонял. Но зато все нормальные IDE там давно работают, так как написаны на мультиплатформенной Java.
Сейчас я рассортирую операционки для работы так:
— GNU/Linux
— Mac OS X
— Windows
А для развлечений вот так:
— Mac OS X
— GNU/Linux
— Windows
Ну и Mac стоит денег, а Linux — нет. Так что пробуй, смотри, авось понравится!
Ps еще вроде лучше чтобы npm был а не apt, или не принципиально?
Ubuntu для любителей всего новенького и не особо стабильного, или Mint — для консерваторов.
Я бы взял для работы Mint.
1. все зависит от того каким шронт эндом ты занимаешься, если это только jQuery то он отлично определяет функции во всех ide от jetbrains и вообще каких то проблем нет. Но вот как дело доходит до angular, backbone, ember все уже не так хорошо. К примеру мне так и не удалось заставить pycharm корректно обрабатывать все контроллеры ангулара и выводить их в автодополнении, а вот в вебшторме все отлично работает из коробки
2. простые скрипты на любом языке отлично обрабатываются в вебшторм, но как дело доходит какихто сложных специфичных функций все плохо. Чтото типо дебага, тестирования просто неудобно проводить.
3. всеже вебшторм расчитан на разработку веб приложений на js и бекенда на nodejs. Как бы то не было и сколько плагинов не ставь это его основная функция
Еще хочу сказать что я склоняюсь к версии что нужно использовать 2 ide, так как тупо не люблю тратить много времени на настройку рабочего места. Гораздо комфортней, чтобы все работало сразу и быстро.
Ну и продукты jetbrains можно использовать в виде беты (EAP), тогда можно долго не покупать лицензии
Ну а в своих дополнениях у меня табы. Так что, не расстраивайся.
Есть модикс облако, есть вебшторм с настроенным автоматическим деплоем + watcher LESS, самих less файлов много, они инклюдятся в main.less, тот компилится в main.css.
В страницы подключена cssrefresh.js — смотрит не изменился ли main.css на сервере и при необходимости перезагружает стили.
И вот тут загвоздка — после редактирования например footer.less — он тут же заливается на сервер, хотя на него мне по большей части все равно — мне нужен main.css — который в это же время прекрасно собирается но никуда почему-то не заливается, и если его принудительно загрузить — все замечательно. Но вот грузить в ручную — ну совсем уж не то)
То есть проблема в том, что автоматом заливает только файл который редактировал игнорируя main.less и main.css которые тоже изменились и их нужно залить в первую очередь.
Подскажите как победить??
То есть, когда ты редактируешь footer.less и он обновляется на сервере, MinifyX это увидит, и сгенерирует новый css с уникальным именем — cssrefresh.js не нужен.
Ошибки компиляции смотреть в системном журнале. Less файлы указываются в &cssSources.
Компилит все замечательно, но вот обновлять не хочет если поменялся файл.
Вызывал кешированым, некешированым, с разными комбинациями forceUpdate — все равно пока f5 не пнешь — не летит. В консоли и журнале тишина и спокойствие. В настройках компонента тоже ничего такого на первый взгляд нет. Документация этот момент тоже не прояснила.
Вызов на всякий
Ход мыслей верный (в чем я сильно сомневаюсь, только математически объяснить не могу))) или вообще нужно в другую сторону думать. Опять без пинка никак((
Возможно, у тебя PhpStorm проставляет не то время изменения файлов на сервере из-за разницы с часовых поясах. Были такие жалобы на SFTP клиентов.
Если сильно напрягает — можно отключить проверку этих ошибок.
Можно ли мне для дальнейшей работы использовать локальный сервер?
И при установке просто в браузере поменяй кодировку вручную.
И видимо, они поменяли кодировку по умолчанию, с установкой не было проблем.
И еще, подскажите пожалуйста, если я буду использовать не шторм, а лобстер например, у меня не будет больших проблем с дальнейшим изучением? У меня шторм тормозит очень :)
Пробуй сам.
Спасибо большое за ответы!