Projekt Meteor.js Bootstrap

Titulní fotka od Oziela Gómeze na Unsplash

Na adrese https://github.com/chrisquinnr/meteor-bootstrap najdete aplikaci pro rychlý start, která vám pomůže s několika základy Meteor, včetně účtů, směrování, kolekcí a přidání knihovny uživatelského rozhraní, jako je Bootstrap.

V tomto příkladu používáme starého dobrého Blaze, ale brzy bude k dispozici zbrusu nová verze Svelte.

Rychlý start

  • Nainstalujte si Meteor:https://www.meteor.com/developers/install
  • Klonujte úložiště
  • meteor npm install
  • meteor

Proč Meteor?

Meteor za posledních 18 měsíců zaznamenal úžasný návrat poté, co se původní vývojový tým přesunul na nové pastviny s příchutí GraphQL. Poté, co byl odkoupen firmou VC, projekt nabral tempo a jak bylo vidět, znovu se zaměřil na řešení některých plánů Meteoru.

Meteor je full stack JS framework, který je ideální pro aplikace v reálném čase. Jeho prvními výhodami byly websockets s nulovou konfigurací a ES6, které #justWorked, ale nyní zjišťuji, že je to skvělý nástroj pro prototypování a vytváření MVP, protože nejenže dokážeme využít zázraky NPM, ale také vám framework umožňuje přinést si vlastní frontend. . Blaze, React, Angular a nyní Svelte jsou všechny možnosti.

Jako každý framework i výhody Meteoru mají svou cenu, a to v tom, že se musíte přiklonit k vysoce názorové struktuře a konceptům Meteoru. Naštěstí to nejsou příliš bláznivé a většina pravidel se dá porušit, pokud chcete, ale existuje spousta problémů, které podrazí první uživatele.

Doufejme, že v tom může pomoci tento bootstrap projekt, který vás dostane z nuly na... něco trochu rychleji. Netvrdím, že se jedná o zlatý standard, a doporučil bych níže uvedené zdroje pro autoratativní pohled na věci, jako je struktura aplikace a osvědčené postupy.

Zdroje

V doporučeném pořadí čtení pro každého, kdo je v rámci nového rámce.

  • Průvodce meteorem – nejprve si přečtěte toto!
  • Oficiální výukové programy
  • Meteor API

Když už jste v provozu, proč se nepodívat na následující?

  • Fóra
  • Meteor Devtools
  • Konference 2021 Meteor Impact s několika skvělými přednáškami od komunity a ukázkami nadcházejících funkcí

A pokud máte hlad po dalších balíčcích, příkladech a skvělém komunitním obsahu, podívejte se na tyto:

  • Úžasný meteor
  • Úžasný Blaze

Balíčky

Kromě toho, co jsem napsal níže, byste se měli podívat na repozitář Meteor Community Packages. Toto je vítaná nová snaha přinést úžasné moduly vytvořené komunitou pod jednou střechou.

Styling

Je ironií, že první várka balíčků, na kterých tento projekt závisí, nejsou specifické pro Meteor, takže je nenajdete v .meteor/packages . Používáme meteor npm install přidat Bootstrap a související závislosti.

Utility, předplatné

podtržítko

V současné době se používá pouze pro jednoduchou funkci randomise, ale používám ji ve většině projektů. Samozřejmě to můžete nahradit [lodash] nebo libovolným počtem dalších pomocných knihoven. Zvažte import pouze funkcí, které používáte, abyste se vyhnuli načítání celé knihovny (viz otřásání stromů).

meteorhacks:subs-manager

Velmi užitečný balíček pro řízení toho, jak se vaše aplikace chová na základě toho, kdy jsou předplatné připraveno. Použil jsem tento balíček na několika podnikových projektech a stojí za to.

simple:reactive-method

Meteoričtí pomocníci jsou výkonní, umožňují reaktivně aktualizovat vaše uživatelské rozhraní na základě datových mutací po drátě. Někdy však musíte naslouchat výsledku operace na straně serveru. Meteor.call není ze své podstaty reaktivní, což znamená, že budete muset neustále dotazovat server na požadovaný výsledek. Zadejte Reactive Methods, elegantní řešení tohoto problému. Reaktivní metoda může volat libovolnou metodu Meteor.method, kterou jste definovali na serveru, a pokud je použita v pomocníkovi šablony, aktualizuje se reaktivně.

Směrování a šablony

ostrio:flow-router-extra &&mealsunite:flow-routing-extra

Bylo by vám odpuštěno, že jste byli trochu zmateni stavem směrování v Meteoru. Vím, že jsem byl. Univerzálním řešením vytvořeným komunitou po mnoho let byl Flow Router, který naštěstí převzala společnost Veliov Group (https://github.com/veliovgroup). Zůstává to i moje volba, ale potřebuje trochu pomoci od sourozeneckých balíčků, aby se hrálo pěkně s rozložením blaze níže.

kadira:blaze-layout

Elegantní způsob, jak deklarovat a ovládat rozvržení ve spojení s vaším řešením směrování, samozřejmě pro Blaze.

Účty

uživatelské účty:core / [email protected] / useraccounts:bootstrap

Kombinace těchto balíčků nám poskytuje uživatelské účty, autentizaci a další přímo po vybalení! Úžasné správně! Je dokonce rozšiřitelný o další balíčky a přidávat poskytovatele přihlášení oAuth.

Úvodní obrazovka přihlášení

Přidal jsem obrazovku umělého načítání jen proto, že zpožděním výsledku posluchače odběrů to najdete v client/main.js . Obvykle je přihlášení téměř okamžité. V této poznámce accounts-password / useraccounts:core balíčky jsou skvělé a zcela rozšiřitelné včetně přihlášení na sociální sítě.

Twilio

Pokud se ponoříte trochu hlouběji, přidal jsem pokyny pro obsluhu přihlášení pomocí SMS pomocí Twilio (to byla hlavní motivace pro vybudování tohoto projektu na prvním místě). Musíte nastavit Twilio, jak je uvedeno v komentářích v /imports/api/apimethods/methods.js a poté spusťte SMS pomocí poskytnuté metody Meteor, např. Meteor.call("smsLogin");