Highlight.js 10, Node 14, and modern React in 20 minutes

#485 — April 24, 2020 Unsubscribe  :  Read on the Web JavaScript Weekly Introducing Crank.js: A New JSX-Driven Framework — A new framework for creating JSX-driven components with functions, promises and generators. If you haven’t got time to read the creator’s lengthy (but well worth reading!) rationale for creating another framework, check out the GitHub repo or jump straight into a CodeSandbox example. I hope to see a lot more about this in the near future. Brian Kim The Cost of JavaScript Frameworks — Using data from the HTTP Archive, Tim explores the performance cost of using various popular frameworks as a starting point. Some good analysis here. Tim Kadlec You Hacked the Gibson? Yeah, They Built Their Own Login — Don't let Crash Override pwn your app. FusionAuth adds secure login, registration and user management to your app in minutes not months. Download our community edition for free. FusionAuth sponsor Node.js 14 Released — v14 now becomes the current ‘release’ line with it becoming a LTS (Long Term Support) release in October. Diagnostic reports are now a stable feature, it now uses V8 8.1, there's an experimental Async Local Storage API, and more. Michael Dawson and Bethany Griggs Vidact: A Compiler to Convert React-like Apps to Vanilla JS — Compiles pure React-compatible JavaScript (JSX) to vanilla JavaScript with no virtual DOM.. think similar to Svelte, but without introducing a new syntax. A curious idea. Mohamad Mohebifar Highlight.js 10.0: The Web Syntax Highlighter Library — I always laugh when I see a big release of a popular library and saw we last linked it 5 years ago 😄 Nonetheless, this is a big release and Highlight.js continues to be a fantastic library for syntax highlighting code. highlight.js 💻 Jobs Senior Full-stack Developer (Malmö/Sweden) — Every day is different from the next. Join our upbeat Team and work on exciting, major projects using a modern JavaScript stack. Ortelius AB Find a Job Through Vettery — Vettery specializes in tech roles and is completely free for job seekers. Create a profile to get started. Vettery 📚 Tutorials ▶  React: The Basics in 20 Minutes — A well presented, up to date (yep, it covers hooks) tutorial that doesn’t hang around, whether you’re new to React or just want a refresher. Devistry Creating Web Apps via TypeScript and webpack — The example app doesn’t use any front-end framework, just vanilla DOM APIs. Some knowledge of TypeScript, webpack, and npm are required, but this is a neat way to bring together a bunch of tools. Axel Rauschmayer What Is The toJSON() Function? — If an object has a toJSON function, JSON.stringify() calls toJSON() and serializes the return value from toJSON() instead. Valeri Karpov A Much Faster Way to Debug Code Than with Breakpoints or console.log — Move forward and backwards through your code to understand what led to a specific bug, view runtime values, edit-and-continue, and more. Wallaby.js sponsor How Does TypeScript Work? A Bird’s Eye View — Dr. Axel goes into depth on the structure of a typical TypeScript project, what gets compiled, and how can an IDE be used to write TypeScript. Aimed at people who haven’t yet picked TypeScript up. Axel Rauschmayer 10 Lesser Known Angular Features You've Probably Never Used W3Radar You Might Not Need switch — Using an object of outcomes instead of switch suits many use cases, though take care over readability. Valentino Gagliardi 🗓 Upcoming Online Events Pick JS (May 8) — Aimed at intermediate to expert JS developers rather than beginners. JavaScript Remote Conf 2020 (May 14-15) — Speakers lined up already include Douglas Crockford, Aimee Knight and Christian Heilmann. ESNEXT CONF 2020 (May 18-22) — From the Pika folks (of Snowpack fame). 12 speakers over 5 days so it's a gradual pace. ForwardJS (May 26-29) — A real world event (ForwardJS Ottawa) that has now become a virtual event. CascadiaJS 2020 (September 1-2) — This upcoming online conference is set to take place in September, and the CFP is open now through May 15. 🔧 Code & Tools Phelia: A Reactive Slack Application Framework — If you think Slack apps were all about text bots, think again.. you can now create apps complete with in-app UIs. Phelia brings the React approach to the task. Max Chehab Marked.js 1.0: A Fast Markdown Parser and Compiler — Got Markdown to render? Marked.js to the rescue. While the project is years old, 1.0 has dropped just this week. Here’s a live demo. Christopher Jeffrey Stream Chat API & JavaScript SDK for Custom Chat Apps — Build real-time chat in less time. Rapidly ship in-app messaging with our highly reliable chat infrastructure. Stream sponsor Alpine.js: A Minimal Framework for Composing JS Behavior in Your Markup — We only gave Alpine a brief link when it first dropped but with new versions coming out thick and fast, we think it’s well worth a look. Billed as “like Tailwind for JavaScript”, Alpine lets you keep the HTML you know and love and just pepper it with JavaScript as and where appropriate. Alpine.js enroute: A React Router with a Small Footprint for Modern Browsers TJ Holowaychuk Rosetta: A General Purpose Internationalization Library in 292 Bytes — Less than 300 bytes, but does have a few dependencies. Aims to be very simple and is targeted at basic string use cases. Luke Edwards NAB 2020 May Be Canceled, But The Full Bitmovin Experience Is Not Bitmovin Inc. sponsor Hotkey 1.4: Trigger an Action on an Element When a 'Hotkey' is Pressed — Use Hotkey, set the data-hotkey attribute on your elements, and you get keyboard shortcuts. GitHub built and uses it (look for the data-hotkey attributes on their pages). GitHub web-worker: Consistent Web Workers for the Browser and Node — In Node it works as a web-compatible Worker implementation atop worker_threads. In the browser it’s an alias for Worker. Jason Miller

by via JavaScript Weekly