Delicious value: 🌟🌟🌟🌟🌟
Flavor: mango mango coconut
Summary of this issue
- TypeScript 4.9 Beta
- Monorepo Handbook Freshly Released
- 92nd TC39 meeting
- Convert StoryBook Stories to Figma Components
- Getting Started with Playwright Component Testing
- Guidelines for writing junk code
- React I love you, but you let me down
- Chrome Devtools debugging tips I wish I knew sooner
Hello everyone, my name is Tong Oppa. Welcome to this issue of Front-end Canteen Technology Weekly, let's take a look at last week's technical information.
Technical Information
1. TypeScript 4.9 Beta
TypeScript 4.9 Beta comes with a new satisfies operator with the following main features:
- new satisfies operator;
- Enhanced in operator;
- stricter NaN checking;
- Optimize File-Watching, use file system events, and reduce polling;
- Provide better types for Promise.resolve;
- Keep imports in JS files;
- Fixed the priority of Exports and typeVersions;
- Optimized Substitution type.
2. The Monorepo Handbook is freshly released
The TurboRepo team recently released the Monorepo Handbook, which contains everything you need to know about Monorepo and provides detailed configuration examples, as follows:
- What is Monorepo?
- Install packages (npm, pnpm, Yarn 1, Yarn >=2)
- Workspaces
- Migrate to Monorepo
- task scheduling
- Construct
- Docker deployment
- shared code
- Lint
- test
- Release (Changesets)
- @manypkg/cli handles package version dependencies
3. The 92nd TC39 meeting
The progress of the meeting is as follows:
- Stage3: Array.fromAsync
- Stage2: Well-Formed Unicode Strings
- State1: Extractors
Now let's look at the technical data.
Technical Information
1. Convert StoryBook Stories to Figma components
‹div›RIOTS
Developed by the team story.to.design
The Figma plugin can convert StoryBook's Stories into components in Figma. They also posted a blog post 5 reasons why every design team needs story.to.design .
- Reduce variance between code and design;
- Use the exact same components in design as in production;
- Speed up design and prototyping;
- The cross-tool design system is more convenient to update;
- Speak the same (component) language as the developer.
2. Getting Started with Playwright Component Testing
Playwright now experimentally supports component testing, this article provides examples of component testing for React, Vue, Svelte frameworks.
3. Junk code writing guidelines
Please forward this repository to the colleague who wrote the code that gave you headaches and tell him: 你写的每一行代码都是你的名片。
If he understands, he will sincerely thank you and invite you to dinner.
4. React I love you, but you let me down
François Zaninotto, CEO of Marmelab, published this long article, raising some of the existing pain points of the React framework, and frankly admitting that the quality of the React community and ecosystem overshadows React itself.
React team member Dan then responded .
5. Chrome Devtools debugging skills I wish I knew earlier
- Add conditional breakpoints;
- Use
$i('name')
to install the npm package in the console; - Resend the XHR request;
- Quickly switch theme colors;
- Quickly send requests in the console;
- Copy JavaScript variables;
- Get the selected DOM element in the console;
- Capture full-size screenshots;
- expand all child nodes;
- Use
$
to get the result of the last execution; - Use
$
and$$
to quickly select DOM elements.
other information
Good article recommended
Let's take a look at the good articles recommended. The good articles recommended this week are:
1. Introduction to Remesh: DDD framework for developing large and complex web apps
2. From 0 to 10 million: the evolution history of Bilibili’s live broadcast architecture
Well, the above is this issue of Canteen Weekly. If the audience members think it's not bad, one-click three-link is the biggest support for canteen bosses.
Your front-end canteen, eat every meal, see you next time.
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。