Сайт на основе одной HTML-страницы

[Evgeny42]

На дворе 2007, ребята придумывают signle page application.

[signalizator]

В 2007 spa уже были, начало было в 2005 году.

[Rastishka]

IDE: Notepad
…
body onload='onPageLoad()'

А добавили бы в теги «ретро разработка» — и могли бы плюсы собрать.

[vedenin1980]

А если бы добавили тег «юмор»…

[vedenin1980]

Но какое это все имеет отношение к IDE (Интегрированной среде разработки)? Что в блокноте интегрированого-то?

[vedenin1980]

Не, не пойдет. Вот far с плагином подсветки синтакиса и плагином ftp можно технически обозвать простейшей IDE для html/js/php.

[pepelsbey]

Вы кажется забыли объяснить, зачем вы заново реализуете то, что браузеры и так умеют делать без JavaScript: запрашивать HTML-страницы по ссылкам.

[vedenin1980]

Не говоря уже о том что настроив переадресацию запросов в .htaccess можно сделать как бы эмуляцию signle page application, то есть пользователь будет вводить url?id=533&folder=ddd, а получать содержимое файла /ddd/553.html, да и ссылки в iframe работают без всякого JS.

[demimurych]

Кажется Вы не поняли иронию pepelsbey. Вопрос не в красивых ссылках, а в том какая непосредственно выгода в использовании своего собственного механизма загрузки контента.

[vedenin1980]

Ну выгода есть, angular'ы и backbon'ы ценны именно за собственный механизм загрузки контента, но придумывать такой топорный велосипед смысла нет никакого, уж лучше использовать классический механизм ifram'ов, он устарел лет на 15-20, но это лучше чем такой велосипед.

[zBit]

Больше похоже на хабрасуицид, если честно :)
SPA зародились уже ооочень давно, ты опоздал с материалом лет на 10 :)

Придирки

Ни одна из перечисленных IDE не является IDE, это текстовые редакторы.
Ещё и с перезагрузкой страниц…
Ещё и в текстовых файлах…
Ещё и вёрстка табличная…

Ну совсем грустно ;(

А для тех, кто понимает, что создавать свой велосипед не всегда оправдано — есть AngularJS.

[izac]

Прямо, хабра и машина времени.

[maximw]

У вас в getUrlParametr() ошибка.
Если значение параметра содержит знак равно, то будет возращено обрезанное значение от начала до первого вхождения знака равно.
example.com?test=123&test1=22=33=444

console.log(getUrlParametr('test1')); // "22"

[maximw]

По-хорошему надо. Но работает и без эскйепа, проверял.

[Kano]

Для новичков которые только только познают азы веба очень даже ничего, но стиль изложения для них будет трудноват для понимания. Такие вещи нужно описывать наиболее простым языком, который способен понять школьник.

[zBit]

Мне кажется, что по началу лучше не изобретать свои велосипеды, а учиться использовать уже существующие инструменты. Всё же создать качественный велосипед, как мне кажется, может только опытный программист и делать он это будет только при острой необходимости.
Поэтому, совет всем новичкам: не тратьте время на это дело, лучше изучайте уже существующие инструменты.
Ну и, ИМХО, учиться по статьям человека, который тоже учиться — плохая затея.

[TheShock]

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

[vedenin1980]

Нее, это не тот велосипед, который нужно изобретать. Если бы автор попытался повторить что-то вроде angularJS (ну или хотя бы JQuery), флаг ему в руки, а в «изобретение» велосипеда с деревянными колесами ничего хорошего не даст.

[gonzazoid]

для новичков с азами веба это не надо — у них есть html import, custom elements, shadow dom и html templates, которые уже сейчас работают везде с полифилами, а к моменту овладения новичками азов — имхо, будут работать везде нативно.

[sayber]

Эта статья случайно не с времен основания хаба?
Что то материал смахивает на оч. древний, когда люди только услышали про ajax.

[m0sk1t]

Долго хранилась в черновиках а тут рука дрогнула над кнопкой «Опубликовать» =)

[gag_fenix]

Жаль, поисковики не увидят всей этой красоты…

[dshster]

Нормальные поисковики умеют видеть хеш-линки в ссылках (#!) и перенаправлять запрос на ?_escaped_fragment_=, а там уже умный сервер запускает phantomjs, который чудненько умеет исполнять javascript и выдавать результат. Angularjs так и индексируется.

[apelserg]

У-уф — холодный душ полезен для здоровья.

Надо признать, что большинство замечаний, даже издевательских, это правда — описанный подход не является новой технологией (об этом честно сказано в первом абзаце).

Использую этот подход пару-тройку лет, но в интернете целостного описания или примера не нашёл. А выгода есть. Как сказал классик «Не эстетично, зато просто, дёшево и практично». Так появилась эта публикация.

Заметки на полях:

• Это не SPA, хотя внешне очень похоже. Есть SPA-верся, но проще и полезнее эта, например иногда хочется Shift+Ссылка.
• Это не замена AngularJS. Если надо — Angular легко уживается внутри.
• Это не велосипед. Велосипед не может состоять из одной функции в пять строк. А суть всего подхода — в применении функции разбора URL.
• По-поводу табличной вёрстки. Демо не имеет отношения к дизайну, его цель — показать наглядный и целостный пример.
• По-поводу Notepad. Профит применения дефолтных текстовых редакторов:
  
  • Всегда и везде под рукой, быстро открываются, не глючат, не устанавливаются по пол дня.
  • За всё время для этого проекта не потребовалось ничего сложнее (это правда).
  
  

[zBit]

Ещё ещё один холодный душ :)

Это не SPA, хотя внешне очень похоже

В заголовке написано "Сайт на основе одной HTML-страницы". Единственное, чем ваш SPA отличается от нормального SPA — перезагрузка страницы.

Есть SPA-верся, но проще и полезнее эта, например иногда хочется Shift+Ссылка.

Если руки совсем не кривые, то на AngularJS работает и клик средней клавишей и shift+клик по ссылке.

Велосипед не может состоять из одной функции в пять строк

Кто сказал? :)

Профит применения дефолтных текстовых редакторов

А ещё он по-дефолту сохраняет файлы в _не utf-8_, не видит unix line endings, в нём нет подсветки синтаксиса, нет автодополнений, да там вообще нифига нет, кроме поля в котором можно ввести какой-то текст :) (Мы же про Notepad, а не про Notepad++?)

И по поводу

быстро открываются, не глючат, не устанавливаются по пол дня

SublimeText тоже текстовый редактор, устанавливается считанные секунды, запускается моментально, работает быстро, не глючит (без корявых плагинов), при правильном подходе прекрасно расширяется до функциональности IDE.

Грусть, тоска, печаль…