Making videos, slides, or terminal UIs with React

Plus more on why TypeScript is such a good fit with React. |

#225 — February 10, 2021 Read on the Web 👋  While we all know React fits many front-end Web interface and native app use cases well, people are rapidly taking React into other places too, such as video, motion graphics, slideshows, and even terminal based UI development — we're looking at a few projects in these areas in this issue :-) __ Peter Cooper and Terence C Gannon, your editors React Status Your weekly React news digest, every Wednesday Remotion: Create Videos with React — This new tool (version 1.1 just dropped) merges the video creation process with software development concepts like source code control. You don't create videos, you program them. No demo, but it does have a trailer. We've also been impressed by this 18-minute screencast showing off exactly how to make a video production of your own with it. GitHub repo. Jonny Burger Fusuma: Create Presentation Slides with Markdown — Similarly, this library enables the generation of presentation-quality slides with customizable styles using simple Markdown as source code. Comes complete with the tools required to support live presentations. Yuta Hiroto State Modeling in React with XState — Microsoft's David Khourshid shares how to use XState to manage both local and global component states in React. Learn more about state machines, types, model-based testing, and more in this detailed course. Frontend Masters sponsor Double Your React Coding Speed With This Simple Trick — A well thought out methodology for breaking down code into reusable building blocks, which the author asserts has a dramatic, positive impact on productivity. Aleksey Kozin React Blessed: A Custom Renderer for Terminal Interfaces — blessed is a Node.js library that makes it possible to create elaborate "terminal user interfaces" (often called TUIs, nowadays) and React Blessed takes it a step further by being able to declare such interfaces with React. Guillaume Plique ▶  All the Ways to Generate a Next.js Site — The affable and popular Senior Developer Advocate for DigitalOcean walks through a brief primer on Next.js for the generation of static sites serving pure HTML as well as server-side rendering. Chris Sev 💻 Jobs React Developer at X-Team (Remote) — Join the most energizing community for developers and work on projects for Riot Games, FOX, Sony, Coinbase, and more. X-Team Find Your Next Job Through Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired 📘 Tutorials and Stories Schedule Recurring Reminders with Native Notifications — Recurring reminders can be a challenge to implement. This article succinctly traces the full arc of development from their design concepts to finished code. Altrim Beqiri ▶  A Soft Introduction to Remotion — In case you missed it (above), Remotion provides a way to create videos and motion graphics from React and this is a fantastic introduction to the practicalities of actually using it. Alex Anderson Check Out the February Line Up for React Wednesdays on Twitch — Expect chats on React in the enterprise, a React Query demo from Tanner Linsley, and more. Add it to your calendar. Progress KendoReact sponsor React Hooks Retrospective: Event Driven Async Hooks — According to the author, reusing Hooks is as important as designing them in the first place. He illustrates this by building a sample chat panel app with just three custom Hooks. Oren Farhi How TypeScript Helps You Build Better React Apps — The first part of a future, multi-part series which holds the promise of being the authoritative guide on using TypeScript in combination with React. It kicks off with a basic definition along with advantages and disadvantages. Felix Gerschau A Better Way to Structure React Projects — A folder-by-folder, opinionated recommendation along with supporting arguments for how to setup your next React project. Akash Joshi 🛠 Code and Tools supported by Spotter: An Alfred/Spotlight-Style Launcher App — As a React Native developer you might be more interested in the GitHub repo. It's GPL licensed and built on React Native. Denis and Contributors React Tabs 3.2: An Accessible and Easy Tab Component — A solid implementation of the ubiquitous tab component complete with concise, interactive demos. React Community React Leaflet 3.1.0: React Components for Leaflet Maps — There's a live demo right on the homepage if you want to see how it works. GitHub repo. Paul Le Cam The Ultimate Guide to Cardinality for Observability Lightstep sponsor Urban Bot: Write Once for Many Platforms — Create your chatbot once as a series of React components, then run it on multiple messenger platforms: Telegram, Slack and Facebook currently, with Discord, WhatsApp, VK and Viber currently in the works. Urban Bot Fluent Reader: A Modern Desktop RSS Reader — If you're shopping for a new RSS reader, this is a good candidate to use as-is. It's available from both the Microsoft and Apple app stores. But if you're interested in a peek under the covers as to how it's built, here's the source. Haoyuan Liu Five React Native Libraries You Might Have Missed — Some useful React Native libraries to be sure to check out for your next mobile app project. Fabian Lee Quarkly: A New Tool for Webmasters, Designers and Developers — Making it easier for designers and developers to collaborate is never a bad thing and this new commercial tool aims to plug the gap. Their launch video is a good place to start. Quarkly ⚡️ Quick Bits: Helpful libraries which you may have missed. React Select 4.1 — A flexible select input control. react-use-scrollspy — Navigation based on scroll position. three-material-editor — Edit your Three.js materials.

This issue was curated by Terence C. Gannon and edited by the Cooperpress team. A Cooperpress publication. Change your email address or Stop getting this newsletter © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom