Sindre Sorhus, one of the most prolific engineers in the Node.js community, released his 1,000th NPM package this week. According to NPM, Sindre Sorhus accounts for 12% of all downloads. How do you feel when you see this? In addition, some wonderful articles I have translated into Chinese to zhihu column, not included in the front weekly. Enjoy this week’s picks below!

Technology of dynamic

Google launches AutoDraw, an artificial intelligence drawing tool

AutoDraw is an artificial intelligence drawing tool from Google that uses your manuscript as heuristic information and then lists what you might want to draw. It might be very helpful for students who have trouble drawing. If you don’t draw, you can use it as a toy. Why is it in front weekly? Aren’t you interested in what the front end does?

Vue Conf 2017 registration entry

The world’s first Vue.js Developer Conference will be held in the Conference Center of the new main building of Beihang University on May 20, 2017. The author of vue.js will attend the conference and deliver a keynote speech. Here is the entrance for registration, the early bird tickets were snatched up that day, if you have a girlfriend, you can bring there, ha ha!

Wechat official account can be cancelled

Wechat’s official account recently announced that it supports self-cancellation, allowing users to initiate the cancellation process in the background of their official account after verifying their identity information or verifying the main body of their account. After the account is cancelled, the number of registration, operator id card information, mobile phone number, account nickname, administrator’s wechat account, registered mailbox, etc., can be released.

How do you evaluate Microsoft’s open source ActXP?

Microsoft is making more moves in the open source space. Last week, it launched ReactXP, a cross-platform React application. Check out the discussion on Zhihu.

The article tutorial

Illustrate the scrolling anchoring mechanism in Chrome

Saw this, again with Google to do the product the user experience is doing, don’t know you haven’t met, opens a page long, already start reading, page suddenly jumped, lost your browsing schedule, usually because you see the contents of the above and not loaded content, squeeze the content below before loading finished it, Generates the perception of page hopping. Chrome has addressed this experience problem with a technology called scrollanchroing, which is detailed at a link in this article.

Integrate nuxt.js into existing Node.js projects

Feathers is the MVC framework of Node.js. Of course, most students in the company will not start a new project from scratch. This article explains how to integrate Nuxt.js into the Feathers application, which is also useful for other MVC frameworks.

Cool shell: How do I refactor “arrow” code?

“Arrow type code” if too many nested, may look beautiful, because of symmetry, but want to vomiting blood, to read for too long, will be quite easy to maintain code of the people (including yourself) lost in the code, because I saw the innermost code, you no longer know in front of the layers and layers of condition is what kind of judgment, how code is running here, so, So how could you not write this code? This article provides some ideas.

How does Coverage work in Chrome?

This week I posted a post about the runtime code coverage feature in Chrome Canary, which looks at how it works from a source code level.

The development tools

GitHub: Open source project o&M automation toolkit

GitHub has a list of tools to help you run and maintain open source projects. It automates most of your daily operations, such as code style checks, continuous integration, package management, change log generation, automatic search for Reviewer, and dependency package expiration alerts. To be honest, most of these tools can be used in in-house engineering practices, if you’re willing to take the time to learn.

Alinode: Application performance management solution based on node.js runtime

Official: Alinode is a Node.js application service solution produced by Ali Cloud, which helps developers quickly see performance details, quickly locate difficult problems, and get to the root of the problem. My view: no investigation will not have the right to speak, ready to use in the near future, after the summary of experience.

The code framework

React Native wechat integration example

The React Native repository integrates wechat login, favorites, sharing, and payment functions with Android and iOS versions. If you’ve been researching React Native recently, you’re likely going to need something similar next.

VMS: CMS system based on vue. js 2.0

Two similar projects have been included. The front end is similar to VUe-admin, but it contains a complete Node.js back end, with relatively simple permission control (slightly simple for complex applications), and integrates common components required by background management: Such as WangEditor rich text editor, lightweight Markdown editor, qiniuyun picture upload, aurora push and so on.

Video tutorial

Build ue. Js server rendering application using nuxt. js and Vuex

What nuxt.js and Vuex are is not a trivial matter. Egghead. IO is a course from 0 on how to organize application code using nuxt.js and Vuex to manage state.

Good question and answer

Toolingtips: How to display line numbers by default when git grep

Git may be familiar to many people. The grep self-command can be used for quick search, but the default search result does not show which line of the matched code, which is not conducive to efficiency improvement, because it is very likely that you have to search the file again after locating the line, why not do it in one step? Look at the second answer here, when modifying the file ~/.gitconfig.

Toolingtips: How to efficiently manipulate Finder and screenshots on Mac

Mac File System Manager Finder and screenshots are common to many people. There are some tips in this post that can help you get more done with less effort, at least without relying on third-party software. Are you sure to check them out? Notice the first and third answers.

Toolingtips: How to get Mongoose to fill nested association fields

The association between more than three tables is common in a complex business. Mongoose uses a query syntax to populate an association table. How do YOU populate nested association tables? Look at the second answer here. Make fun of the Mongoose document. It’s disgusting.

One More Thing

This article is translated by Wang Shijun. For commercial reprint, please contact the author for authorization. For non-commercial reprint, please indicate the source. If you found this article helpful, please give it a thumbs up! If you have any questions about the content of this article, please leave a comment. Want to know what I’ll write next? Welcome to subscribe zhihu column: “Front End Weekly: Keep you up to date in the front End field”.

Happy Hacking