Architecture for single page application (JavaScript)

You may take inspiration from existing solutions that you can find over the web :

• ExtJS (MVC application architecture)
• Knockout (built upon the MVVM pattern)
• Backbone

You may want to look up this free Single Page App book. I found it when I Googled "Single Page Apps".

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.).

If you haven't seen it already, John Papa has a very popular course on designing Single Page Applications on Pluralsight: http://www.pluralsight.com/training/Courses/TableOfContents/single-page-apps-jumpstart

It does require a Pluralsight subscription, but you can get a 10 day free trial to confirm the content is valuable to you. (I am not affiliated with Pluralsight, btw.)