¿Cuál es el mejor flujo de desarrollo para crear aplicaciones de una sola página?

Saber qué datos recibirá y manipulará el front-end de su aplicación sigue siendo una parte importante del flujo de trabajo de la aplicación de una sola página, especialmente en aplicaciones JavaScript enriquecidas. Si está utilizando bases de datos relacionales con su aplicación de una sola página, es posible que desee continuar con su flujo de desarrollo de diseño de esquemas de tabla primero. ¡Las aplicaciones de una sola página funcionan con bases de datos SQL y bases de datos NoSQL!

Como se señaló en otra parte, un marco MVC como AngularJS o Backbone lo ayudará a andamiar su front-end más rápidamente para que pueda trabajar en problemas frontales interesantes (como diseño e interfaz de usuario) en lugar de reescribir JavaScript repetitivo para estructurar su aplicación.

Normalmente comienzo con una página de demostración que tiene una característica básica, como presionar un botón para solicitar algunos datos JSON y mostrarlos en la página sin ningún formato. Una vez que tenga una interfaz básica que recupere datos, puede comenzar a manipular el diseño o implementar formas de modificar y devolver los datos a su backend.

El flujo de trabajo óptimo de desarrollo web moderno consta de tres partes: editor de código, línea de comando y navegador web.

Use Grunt o Gulp para automatizar todas las tareas repetitivas. Configure una tarea de observación para monitorear los archivos de origen en busca de cambios y haga que el navegador vuelva a cargar los activos automáticamente; eliminando la necesidad de actualizar manualmente el navegador.

Aprenda una sintaxis de preprocesamiento de CSS como Sass o Stylus para una gestión superior de la hoja de estilo.

Use Bower para administrar las dependencias de la biblioteca.

Establezca temprano cómo va a escribir pruebas unitarias. Intenta estar atento a las pruebas de escritura a medida que avanzas. Una vez que la aplicación se vuelve más compleja, el riesgo de romper algo inadvertidamente es alto si no los tiene. Haga que las pruebas de ejecución sean parte de su flujo regular. Configure una tarea Grunt o Gulp para llamar a su corredor de prueba.

Elija un marco de JavaScript optimizado para SPA. Angular y Ember son probablemente los dos principales contendientes en este momento, pero hay mucha innovación en esta área.

Durante el desarrollo, haga referencia a los archivos fuente de JavaScript originales para facilitar la depuración, pero en producción use secuencias de comandos concatenadas y comprimidas para un rendimiento óptimo.

Cree su SPA como una aplicación estática en lugar de usar Rails o algún otro marco de servidor como back-end. Esto facilita aún más un flujo simplificado al obligar a centrarse solo en el código que se ejecuta en el navegador en lugar de saltar de un lado a otro entre el servidor y el cliente. Claro que puede que necesite conectarse a una base de datos, pero ese es el trabajo de una API, no su SPA. Ingrese a una mentalidad orientada al servicio donde el front-end está completamente abstraído de cualquier base de datos que se encuentre detrás de la API.

Considere usar Aerobatic para alojar su SPA en la nube. Fue diseñado desde cero específicamente para las necesidades de las aplicaciones HTML5 de una sola página. Partiendo del flujo de trabajo descrito anteriormente, proporciona tareas de Grunt para automatizar la ejecución de un servidor de desarrollo y la implementación en la nube. La plataforma de servidor totalmente administrada brinda capacidades para aumentar su aplicación, incluida la integración de OAuth, un proxy API inteligente, alojamiento de activos CDN y mucho más.

http://www.aerobatic.io

Le recomendaré que use marcos MVC de JavaScript como AngularJS, BackboneJS, etc. Estos marcos están especialmente diseñados para desarrollar aplicaciones web de una sola página.

A continuación hay un enlace para comenzar con los marcos anteriores.

1- Backbone.js

2- AngularJS