25

Hi I am looking for a very simple example of single page web application implimented with pure javascript/jquery. Don't want to use angular backbone ember etc..

shikhar chauhan
  • 431
  • 1
  • 4
  • 9
  • possible duplicate of [Architecture for single page application (JavaScript)](http://stackoverflow.com/questions/15245935/architecture-for-single-page-application-javascript) – Barmak Shemirani Jun 21 '15 at 05:37
  • 3
    Anybody has answer to this question ?? or just want to mark this duplicate... ?? anybody ? – shikhar chauhan Jun 21 '15 at 05:44
  • 3
    have you tried google? the web is full of simple examples like these – svarog Jun 21 '15 at 05:48
  • @svarog i would highly appreciate if you can share one single link which is not using any supporting library. thanks in advance!! – shikhar chauhan Jun 21 '15 at 06:10
  • jquery is huge!! you need to be more clear on what kind of application you need and what it should do. in the meanwhile, try this http://www.sitepoint.com/building-list-jquery-local-storage/ – svarog Jun 21 '15 at 06:16
  • 2
    @svarog did you try understandt or even read my question.. please try understanding what I wanted. any very simple example of hash linking implementation. – shikhar chauhan Jun 21 '15 at 06:33
  • 2
    @shikharchauhan you never mentioned hash linking. The question asks for an example of a web page using JavaScript...well you can get that anywhere. You didn't say what features it should have, and even if you did, you can research them yourself. That's why the question is closed. The question might be "simple" but it's also massively open-ended and completely unsuitable for answering in the SO style. – ADyson Aug 29 '17 at 12:13
  • CodePen [https://codepen.io/] is jammed with some error at the moment (!) but go there to see simple implementations. – Trunk Mar 28 '19 at 12:25

2 Answers2

28

2021 Update:

It's nearing the end of 2021 and thought I would provide a newer solution/guide if possible. I did end up finding one, created a couple years ago, that uses modern day tools (npm, webpack, ES6, etc.):

spa-without-framework

However, I reviewed the original three guides below and TBH they're still relevant 6 years later! Which one you should choose solely depends on what suits your needs best.

Here are some links to help point you in the right direction. If you don't want to use any frameworks (Angular, Backbone, etc.) these links will be good. They use jQuery and perhaps one other library/plugin. Hope they help!

Guide A - uses jQuery library handlebars

Guide B - uses jQuery plugin bbq

Guide C - uses jQuery plugin sammy.js

NightOwlPrgmr
  • 1,322
  • 3
  • 21
  • 31
7

My website uses this, not trying to plug it: http://www.oriley.org. Basically you just need to have a bunch of hidden divs which are revealed when a link is clicked, making for a faster experience.

omikes
  • 8,064
  • 8
  • 37
  • 50
  • Link is not valid; please update the link – pyprism Apr 27 '17 at 10:49
  • I would argue your answer isn't relevant to the OP's request since HTML5 Boilerplate is not intended for creating SPAs. It might have that capability, but it doesn't mention it or explain how to do this. I also couldn't find any guides that walk you through setting up a SPA with HTML5 Boilerplate. In short, one would spend more time hacking the template to get this to work as a SPA that they would be better off with something else. – NightOwlPrgmr Oct 19 '21 at 17:11