Newsletter #2: Front-End Tooling Tips
Hi folks 👋
The second edition of this newsletter after a semi-planned break. I’ve reduced writing on my blog due to family matters – the good kind!
In short: I had to read aloud some books 😉 Btw. you can find JavaScript for Babies and CSS for Babies on Amazon, or check out codebabies.com for more info.
When I shared the news on Twitter I was surprised how many people told me that the content of those books is invalid and really bad. I’ve always seen them as a tongue-in-cheek joke, and wouldn’t have given them a code review 😅 Do some image searches to see for yourself, and if broken code makes you uneasy, don’t buy 😂
I’m slowly getting back to speed on writing new content. Right now, I’m creating the finishing touches of a book of my own, which I’m going to announce soon. No, it’s not TypeScript for Babies, but I guess that would be fun.
Can’t wait to share what’s coming up!
New on fettblog.eu #
Go Preact ❤️ – I’m starting to do a lot more Preact, and I like working with it a lot! You get all the React ergonomics, but also a ton of extra benefits when it comes to performance, speed, and overall library design. What the team put together is nothing but amazing. Be sure to check out what they have in store! Oh, and it comes with TypeScript support built-in!
On Air with Orta: Shiki and Twoslash #
Orta Therox from the TypeScript team invited me to be on a pair programming session live on Twitch. It was kind of surprising for me as I didn’t know we would go on air, but I enjoyed using this hour and walk with him through some very interesting Pull Request on fettblog.eu.
It’s about adding Shiki and Twoslash to my 11ty powered website. Shiki is a version of the syntax highlighting engine that powers VSCode, and Twoslash is basically “TypeScript in a Syntax Highlighter”. The idea is that you take the full power of the TypeScript compiler to get error messages, type information, and everything else that makes VSCode so wonderful on a static webpage.
Orta used both tools for the new TypeScript website and the live-stream gives you a good run-down of what’s possible. I’ merged the PR and I’m working to finalize Twoslash to get the same info for my upcoming blog posts.
Being on Orta’s live stream was a TON of fun. And Shiki + Twoslash is an amazing combination.
From the TSConf:EU archives: T-Shirts #
If you have read the previous edition of this newsletter, you remember the piece about Rob Draper, who did the ScriptConf intro and was going to do the T-Shirt design for TSConf:EU.
Since TSConf:EU didn’t happen due to COVID-19, the T-Shirts never came to be. Still, I want to share some images with you so you get a glimpse of how they might have looked like.
The tagline Definitely Hyped was by me. I’m happy that we didn’t put a year to the design, I hope that someday we will be able to make use of those shirts.
Upcoming in the Cinema #
We recently did an online meetup on Rust, with some great talks that people really enjoyed. I especially enjoyed our opener Ryan Levick and his introduction to Rust. He’s showing you Rust from all programming language perspectives. No matter if you develop in TypeScript, JavaScript, C#, Java, C++, Python, Ruby, Swift, Kotlin… He show’s you what to look out for. Check it out:
Oh, and be sure to come by when we meet again! Our second meetup is on Thursday, September 17.
Web components as a compile target #
I had to wrap my head around web components recently and how they seem to be so far off from everything people do in component-based frameworks.
But maybe we should treat them differently. Not as a browser-style version of what we get in component frameworks, but as an API layer or compile target to get our framework based components distributed. Especially when you have to create widgets or design systems that have to work in surroundings that you can’t control.
I have been playing around with that idea and got some really great results with Preact.
I had some questions and hopped on a call with Marvin from the Preact core team. While we were discussing he directly jumped into VSCode and developed a pull request to feature web component slots and carry them over to the Virtual DOM. Nice work!
I’m collecting my thoughts and prepare an article, but I’m also very interested in what you think. Are web components even a topic for you? Are you in a similar situation that you kind of need to support web components even if you don’t get the same results? Or do you think we don’t need anything else but web components to create rich design systems and applications? Drop me a line and let me know.
This also leads me to the project I want to highlight this time.
Interesting projects #
👉 Preact Custom Element — Create a web component out of any Preact component. Includes working with slotted components and web component style nesting.
That’s it for today #
As with everything I do, I’d love to hear from you. Drop me a DM or shoot an e-Mail. I’m happy to discuss all things TypeScript, programming languages, software engineering, and more!
Also, is there a TypeScript topic that you want to see covered? Let me know and I’ll try to craft an article!
See you around 👋