Architecture pour l'application d'une seule page (JavaScript)

Je voulais comprendre l'architecture globale pour la conception de single page application (principalement par le biais de JavaScript)

Disons que j'ai une page de login (Usernam/Mot de passe) et sur la réussite de l'authentification, j'ai montré la page d'accueil. Maintenant, à la fois la connexion et la page d'accueil écrans doit effectivement faire partie d'une seule page.

Comment puis-je concevoir ce genre de page?

source d'informationauteur testndtv

  1. 5

    C'est une vaste question que des livres entiers pourraient être écrits pour répondre dans le détail.

    Fondamentalement, ce que vous devez faire est d'utiliser AJAX au lieu de la page est rechargée. Vous avez encore besoin de se connecter au serveur pour authentifier les utilisateurs, mais au lieu de recharger la page entière à chaque fois que vous le faites, vous avez besoin de faire un appel AJAX à votre serveur, et selon que la connexion a réussi ou non de changer certaines parties du contenu de la page (comme changer le bouton de Connexion à une "Connecté en tant qu'utilisateur xxx" message etc.).

  2. 4

    Si vous ne l'avez pas déjà vu, Jean-Papa est très populaire sur la conception de Single Page Applications sur Pluralsight:
    http://www.pluralsight.com/training/Courses/TableOfContents/single-page-apps-jumpstart

    Il nécessite un Pluralsight abonnement, mais vous pouvez obtenir 10 jours d'essai gratuit afin de confirmer le contenu est précieux pour vous. (Je ne suis pas affilié avec Pluralsight, btw.)

  3. 2

    Vous pouvez regarder ce gratuit Single Page App livre. Je l'ai trouvé quand j'ai Googlé "Single Page Apps".

  4. 1

    Vous pouvez prendre de l'inspiration à partir de solutions existantes, que vous pouvez trouver sur la web :

  5. 0

    J'ai Juste ajouté un projet SourceForge qui peuvent vous aider. J'ai été le développement de cette bibliothèque pour environ un an maintenant, et je pense qu'il est prêt pour le prime-time. Ce projet permet pour vous de référence asp.net MVC, à partir de JavaScript.

    https://sourceforge.net/projects/peachajax/

    Cette bibliothèque génère des dynamiques de code JavaScript à utiliser pour les opérations AJAX. La bibliothèque nécessite jQuery.
    Par exemple, si vous utilisez une Méthode d'Action au sein d'un Contrôleur pour l'opération AJAX, vous pouvez rapidement accéder via le générées dynamiquement en JavaScript fichier comme suit:

    peach.ControllerName.ActionMethodName(parameter1, parameter2, parameter3); //javascript

    Mappés paramètres sont directement associés à la ActionMethods paramètres.

    Fonctionnalités de personnalisation comprennent:

    • Paramètres personnalisés
    • Personnalisé rappels
    • Côté client personnalisée des fonctions de traitement pour les paramètres (pour la sérialisation spécialisé types de modèle)
    • Personnalisé pré-demande de processeurs
    • Personnalisé après la demande de processeurs
  6. 0

    Si vous êtes plus un MVC gars, personnellement, j'ai été en utilisant chaplinjs.org qui est basée sur l'épine dorsale, et hbs une seule page, application de la gloire. J'ai quelques modifications à utiliser les websockets au lieu de long-sondages, mais il est assez assez extensible, et si vous êtes familier avec mvc, assez facile à obtenir dans (vous trouverez en plus de problèmes avec l'épine dorsale de avec Chaplin)