• Какие методы/библиотеки/технологии использовать в web-проекте?

    copist
    @copist
    Empower people to give
    Общий ответ: вебсокеты и асинхронные сообщения через pub/sub
    В гугле искать по фразам "socket.io rabitmq" "php rabbitmq" "php websocket" "php pub/sub"

    Вариант реализации с использованием PHP
    На клиентском приложении: socket.io + javascript
    На сервере: socket.io + RabbitMQ + PHP

    Чтобы следить за игровым процессом:
    Скрипт PHP будет посылать сообщения в очередь на RabbitMQ
    socket.io будет читать очередь RabbitMQ и пересылать в веб-сокеты

    Клиентское приложение в браузере будет создавать постоянное соединение к сервером по протоколу веб-сокетов и читать из него всё, что пришлёт сервер socket.io. Всё, что присылается, нужно будет показывать в веб-интерфейсе.

    Чтобы управлять игровым процессом
    Из клиентской части веб-приложения нужно будет отправлять команды управления через AJAX или через то же соединение веб-сокет.
    В случае "через AJAX" нужно будет создать серверное микро-приложение, которое будет принимать команды через AJAX и затем передавать в основной игровой процесс через RabbitMQ или иным способом.
    В случае "через веб-сокет" серверная сторона socket.io должна будет отрабатывать полученные команды и передавать в основной игровой процесс через RabbitMQ или иным способом.

    На сервере нужно будет периодически делать дамп состояния основного серверного игрового процесса и сохранять в какую-нибудь базу. Я бы предложил дамп хранить в формате JSON в базе NoSQL, например, Mongo, CouchDB, Redis.
    При перезапуске основного серверного игрового процесса нужно будет восстанавливать состояние из этого дампа.

    Игрокам нужно будет выполнять авторизацию. У нескольких игроков может быть один игровой мир или отдельный микро-мир на несколько пользователей или на отдельный сеанс игры (например, одна шахматная доска на двух игроков и несколько зрителей). Поэтому надо будет хранить данные о пользователях и мирах. Вот тут подойдёт SQL база, например, MySQL или PostgreSQL. Хотя и NoSQL тоже можно использовать.

    Ну как то так.
    Выглядит замысловато, а на деле реализуется очень просто.
    Ответ написан
  • Плохо ли использовать чужой UI в качестве основы для дизайна?

    copist
    @copist
    Empower people to give
    Если это фрагмент стандартного интерфейса макоси, то я бы не стал делать коммерческие сайты в таком стиле. Это может быть незаконно.
    Так, для себя побаловаться, потренироваться верстать и программировать. For fun only.
    Ответ написан
    Комментировать
  • Какую ошибку я допустил, при создании этого шрифта?

    copist
    @copist
    Empower people to give
    Не знаю содержимое твоего шрифта.

    Вариант 1 - шрифт вообще не загрузился. Например, не нашлись файлы.
    @font-face {
        font-family: 'My2';
        src: url('.../font/my2-webfont.eot');
        src: url('.../font/my2-webfont.eot?#iefix') format('embedded-opentype'),
             url('.../font/my2-webfont.woff2') format('woff2'),
             url('.../font/my2-webfont.woff') format('woff'),
             url('.../font/my2-webfont.ttf') format('truetype');
    }

    Зачем у тебя три точки в путях?

    Вариант 2 - код символа .fa-photo:before{content:"\0053"} не 0053
    Кто коды символов сгенерил?
    Ответ написан
    8 комментариев
  • Почему file_get_contents ничего не выдаёт?

    copist
    @copist
    Empower people to give
    Возьмите библиотеки типа Guzzle или хотя бы просто curl.
    Они более корректно работают с протоколом HTTP, чем file_get_contents

    curl
    <?php
    
    $link = "http://www.aliexpress.com/item/Wholesale-price-free-shipping-good-quality-high-clear-phone-back-screen-protect-film-For-Huawei-Ascend/32258530279.html";
    $ch = curl_init();
    curl_setopt( $ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 5.1; rv:1.7.3) Gecko/20041001 Firefox/0.10.1" );
    curl_setopt( $ch, CURLOPT_URL, $link );
    curl_setopt( $ch, CURLOPT_FOLLOWLOCATION, true );
    curl_setopt( $ch, CURLOPT_ENCODING, "" );
    curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );
    curl_setopt( $ch, CURLOPT_AUTOREFERER, true );
    curl_setopt( $ch, CURLOPT_SSL_VERIFYPEER, false );
    $ali = curl_exec( $ch );
    $http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    $error = curl_error($ch);
    
    if ($error) // ошибка curl, например таймаут
    {
        echo 'CURL error occurred during the request: ' . $error;
        echo "\n";
    } elseif ($http_code<200 || $http_code>=300) // код возврата не 200
    {
        echo 'HTTP error ' . $http_code. ' occurred during the request';
        echo "\n";
        var_dump(curl_getinfo( $ch )); // там все заголовки и другая отладочная информация
    } else
    {
        print_r($ali);
    }


    Guzzle
    $client = new GuzzleHttp\Client();
    $res = $client->get('http://www.aliexpress.com/item/Wholesale-price-free-shipping-good-quality-high-clear-phone-back-screen-protect-film-For-Huawei-Ascend/32258530279.html');
    echo $res->getStatusCode();
    // "200"
    echo $res->getHeader('content-type');
    // 'text/htm; charset=utf8'
    echo $res->getBody();
    // <html ...
    Ответ написан
  • Что учить дальше?

    copist
    @copist
    Empower people to give
    Если интерес к программированию не угасает, то это хорошо. А языков ещё много. Я знаю больше 15 языков, они живут себе в моей голове и между собой не спорят, уживаются как-то.

    Посмотри что ещё есть. Серверные языки, клиентские, интерпретируемые, компилируемые. Объектно-ориентированное программирование, событийное программирование, функциональное программирование, аспектное программирование.

    В общем-то важно не то, какой язык ты знаешь, а то, какие задачи ты можешь решить на них. На работу берут не за то, что знаешь "<любой язык программирования>", а за то, что приложения, написанные на этом языке, будут быстрыми, красивыми, удобными и принесут денежку работодателю.

    Я бы порекомендовал посмотреть в направлении проектирования и разработки программного обеспечения для мобильных устройств. Их очень много, они няшные :) и с каждым годом их будет больше, они будут навороченнее. Будут применяться во всех областях деятельности человека.
    Java для андроидов. Objective-C и Swift для айфонов. Мультиплатформенные приложения на JS/CSS/HTML.

    Ещё есть направление, которое приносит огромное удовольствие создателям программ и их пользователям. Пользователей прям за уши не оттащить. Готовы сутками такими программами пользоваться. Это игры.

    Ну и прикладное программирование, то есть программы для платформ Windows, MacOS, Linux. Всегда есть какая-то бытовая задача, которую нужно решить программно, а решения на базе JS/HTML/CSS уступают таким приложениям в скорости. Те же Java, Objective-C, C++, .Net и ещё куча языков.
    Ответ написан
    Комментировать
  • Можно ли сохранить файл полученный от веб сервера средствами js?

    copist
    @copist
    Empower people to give
    1. Отправь готовы файл пользователю по электронной почте
    2. Сделай реализацию слушателя событий на веб-сокетах и сообщай пользователю, когда сервер выдаст событие "файл готов".

    Ведь если делать как я придумал, то файл будет болтаться где то в папке веб сервера, доступен из вне для скачивания, и нужно писать какой то сборщик мусора на том же кроне.

    Генери длинный случайный URL. Удаляй по крону. Не вижу проблем.
    Ответ написан
  • На чем писать конструктор?

    copist
    @copist
    Empower people to give
    Дельный совет: посмотри как реализованы уже работающие современные конструкторы landing page
    https://www.google.ru/search?q=landing+page+online...

    Потыкайся, посмотри как они это визуально реализовали, подебажь запросы на сервер.
    Прикинь, что из этого надо на клиенте делать, а что - на сервере.

    Если ты делаешь LP под заказ, то тебе, может статься, тебе вполне хватит возможностей таких конструкторов.

    Моё предположение: весь конструктор - это JS, а на сервере весь шаблон и его настройки хранятся в NoSQL базе, например Mongo.

    Всё веселье начинается когда на странице попросят вывести грид из динамических данных, например, каталог товаров. Погугли в направлении BaaS (backend as service). Это может решить вопрос с хранением данных.
    Ответ написан
    Комментировать
  • Как сделать конструктор пиццы, т.е. выбираешь какие-то ингредиенты и они добавляются на основной картинке как бы слоями сверху?

    copist
    @copist
    Empower people to give
    У них используется много полупрозрачных изображений для отдельных ингредиентов.
    Вот, например, изображение для начинки "шампиньоны" 500600.ru/images/ingridients/shampiniony1.png
    Изображения накладываются друг на друга с помощью JS в объекте типа canvas.
    Вот так это реализовано в HTML: copi.st/LE8L

    Пример реализации: codepen.io/copist/pen/EVayRq
    Ответ написан
    1 комментарий
  • Как узнать, что за запрос?

    copist
    @copist
    Empower people to give
    У тебя закоментирована строка

    // var data = JSON.parse(request.responseText);

    Вот в этом request.responseText с сервера надо передавать, что именно там произошло. Например, в формате JSON можно вернуть имя файла, URL для просмотра файла, URL для его скачивания
    (формат ответа я придумал из головы - он полностью на твоё усмотрение)
    {
      "file": "text1.txt",
      "view_url": "http://domain.com/path/to/file/text1.txt",
      "download_url": "http://domain.com/path/to/file/text1.txt?download"
    }

    на стороне сервера на PHP такой ответ мог бы быть сформирован вот так:
    <?php
    /* что-то сделать с принятым файлом */
    
    /* выдать ответ через AJAX */
    echo json_encode(array(
        "file" => "text1.txt",
        "view_url" => "http://domain.com/path/to/file/text1.txt"
        "download_url" => "http://domain.com/path/to/file/text1.txt?download",
    ));


    Ещё можно воспользоваться замыканиями, как подсказал planarik :

    <script type="text/javascript">
    function loadFile(fileUrl, callback)
    {
        var request = new XMLHttpRequest();
    
        request.onload = function() {
            if (request.status >= 200 && request.status < 400) {
                // fileUrlбурётся через замыкание, а request.responseText из ответа сервера
                callback(fileUrl, request.responseText);
            } else {
                alert('Error');
                // We reached our target server, but it returned an error
            }
        };
    
        request.open('GET', fileUrl, true);
        request.send();
    }
    
    loadFile('1.txt', function(fileUrl, reponseText) {
        alert('Загружен файл :' + fileUrl);
        //   var data = JSON.parse(request.responseText);
    });  
    </script>
    Ответ написан
  • Что нужно первично выучить для джуниора по JS/Node?

    copist
    @copist
    Empower people to give
    Какие задачи нужно уметь выполнять на JS начинающему (для NodeJS разработчика надо то, что помечено "важно", включая операции над DOM)

    Для укрепления навыков backend разработки - многопользовательское приложение с сервером на Node и клиентском на JS (angular, durandal, aurelia, backbone), например, игру какую-нибудь, хотя бы шашки или морской бой.
    Ответ написан
    Комментировать
  • Как сделать хэш универсальным?

    copist
    @copist
    Empower people to give
    Храни выданные ключи авторизации в отдельной таблице выданных ключей, а не в таблице пользователя.
    Ответ написан
  • Какой workflow front-end разработки у вас?

    copist
    @copist
    Empower people to give
    1. локально развёрнута система в виртуалке Vagrant почти такая же как demo-сервер и prod-сервер.
    2. весь код отправляется на bitbacket в репозиторий git в ветку dev
    3. bamboo периодически проверяет состояние ветки dev (по хуку + таймаут) и через 15 минут от последнего комита запускает юнит-тесты
    4. если тесты прошли, делает merge ветки dev -> в ветку demo. Конфликтов нет.
    5. deployhq по хуку определяет, что изменилась ветка demo и запускает автоматическое обновление demo-сервера. Перед обновлением (* см. ниже) делается дамп базы, пользовательский интерфейс закрывается, крон-задачи и очереди тушатся (** см. ниже). После обновления делается дамп базы, интерфейс открывается, крон-задачи и очереди восстанавливаются, выполняется рестарт кэша.
    6. с демо-сервера собираются метрики скорости и делаются селениум тесты
    7. когда релиз, вручную мержим dev -> prod. Конфликтов нет.
    8. deployhq по хуку определяет, что изменилась ветка prod и запускает автоматическое обновление прод-сервера. Перед обновлением делается дамп базы, пользовательский интерфейс закрывается, крон-задачи и очереди тушатся. После обновления делается дамп базы, интерфейс открывается, крон-задачи и очереди восстанавливаются, выполняется рестарт кэша.

    9. если хотфиксы, то восстанавливаешь у себя базу с последнего дампа, берёшь код из prod, исправляешь, комитишь в prod, затем мержишь prod -> demo -> dev

    * обновление - это что?
    Обновление исходных кодов (PHP, Python, JS, SCSS), компиляция и сжатие CSS, сборка и сжатие JS, обновление зависимостей, установка обновлений на базу данных.

    ** зачем закрывать интерфейс, тушить крон и очереди?
    В проекте много всяких вещей, которые не хранятся в репозитории, а именно: CSS собранные из SCSS, модульное приложение на AngularJS с кучей зависимостей, подмодули git, пакеты для PHP (composer) - они на bamboo, на demo, на prod собираются заново. Это занимает время. Чтобы не было сбоев, выключаем всё, кроме самой сборки. На машинах разработчиков все зависимости обновляются по мере необходимости, а на CSS и JS следит gulp.

    Настройка всей этой кухни заняла 2 месяца. По другим проектам - неделю максимум.

    Ссылки: Bitbucket (git), Vagrant (develop), Bamboo (continuous integration), Deployhq (continuous deployment).

    Ну и чуть рекламы от спонсора ;)
    Icons8 15 000+ free flat style icons
    download?id=ufWm2fSkYEEsK5OXT4v2JzxGfn5O
    Наш стек технологий на stackshare.io
    Ответ написан
    3 комментария
  • CodePen/JSFiddle альтернатива на своем сервере?

    copist
    @copist
    Empower people to give
    JSFiddle и Codepen используют онлайн редактор кода с подсветкой синтаксиса CodeMirror.
    Cloud9 используют Ace.

    Нужно приделать авторизацию, храненение кусков кода и отображение результата.
    База подойдёт NoSQL, а можно в файликах хранить
    Интерфейс можно написать на AngularJS + NodeJS + Meteor, а можно на PHP + jQuery собрать

    Репо CodeMirror https://github.com/codemirror/codemirror
    Репо Ace https://github.com/ajaxorg/ace

    Есть навороченный, но не такой красивый как Codepen проект JSBin https://github.com/jsbin/jsbin/

    А тебе зачем?
    Ответ написан
    4 комментария
  • Как сделать модальное окно перемещаемым и увеличиваемым/уменьшаемым?

    copist
    @copist
    Empower people to give
    Если бы можно было подключить jQueryUI, то

    перемещение https://jqueryui.com/draggable/
    резайз https://jqueryui.com/resizable/

    А увеличение на прокрутку мыши вешается через событие scroll
    www.w3schools.com/jquery/event_scroll.asp
    и реализуется через CSS zoom
    htmlbook.ru/css/zoom
    Ответ написан
  • Как исправить ошибки в PHP-коде?

    copist
    @copist
    Empower people to give
    PHP Strict Standards: Only variables should be passed by reference

    Мануал php.net/manual/ru/language.references.pass.php

    /* где-то в недрах Wordpress*/
    function get_comments($condition) { return array(); } // результат функции get_comments() не является объектом и не возвращает ссылку
    function separate_comments(&$comments) { } // параметр функции separate_comments() должен передаваться по ссылке
    
    /* где-то у вас */
    separate_comments(get_comments()); // <-- в данном случае недопустимо
    Ответ написан
    Комментировать
  • На какой CMS Реализовать сайт мотиваций для каждого?

    copist
    @copist
    Empower people to give
    Вы хотете сделать самостоятельно? Опыт есть? Если нет, начните с самого начала: Как самостоятельно переучиться на веб-разработчика?. Тут на тостере ещё много таких. Все делятся опытом, который вам как раз и нужен.

    Будет не быстро. Это точно то, что вы хотели? А не собирались ли сделать что-то как справа на этой картинке?
    download?id=VX8VlT0KLQ99xrChz0K9cvzLhHSy

    (источник картинки - отличная книга Тимоти Пичил "Не откладывай на завтра. Краткий гид по борьбе с прокрастинацией")
    Ответ написан
    Комментировать
  • Что делает эта функция JS?

    copist
    @copist
    Empower people to give
    Две неопределённые переменные sCap и cookie - без них предположение о работе функции очень приблизительные.

    Она проверяет есть ли поддержка cookie что ли...

    Нет, она читает из кук какое-то значение.

    Выполни в консоли бразера Google Chrome такую строку:
    console.log(document.cookie)

    На примере тостера, будет приблизительно вот такая строка:
    _gat=1; _ga=GA1.2.591983563.1439419107; _ym_visorc_24049246=w


    Твой скрипт ищет в такой строке подстроку от слова "что-тоCap=" до символа ";", затем найденное значение приводит к целому путём округления. Результат использует для логического сравнения.
    Я повторю: две неопределённые переменные sCap и cookie - без них предположение о работе функции очень приблизительные.

    Если она возвращает return то это как бы true а если ничего не возвращает то это false?


    Если ничего не возвращает, то это undefined. В логических операциях может быть приведена (временно пребразована) к булевскому значению false, но это всё же undefined.
    Ответ написан