The Ember Times - Issue No. 172
👋 Emberistas! 🐹
Get your EmberConf talk proposals in ASAP, TypeScript in Ember guide, Storybook for Ember tutorial, building a Router component for Glimmer.js, and building prototypes with Ember.
Remote EmberConf talk proposals due this Sunday! 🗣
Developers around the world are invited to submit talk proposals for EmberConf 2021! The deadline for submissions is this Sunday, January 31st at 11:59pm ET.
Is there something cool you learned recently that you would like to share? Do you want to build up your speaking and teaching skills? Did you build something you are proud of?
This is your chance to share it! Talks are pre-recorded and the conference is fully remote.
If you have questions or need some help, visit the #emberconf channel on the Community Discord. Good luck!
Video tutorials: TypeScript basics with Ember.js 🔤
Ilya Radchenko (@knownasilya) did a couple of videos on getting started with TypeScript for your Ember.js applications.
The first video goes through setting up ember-cli-typescript which installs a variety of addons which provides blueprints, types, and the TypeScript dependency itself. It also adds the tsconfig.json file which provides compiler options to TypeScript.
The second video does an in-depth example of using TypeScript in Ember such as making a route, controller, and when using actions and decorators. He also briefly goes through where to add global type declarations in your project and other tips for working with TypeScript in your Ember application today.
Storybook for Ember tutorial 🎨
Storybook has taken the world of design systems by storm! What is Storybook? Storybook helps you build UI components that are isolated from business logic and context of your app. Sort of a "style guide as a service." Check out the new Storybook for Ember tutorial for guidance on setting up Storybook in your Ember app.
Thomas Gossmann (@gossi) spearheaded the Ember + Storybook effort and wrote a complementary blog post, Ember with Storybook – Behind the Scenes. The post touches on a few ideas:
- How Storybook and Ember are independent build pipelines
- Options for writing Storybook docs in Markdown
- Different strategies for Storybook setup depending on your app architecture (e.g. monorepo vs. multirepo).
But wait, there's more - you can use @gossi's open source Ember design system, hokulea, as a reference!
Already using Storybook with Ember, or going to try it out in your application? Be sure to check out the official Storybook docs and contribute to the Ember section if you can to further flesh it out!
Building a Router component for Glimmer.js 🧭
Rajasegar Chandran (@rajasegar) wrote a blog on building routing components for apps built using Glimmer.js. Unlike Ember, which has built-in routing, Glimmer is only a rendering engine. Rajasegar's blog walks through how routing can be achieved for Glimmer apps. He talks about this Routing system by building a Route Registry, Route component, Link component, and the Router Component.
As a bonus he also mentions about how you can achieve code-splitting JS bundles and lazy loading components.
Read more about Building a Router component for Glimmer.js if you have been looking for routers for your Glimmer apps!
Building prototypes with Ember 🐹
If you have not seen the recent simplabs blog post by Florian Pichler (@pichfl) on Building prototypes with Ember.js, you may want to give it a read.
Florian's post covers the approach they took in building ember-hotspots, an addon that can enable the experience of building prototypes that many design oriented software solutions provide, but in the framework we all know and love, Ember.js! 🔥
The post dives into the details of how to create hotspots and efficiently handle images with preloading, and even discusses a little bit of the Broccoli work involved.
If you're interested, head on over to the simplabs blog and check out more about ember-hotspots!
Contributors' corner 👏
This week we'd like to thank Simon Ihmig (@simonihmig), Robert Jackson (@rwjblue), Daniel (@genisd), Derek Wickern (@dwickern), Cyrille David (@dcyriller), Alon Bukai (@Alonski), Jared Galanis (@jaredgalanis), Steven (@smfoote), Amy Lam (@amyrlam), Ricardo Mendes (@locks), Chad Hietala (@chadhietala), Scott Newcomer (@snewcomer), abhilashlr (@abhilashlr), Luke Melia (@lukemelia), Jen Weber (@jenweber), @BnitoBzh, Chris Ng (@chrisrng), Abilash Badri (@abadri), Robert Wagner (@rwwagner90), Ben Demboski (@bendemboski), Katie Gengler (@kategengler), Chirag Patel (@chiragpat), Godfrey Chan (@chancancode), Edward Faulkner (@ef4), Sean Goresht (@srsgores), Chris Garrett (@pzuraq), Alex Kanunnikov (@lifeart), Thomas Wang (@xg-wang), James C. Davis (@jamescdavis), Pawel Kuwik (@czikarito), Tobias Bieniek (@Turbo87), John Derr (@jderr-mx), Isaac Lee (@ijlee2), Dave Combs (@davecombs), Bert De Block (@bertdeblock), Bryan Mishkin (@bmish), Devin Weaver (@sukima), and Jeldrik Hanschke (@jelhan) for their contributions to Ember and related repositories! 💖
Connect with us 🤓
Wondering about something related to Ember, Ember Data, Glimmer, or addons in the Ember ecosystem, but don't know where to ask? Readers’ Questions are just for you!
Submit your own short and sweet question under bit.ly/ask-ember-core. And don’t worry, there are no silly questions, we appreciate them all - promise! 🤞
Want to write for the Ember Times? Have a suggestion for next week's issue? Join us at #support-ember-times on the Ember Community Discord or ping us @embertimes on Twitter.
Keep on top of what's been going on in Emberland this week by subscribing to our e-mail newsletter, now on Substack! You can also find our posts on the Ember blog. See you in two weeks!
That's another wrap! ✨
Be kind,
Chris Ng, Amy Lam, Abhilash L R, Jen Weber, Jared Galanis and the Learning Team