Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Meteor
Code

Consejos Esenciales de Meteor

by
Difficulty:BeginnerLength:LongLanguages:

Spanish (Español) translation by RRGG (you can also view the original English article)

El proyecto Meteor es una plataforma de desarrollo de aplicaciones web de código abierto que le permite crear aplicaciones escritas enteramente en JavaScript.

Meteor ofrece herramientas de desarrollo para las necesidades esenciales de aplicaciones web, lo que es naturalmente adecuado para las nuevas empresas y los nuevos proyectos en general. Ofrece funciones como la implementación en muchos dispositivos de una base de código (iOS, Android, Escritorio), con actualizaciones de pulsaciones activas compatibles fuera de la caja.

Esto significa que puede actualizar la aplicación en el dispositivo del usuario, sin esperar la aprobación de la App Store. La gran cantidad de paquetes disponibles a través de npm y su propia biblioteca Atmosphere hacen de Meteor una herramienta interesante para trabajar.

Rápido Desarrollo en Meteor

Una de las principales razones por las que comencé a usar Meteor, hace tres años, era la rápida capacidad que tenía para entregar una aplicación web en cuestión de horas. Me permitió cumplir con las altas expectativas de mis clientes y su presupuesto de financiación antes de la primera ronda.

Por último, con este marco web que puede acomodar grandes ideas con principios humildes, las aplicaciones web móviles reactivas de alta calidad están al alcance de un equipo de desarrollo de una sola persona.

NPM + Paquetes de Atmósfera

Cualquier paquete de npm está disponible en Meteor, así que si te gusta usar herramientas como Grunt, Browserify, Webpack, Bootstrap, React, jQuery y Angular, no tendrás problemas con estos en Meteor.

Para buscar nuevos paquetes:

Para instalar un paquete npm en Meteor, ejecuta:

La ejecución de este comando actualizará su package.json con la dependencia y también descargará el paquete en el directorio local node_modules / de su aplicación.

Control de Versión

Una nota importante: Para la portabilidad, te recomiendo que no confieses los node_modules / en git, y al pasar a un nuevo desarrollador en lugar de pedirles que ejecuten meteor npm install, que instalará todos los paquetes requeridos.

Cuentas de Usuarios

Meteor accounts-ui

El paquete accounts-ui permite que los usuarios inicien sesión y se registren para la aplicación, y también proporciona soporte oAuth, interfaciando con las cuentas Meteor.

Para fines de marca y comunicación, personalizar la verificación de correo electrónico (sendVerificationEmail) o invitaciones (sendEnrollmentEmail) para adaptarse al tema general de la aplicación es una solicitud común.

Una gran manera de hacer correo electrónico HTML en Meteor es utilizar el paquete de correos electrónicos por yogiben.

Ahora puedes cambiar el email de verificación con solo algunas líneas:

Para la información de su empresa, puede configurar PrettyEmail.options de la siguiente manera:

Para enviar el correo electrónico, utilice los métodos siguientes:

Si deseas agregar una plantilla, puedes hacerlo personalizando las siguientes opciones:

Cambiar estilos también es muy fácil:

Aquí hay un ejemplo del email de activación que el usuario recibirá en su cliente de email.

Pretty Emails activation email

Un bonito correo electrónico tiene una tonelada entera más opciones para sociales, vínculos de vuelta, el encabezado y pie de página y así sucesivamente - lea más en la página de manual.

Ratchet, Materializa y Soporte de Bootstrap

También hay paquetes de cuentas de usuario para cada una de estas populares bibliotecas front-end, así como Ionic. Cada uno puede ser completamente configurado para satisfacer sus necesidades.

UI

De forma similar a las cuentas de usuario, hay paquetes disponibles para bibliotecas front-end populares como Bootstrap, Angular, React y el motor de plantilla Blaze, junto con muchos otros como Semantic UI.

La búsqueda en la atmósfera produce muchos resultados; Aquí están algunos de mis favoritos:

React + Bootstrap

Deberás haber instalado los paquetes React npm primero con:

Ahora, para el paquete de meteoros, run meteor add universe: reaccionar-bootstrap.

Puedes utilizar los componentes Bootstrap en tu React JSX ahora:

Transiciones de Página

Si estás utilizando Iron Router entonces puede utilizar el paquete de meteor-transitioner. Al trabajar con la plantilla de Blaze, agregue los siguientes manillares alrededor de su {{yield}}:

Ahora establece la transición entre rutas:

Para obtener más información sobre las transiciones, consulte el archivo README.

Mongo

Para la edición de su base de datos mongo en el navegador web, la herramienta Mongol es uno de los mejores que he utilizado. Una vez que haya instalado Mongol con:

Simplemente presione Control-M y tendrá acceso a sus colecciones con soporte completo CRUD en el navegador.

Encuentro que usar mongol es muy útil al depurar nuevas aplicaciones o cambios de datos a los ya existentes.

Mongol for debugging

Extensiones del Buscador

Para los usuarios que trabajan en Chrome, hay un complemento Mongo disponible, denominado MiniMongo, que te permitirá explorar la base de datos Meteor en el panel de herramientas del desarrollador.

El proyecto MiniMongo Explorer está disponible en GitHub si desea crear la fuente usted mismo.

Despliegue

Utilizar el excelente mup de herramientas gratuitas, puede desplegar un sitio en una VPN Digital Ocean en cuestión de minutos.

La configuración es muy simple, y solo necesitará tener su aplicación, credenciales SSH y tal vez un certificado SSL si desea habilitar HTTPS.

Para configurar mup, comience por crear un directorio para la implementación:

Instala mup:

Inicia el directorio:

Ahora debes configurar la implementación configurando el archivo mup.js que se ha creado mediante el paso anterior.

Ahora establece el servidor:

Y desplega:

Verás la confirmación de cada paso del proceso en tu terminal. Una vez que el despliegue haya terminado, la aplicación ya está en vivo en tu servidor y se puede comprobar en tu navegador.

Para obtener más información sobre la configuración con SSL, consulta esta guía.

Almacenamiento en caché

Meteor viene con appcache, que almacenará en caché la aplicación después de la primera carga, pero no para uso fuera de línea.

Si deseas ponerte en caché en línea, entonces tendrás que usar GroundMeteor. Este es un almacenamiento sólo del lado del cliente que funciona en LocalCollection.

Por ejemplo, podemos monitorear una colección y almacenarla localmente:

Aquí, el contenido de la publicación Data.find () se almacenará en caché en una colección de tierra sin conexión.

Almacenamiento de Claves Caché

Para el almacenamiento en caché de memoria de memoria, puedes utilizar el paquete memcache o el paquete redis para permitirle acceder a la caché de datos en el servidor.

El paquete supone que el servidor memcache o redis ya está en ejecución y, a continuación, se puede almacenar una clave en memcache.

O en la Colección Redis:

La implementación redis es muy agradable, ya que puede ser utilizado para transmitir a través de la arquitectura publicar / suscribirse de Meteor.

Herramientas de Desarrollo

Además de las herramientas ya mencionadas, las extensiones de navegador Firebug-like disponibles en Chrome for Meteor facilitan la depuración. Usted puede monitorear los datos que se pasan del servidor al cliente fácilmente dentro de la pestaña DDP y revisar su plantilla Blaze a través del inspector Blaze.

Reviewing a Blaze Template

Herramientas IDE

Para el desarrollo en el editor de texto Sublime, una versión personalizada del paquete Tern.js proporciona el autocompletado para Meteor. Descárguelo en GitHub.

JetBrains proporciona la integración automática de los proyectos de Meteor con resaltado de sintaxis y depuración. Atom también proporciona varios paquetes para sintaxis, fragmentos de código y autocompletar.

Placas de la Caldera

Yeoman

Si sólo quieres empezar rápidamente con una aplicación que ya está configurada, puedes mirar al iniciador de yogiben. El chef Meteor también tiene una base excelente entrante. Si desea utilizar React, puede ver este generador Yeoman como punto de partida.

Para obtener más ayuda para iniciar su aplicación, Meteor Kitchen proporcionará una GUI para rutas y configuración.

Paneles Administrativos

AdminLTE theme admin panel from Yogiben

Si estás usando Yogiben Meteor Starter, también puede estar seguro de que el panel de administración que has creado funcionará bien en conjunto. Casi todos los otros proyectos que utilizan mongo y resplandor deben ser adecuados para esto, aunque las aplicaciones de React Router pueden tener un conflicto con Iron Router.

El tema para el panel de administración es extensamente modificable, y usted puede leer la documentación.

Meteor De Meteorites

Meteor Preview 052

Antes de concluir aquí, permítanme darles algunos antecedentes sobre el proyecto Meteor. Meteor fue lanzado al público en enero de 2012, los resultados de un proyecto de incubadora Y Combinator, que recibió 11,2 millones de dólares en fondos de la firma de capital riesgo Andreessen Horowitz.

Inicialmente se lanzó con un gestor de paquetes llamado Meteorito (mrt en el cli), y la extensibilidad siempre ha sido un elemento central de Meteor. Con el lanzamiento de Meteor 0.9, las cosas cambiaron para siempre con el inicio de los paquetes de Atmosphere.

La adición de paquetes a las aplicaciones de Meteor se hizo tan simple como meteor add mrt: moment.

A medida que el impulso para el proyecto continuó, ganó interés público y fue adoptado por una amplia gama de desarrolladores antiguos y nuevos. Uno de los principales impulsores para esto, creo, fue la flexibilidad de poder trabajar plenamente en JavaScript-cliente y servidor.

Inicialmente, los paquetes de npm no estaban disponibles, hasta que Meteor lanzó la versión 1.3, que marcó un hito serio en el ciclo de desarrollo hasta ahora.

Trabajar en JavaScript completamente a través de Meteor tenía la capacidad de interactuar con la vasta biblioteca de JS existentes y las bibliotecas de nodos ahora con la integración de npm. Esto dio a Meteor una vanguardia como marco.

Da perspectiva de nuestro progreso en el desarrollo web sin duda pensar en la magnitud de poder que Meteor, npm y sus paquetes de atmósfera entregar a su alcance. Este es un gran cambio de cómo lo hacíamos, con una gran fuerza de trabajo de desarrollo, en los días pre-jQuery, pre-npm, pre-Bower de Flash, NotePad / Dreamweaver y PHP 3. He trabajado en equipos de más de diez empleados para producir obras que, sin sonar ridículo, pueden ser literalmente terminado en semanas en Meteor por uno o dos desarrolladores.

Con estas herramientas a tu disposición, nunca ha habido un mejor momento para ser un empresario web de mente técnica. Construir sus aplicaciones de sueño a sí mismo es, sin duda en el alcance.

Por ejemplo, hoy he reunido un CMS respaldado por una base de datos con un sistema de usuario completo y una oficina de administración con los inicios de sesión de Facebook y Google+ oAuth. Lo despliegue a un nuevo servidor para compartir con la gente para depurar, y pude ver los datos que se están cambiando en tiempo real.

Meteor es realmente tan rápido para trabajar. La validación del formulario se hace y el trabajo de entrada de datos adecuado puede comenzar mañana, después de sólo ocho horas de tiempo de desarrollo.

Conclusión

Meteor es un motor de aplicaciones web robusto y potente que le dará una ventaja en el desarrollo de aplicaciones.

Esperemos que los paquetes y consejos mencionados aquí le permitirá hacer su aplicación en ningún momento en absoluto. Para mí, darse cuenta de mis ideas de aplicación en un corto período de tiempo puede significar creatividad florece y la innovación es más fácil.

Puedes acelerar a través del desarrollo con facilidad, ya que en Meteor hay prácticamente un paquete para todo, y más de la atención se centra en la configuración, lo que hace que la experiencia de desarrollo mucho más agradable.

Para obtener soporte con problemas en un proyecto específico, puede buscar el proyecto en GitHub y crear un problema en el repositorio para que los desarrolladores puedan tratar.

Si estás buscando más consejos sobre Meteor, los foros oficiales son siempre un buen lugar para preguntar.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.