Natural Performance Manager

    universal-redux-boilerplate

    1.0.6 • Public • Published

    Universal Redux Boilerplate

    Un simple boilerplate con los siguientes features:

    Build Status Dependencies DevDependencies

    • Javascript Universal. Renderizado y Ruteo con componentes, almacenes y rutas compartidas.

    • Manejo de estados desde Redux.

    • ES6 como estándar usando babel y webpack.

    • Express 4.x.

    • Cargado en caliente en modo desarrollador desde el server.

    • Convenciones y scripts útiles para el desarrollo.

    Inicializar el Proyecto

    Basé mi proyecto en el boilerplate de elliot (Referencia), haciendo este para un mejor entendimiento en la comunidad hispano-hablante

    npm install
    npm run webpack:dev
    

    Abrir un terminal mas en la ruta del proyecto y correr

    npm run start:dev
    

    Ahora puedes abrir el proyecto desde http://localhost:3000/

    Javascript Universal

    Javascript Universal quiere decir que esta diseñado para correr un montón de código en ambos lados, cliente y servidor. Comúnmente esto incluye un montón de lógica de renderizado y dominio.

    Son muchas las ventajas que obtendrás al construir aplicaciones usando este camino, pero principalmente son:

    • Cross-functional teams. Ya que todo esta escrito en Javascript, es más fácil de construir equipos que saben cómo trabajan tanto en el cliente como en el servidor de la aplicación.

    • Write once, run everywhere. Con la excepción de alguna sustitución de librerías y browser polyfills, el codigo es compartido, esto quiere decir que tu podrás escribir la mitad de lo que escribirías en una aplicación no universal

    • More productive developers. Dado que el proyecto es más consistente, no hay cambio de contexto cuando necesitas mantener el comportamiento de la aplicación en ambos lados del stack. Escribe el comportamiento una sola vez y ya. El cambio de contexto ralentiza a los de desarrolladores de manera significativa

    Que tenemos dentro del proyecto?

    • src/ - Código Compartido.

    • src/App.jsx - Para el lado del Browser.

    • src/store/configureStore.dev.js - Mantengo condicionales para el desarrollo en server y client.

    • source/server - Para el lado del Server.

    Index

    Webpack

    El webpack.server.js hace correr un server en el puerto 8888 para el bundle de webpack

    Server

    El bin/www basandome en express-generator este sería el archivo que ejecutaría el proyecto en el puerto 3000 por defecto, este a su vez, requiere del archivo App.jsx para servir el contenido dinámico. Los assets son servidos desde la carpeta build usando express.static

    Scripts

    La Mayoría de estos scripts están hecho para ser corridos en entorno unix/linux (OSX y sistemas operativos basados en linux)

    El package.json tiene los siguientes scripts:

    • npm run start corre el start:prod webpack:prod al mismo tiempo, recomendado para deployments automaticos

    • npm run start:dev corre el servidor del proyecto en modo desarrollo

    • npm run start:prod corre el servidor del proyecto en modo producción

    • npm run webpack:dev corre el servidor del webpack en modo desarrollo

    • npm run webpack:prod corre el servidor del webpack en modo producción

    • npm run test verifica si las reglas de estilos y si cumple los pruebas unitarias

    Install

    npm i universal-redux-boilerplate

    DownloadsWeekly Downloads

    2

    Version

    1.0.6

    License

    MIT

    Last publish

    Collaborators

    • ghondar