DenJel

Коротко
Карта развития Web Разработчика

Демагогия
Не переживайте, не все сразу. Есть вещи до которых можно дойти только опытом и практикой. Это касается всех программистов в целом. Касательно веба, тут очень много упирается в то, каким именно специалистом вы хотите себя видеть в будущем. Есть фулстак - когда человек знает большую часть технологий их связку, но всегда будет ощущать недостаток тонкостей на хай левеле. В то же время специалист заточенный под определенные задачи будет лучше фулстака, но так же будет нуждаться в том же фулстаке, что бы объеденить.

Живой пример: Есть толковый фронтендер(или бекендер по JS) пишет морду сайта на JS Фреймворке. Есть гуру бэкенда пишет API сайта. В случае с фулстаком(образно) он пишет обе задачи сам, но заведомо понятно, что он пишет это дольше и не факт что по последнему слову будет сделано.

Что нужно для развития дальше:
- Читайте блоги зарубежных программистов, они делают отличные архитектуры как в самом коде, так и решения в DB.
- Фреймворки PHP и JS - чем больше их будет тем лучше. Все они ускоряют разработку. Все чаты, соц авторизации, регистрации,и прочие первоочередные задачи давно уже написаны. Вы можете концентрироваться на более важных задачах.
- ООП тут очень спорный вопрос, на определенных этапах разработки оно решает, но когда этот уровень появляется, чаще всего прибегают к другому языку программирования и переписывают проект в угоду скорости (С++, Java, Python). Понимать нужно, поскольку фреймворки построены на этих парадигмах, но самостоятельно придумывать вам гибкие решения вряд ли придется(по крайней мере до Senior-а точно).
- Не изобретайте велосипеды. Разбирайтесь в чужом коде(Этот навык очень ценен после "решить/найти решение любую задачу"). Любой магазин чаще всего будет написан в лучшем случае на фреймворке, в худшем на OpenCart, Woedpress - что просто идиотизм, это блоговая система БЛОГОВАЯ. из за тренда выкручивают яйца.
- Учить английский и работать не на СНГ, Укр или места постсоветского пространства. Искать фирмы зарубежных филиалов и работать там. Поскольку так или иначе там уже работают профессионалы и знакомы с западным рынком, европейским. Там пишутся интересные проекты и появляются интересные решения.

Батник можно вызывать по его полному пути независимо от того, где он лежит
просто по имени - да, если в PATH есть.
например такой bat-ник, назовём его example.bat и сохраним в c:\Temp\:

dir
echo %1
echo %2
echo %3
echo %*

при запуске

c:\Temp\example.bat "первый параметр" второй параметр

выведет содержимое текущего каталога и переданные параметры
типа

Том в устройстве D имеет метку Data
 Серийный номер тома: ...

 Содержимое папки d:\

09.09.2015  17:46                 0 1
07.07.2015  16:17    <DIR>          ...
05.11.2014  17:56    <DIR>          ...
28.07.2014  16:02    <DIR>          ...
10.09.2014  19:18        13 234 918 ...
...
               6 файлов     37 073 021 байт
              27 папок   2 091 204 608 байт свободно
первый параметр
второй
параметр
первый параметр второй параметр

%1, %2, ... тут, как уже сказал Александр Таратин - параметры,
%* - все параметры

stackoverflow.com/questions/26551/how-to-pass-comm...
https://en.wikibooks.org/wiki/Windows_Batch_Scripting

Обычный батник вполне справиться.

Пример генерации базового для меня gulp проекта
gulpbase.bat

+
https://stackoverflow.com/questions/4165387/create...

Какие задачи нужно уметь решать на чистом JS, перед тем как переходить к изучению библиотек и фреймворков?

Кроме синтаксических конструкций, математических и логических выражений, нужно знать:

• Область видимости переменных
  
• Замыкания
  
• Объектно-ориентированное программирование, в частности наследование через прототипы
  
• Шаблон проектирования "модуль"
  
• Операции над DOM
  
• Понимание принципов событийно-ориентированного программирования
  

Важно - нужно знать, откуда копипастить.
Тебе нужно быть очень хорошо знакомым с одной-двумя-тремя популярными библиотеками на JavaScript. В идеале ты должен иметь представление о том, что определённый класс задач может быть решен с помощью определённых библиотек, хотя бы одной, но такие знания приходят с практикой. Вообще ты должен быть знаком с ними так близко, чтобы помнить, в какой части мануала по библиотеке можно найти описание форматов входных данных нужной тебе функции и какой будет результат, чтобы скопировать и вставить в свой код, а потом поправить, чтобы работало.

Важно - инструменты программиста JavaScript
У тебя должен быть удобный инструмент для разработки (IDE, Integrated Development Environment), чтобы он тебе подсвечивал код (syntax highlight) и подсказывал о синтаксических ошибках (syntax check), о формальных параметрах функций (type hinting), о стиле кодирования (code style), помогал писать код (live templates).
Ты должен знать, как отлаживать скрипты в популярных браузерах (Firebug, Chrome Developer Tools и другое). Что такое точки останова, как управлять исполнением во время останова, как посмотреть и поменять содержимое переменных, как настроить останов по условию.

Хотелось бы узнать что это за задачи(упомянутые вами 80%)

Реальные задачи джунов:

1. Возьми из сборника задач по javascript любой скрипт случайно и вслух расскажи, что он делает.
   Важно - читать и понимать чужой код намного важнее, чем писать свой. И на работе тебе это приддётся делать чаще, чем ты думаешь. Чтобы подключить к своему проекту чужую JS либу, нужно понимать что она делает, как она конфигурируется, как управлять её поведением. Скажу точно, что написать свой скрипт, который строит графики, намного сложнее, чем понять, как настраивается highcharts.
   
   
2. Напиши скрипт на JS, который в заданном тексте удалит один или два символа, выбранных случайно
   
   1. Усложнение: удалять можно только буквы в словах, а знаки пунктуации и цифры удалять нельзя
      
   2. Усложнение: принять, что этот текст является программной на Javascript, удалить одну-две команды JS, но только если они не в строковых литерах (break как команду удалить можно, а в строке "break my heart" нельзя)
      
   3. Усложнение: воспользуйся этим скриптом и "попорти" код какого-нибудь другого скрипта на Javascript, а потом отладь, найди ошибку и восстанови работоспособность
      
   Важно - этим обычно все и занимаются - ищут баги. Только в реальной жизни они и без этого скрипта появляются. И не по одному, а прям пачками.
   
   
3. На страницу HTML нужно встроить график курса доллара по отношению к рублю. Формат входного массива значений курса определи сам, исходя из своего скрипта для построения графиков.
   
   1. Усложнение: на одном графике должны быть два курса, по разным шкалам. Наприме, курс доллара к евро и курс юаня к рублю
      
   2. Усложнение: первоначально график вывести в детализации по месяцам, но чтобы можно было "приблизить" (drilldown) детализацию до дней
      
   3. Усложнение: первоначально график вывести текущем месяце, но чтобы можно было загрузить данные для предыдущего месяца без перезагрузки страницы (AJAX)
      
   
   
4. При клике по картинкам, вставленным в текст HTML, показывать всплывающее окно для просмотра увеличенной картинки.
   
   1. Усложнение: в всплывающем окне сделать навигацию по картинкам, вперёд/назад и к нужной картинке
      
   2. Усложнение: в всплывающем окне вместо картинки показать видео-ролик с Youtube
      
   3. Усложнение: в всплывающем окне показать текст HTML
      
   
   
5. По клику на кнопку "Click me" показать всплывающую форму.
   
   1. Усложнение: реализовать проверку данных на корректность перед отправкой формы (непустое значение, минимальное количество символов, максимальное количество символов, минимальное числовое значение, максимальное числовое значение)
      
   2. Усложнение: если в значении текстового поля встретилась гиперссылка, то считать её за 22 символа при любой длине этой ссылки (как в твитере)
      
   3. Усложнение: реализовать отправку формы на сервер через AJAX, без перезагрузки страницы
      
   4. Усложнение: саму форму в виде HTML загрузить с сервера через AJAX, в момент клика по кнопке "Click me", правила проверок данных должны как-нибудь "извлечься" из самой загруженной формы, например из аттрибутов полей ввода
      
   
   
6. К форме ввода данных на поле ввода даты "навешать" всплывающий календарь для выбора даты.
   
   1. Усложнение: сделать форму календаря мультиязычной. Хотя бы через настройки на том же JavaScript
      
   2. Усложнение: сделать так, чтобы с помощью календаря можно было выбрать диапазон дат, чтобы она была привязана к двум полям формы "дата начала" и "дата окончания", и чтобы значение в поле "дата начала" обязательно была меньше чем в поле "дата окончания"
      
   3. Усложнение: сделать так, чтобы с помощью в календаре можно было видно визуально этот диапазон
      
   4. Усложнение: диапазон может быть открытым, но не пустым, то есть пользователь должен задать хотя бы дату начала или дату окончания.
      
   
   
7. Сделать пред-просмотр веб-страницы HTML с разными темами. Тему страницы выбирать через селектор на javascript, а показывать в фрейме.
   
   1. Усложнение: сделать селектор "тип устройства", чтобы менять размер фрейма (например, "iPhone 5c 1136x640") и "чекбокс" для смены ориентации страницы "горизонтальная" или "вертикальная" (соответственно 1136x640 или 640x1136)
      
   2. Усложнение: в селекторе тем предусмотреть поиск тем по подстроке, и аналогично поиск устройств по части названия (авто-дополнение, auto-complete)
      
   3. Усложнение: тема страницы должна меняться без перезагрузки фрейма
      
   
   

Задачи повышенной сложности, исходя из личного интереса

1. Реализовать форму для многошагового мастера: форма должна состоять из нескольких страниц (шагов), пользователь может переключать страницы через какие-нибудь элементы управления "вперёд/назад" или "перейти на страницу".
   
   1. Усложнение: реализовать функциональную связь значений, когда некоторые данные зависят друг от друга (ввёл число в поле "количество" и в поле "сумма" значение пересчиталось)
      
   2. Усложение: доступность некоторых полей ввода должна зависеть от данных (например, если указал "есть личный самолёт", то значит можно ввести "марка самолёта")
      
   3. Усложение: видимость некоторых страниц должна зависеть от данных из предыдущих страниц (например, если указал "есть личный самолёт", значит появилась страница "ТТХ самолёта"; иначе страница должна скрыться)
      
   
   
2. Реализовать однопользовательскую браузерную игру "змейка", "тетрис", "найди пару"
   
3. Реализовать многопользовательскую браузерную игру "крестики-нолики", "морской бой" на два игрока в режиме "hot seat"
   
   1. Усложнение: два игрока на разных компьютерах, ходы передаются по websocket
      
   2. Усложнение: ограничение на ожидания окончания хода 15 секунд, по окончании ожидания автоматически делается случайный ход
      
   
   
4. Реализовать todo-list. Пользователь вводит список, затем он превращается в строки с "чек-боксами". Когда "чекбокс" включен, строка зачёркивается.
   
   1. Усложнение: пользователь может переименовывать, удалять, добавлять строки
      
   2. Усложнение: список хранить в localStorage браузера, чтобы при перезагрузке страницы он восстанавливался
      
   3. Усложнение: пользователь может иметь несколько независимых списков todo
      
   
   
5. Реализовать простой графический редактор. Пусть рисуется точка в месте, где пользователь кликнул.
   
   1. Усложнение: добавить переключатель режимов "точка"/"линия", в режиме "линия" рисуются линии между двумя последовательно кликнутыми точками
      
   2. Усложнение: можно менять толщину, цвет линий, размер точек
      
   3. Усложнение: последовательность кликов можно воспроизвести ещё раз с самого начала, равномерно или с реальной задержкой между кликами, с обычной скоростью или ускоренно
      
   4. Усложнение: можно выгрузить получившийся рисунок в формате PNG или SVG, причём SVG c анимацией воспроизведения
      
   
   

Можно использовать любую существующую библиотеку.
Например,
для построения графиков www.highcharts.com
для загрузки и передачи данных через AJAX: jquery.com + что-нибудь на сервере
для всплывающих диалогов с картиками, видео и формами: fancyapps.com/fancybox и https://jqueryui.com/dialog/
для валидации форм rickharrison.github.io/validate.js
для календаря https://jqueryui.com/datepicker/
для автодополнения https://jqueryui.com/autocomplete/
для передачи данных между несколькими пользователями socket.io или обычный AJAX

n: 1,2,3,4,......................
:x
n%3===1 (1,4,7)
n%3===0 (3,6,9)
loop x

Попробуйте определять по остатку от деления, к примеру

for($i = 0; $i < 20; ++$i){
    if($i%2){
        echo $i.'<br/>';
    }
}

Алгоритм, на самом деле, довольно прост:

<div class="container">
<div class="row">
<?php
for($i = 0; $i < 10; $i++)
{
	echo '<div class="col-md-4 col-xs-12">Запись '.$i.'</div>';
	
	if ($i % 3 == 2)
	{
		echo '</div>';
		echo '<div class="row">';
	}
}
?>
</div>
</div>

У него есть один недостаток - в конце может получиться пустой .row, но этого можно избежать, добавив проверку на последнюю итерацию:

$ar = range(0, 11);
$size = count($ar) - 1;

foreach($ar as $i => $v)
{
	echo '<div class="col-md-4 col-xs-12">Запись '.$v.'</div>';
	
	if ($v % 3 == 2 && $i < $size)
	{
		echo '</div>';
		echo '<div class="row">';	
	}
}

Это особенность gulp вопреки тому что вы пишите в последнем таске:
['fonts-concat', 'fontmin']
Gulp не будет выполнять их последовательно. А вот если вы напишите просто:

gulp.task('fonts', ['fonts-concat'] function() {
    return gulp.src('./fonts/*.css', {read: false})
        .pipe(clean());
});

То у вас перед fonts , будет запущен fonts-concat в свою очередь перед fonts-concat будет запущен fontmin и в итоге вы получите нужную цепочку. А что касается замены адреса, то создайте еще один таск используя gulp-replace или его аналог.
Как край вы можите использовать gulp-run-sequence.

Потому, что запрос асинхронный, и первые два console.log вызываются до того, как получен ответ с сервера.

О боги! Такое ощущение, что все начинающие работать с WordPress учатся по одному какому-то старому уроку, написанному таким же начинающим. Сколько уже исписано - не используйте query_posts. Никогда!

Если нужно получить 1 пост - get_post()
Если нужно получить несколько постов вне контекста - get_posts()
Если нужно модифицировать основной запрос - фильтр pre_get_posts
Во всех остальных случаях - только WP_Query.

В вашей ситуации, если нужно, например, на главной странице, где уже есть основной запрос, дополнительно вывести блок с кастомными записями (участники), делайте secondary loop с помощью WP_Query:

$args = array(
    'post_type' => 'participants' // или как там он у вас называется
    'posts_per_page' => 5,
);
$participants = new WP_Query( $args );
// дальше - loop
if( $participants->have_posts() ) :
    while( $participants->have_posts() ) :
        $participants->the_post();
        // тут выводим пост
    endwhile;
endif;
wp_reset_postdata(); // возвращаем глобальные переменные к состоянию главного запроса

Если же нужно вывести архив ваших участников - просто создайте шаблон archive-participants.php (вместо participants - ваше название custom post types).

Если нужно, чтобы на главной или другом шаблоне участники выводились вперемешку вместе с обычными постами, или подобный сценарий - изменяете параметры основного запроса:

function my_modified_query( $query ) {
    // вместо is_home - проверяйте на соответствующий задаче шаблон
    // is_main_query - чтобы убедиться, что меняем именно основной запрос
    if ( $query->is_home() && $query->is_main_query() ) {
        $query->set( 'post_type', 'participants' );
        $query->set( 'posts_per_page', 20 );
    }
}
add_action( 'pre_get_posts', 'my_modified_query' );

Судя по всему, английскую документацию вы либо не читали, либо сложно понять всю суть на английском. Есть отличный источник информации на русском: wp-kama.ru/function/wp_query

У вас ошибка в коде
pages.lenght
Вы тут вероятно хотели обратиться к длине, но при том создали объект и получаете undefined поле
Если хотите работать с pages как с массивом, создавайте его как массив
var pages = ['index', 'about', 'members'];