Architecture for single page application (JavaScript)

javascript design-patterns model-view-controller single-page-application javascript-framework
testndtv picture testndtv · Mar 6, 2013 · Viewed 18.1k times · Source

I wanted to understand the overall architecture for designing single page application (mainly through JavaScript)

Let's say I have a login page (Usernam/Password) and on successful authentication, I am shown the homepage. Now both the login and homepage screens should actually be part of a single page.

How can I design such kind of page?

Answer

rsp picture rsp · Mar 6, 2013

This is such a broad question that entire books could be written to answer it in detail.

Basically what you need to do is to use AJAX instead of page reloads. You still need to connect to the server to authenticate users but instead of reloading the entire page every time you do it, you need to make an AJAX call to your server and depending on whether the login was successful or not change some parts of the content on the page (like changing the Login button to a "Logged in as user xxx" message etc.).

Related questions

"Hello World" in MVC Pattern

In an interview for some company, I was asked this question. What design patterns do you know...then I was told to write simplest "hello world" application based on MVC Design Pattern. I came up with a JavaScript program var …

Read More
Function in JavaScript that can be called only once

I need to create a function which can be executed only once, in each time after the first it won't be executed. I know from C++ and Java about static variables that can do the work but I would like …

Read More
Simplest/Cleanest way to implement singleton in JavaScript?

What is the simplest/cleanest way to implement singleton pattern in JavaScript?

Read More