開源日報 每天推薦一個 GitHub 優質開源項目和一篇精選英文科技或編程文章原文,堅持閱讀《開源日報》,保持每日學習的好習慣。
今日推薦開源項目:《老古董 React95》
今日推薦英文原文:《React Technical Interview Questions》

今日推薦開源項目:《老古董 React95》傳送門:GitHub鏈接
推薦理由:如果你需要一些古老的組件來製造些復古氛圍,而你正好又在使用 React,那麼這個項目就能滿足你的需求——React 的 Window95 風格 UI 組件。當然了,它們還特地為這些組件加入了一些配色主題——不得不承認紫色和粉色實在是有點破壞畫風……不過興許這能讓你的風格別具一格也說不定。

今日推薦英文原文:《React Technical Interview Questions》作者:Gary Bermudez
原文鏈接:https://medium.com/@garybm.17/react-technical-interview-questions-378513c27329
推薦理由:在面試中關於 React 的可能提及的問題

React Technical Interview Questions

Applying for a React job? Here are some technical questions your future employer could ask in an interview.

React is one of the most popular JavaScript libraries for building user interfaces. In addition to learning how to implement the new concepts from this powerful library, you need to become comfortable discussing them too, so you may accurately demonstrate and communicate your skills to potential employers in an interview.

Here are some questions that might help you in that process:

1-What is the difference between a library and a framework? Can you list an example of each?

Both libraries and frameworks are reusable code written by someone.

The technical difference between framework and library lies in a term called inversion of control.

When you use a library, you are in charge of the flow of the application. You are choosing when and where to call the library. When you use a framework, the framework is in charge of the flow. It provides some places for you to plug in your code, but it calls the code you plugged in as needed. The framework inverts the control of the program. It tells the developer what they need. A Library does not. The programmer calls the library where and when they need it.

Libraries: jQuery, React, Bootstrap

Frameworks: Angular, Vue, Rails

2-What does it mean when we say a programming library or language is declarative? How can we tell React components are declarative?

Declarative programming is when you write your code in such a way that describes what you want to do, and not how you want to do it. It is left to the compiler to figure out how.

Difference between declarative/imperative programming:

A declarative style, like what React has, allows you to control flow and state in your application by saying 「It should look like this」. An imperative style turns that around and allows you to control your application by saying 「This is what you should do」.

The benefits of declarative are that you don』t get bogged down in the implementation details of representing the state. Being able to describe the state reduces the surface area for bugs dramatically, which is a benefit. On the other hand, you might have less flexibility on how things occur because you are delegating or abstracting away how you implement state.

3-What is the benefit of using JSX? Make a case for (or against) this technology.

JSX is just an HTML-like syntax, it』s optional, and its purpose is to simplify the creation of React tree module nodes with attributes. It lets you create JavaScript objects with HTML syntax. While not mandatory, developers report that JSX makes developing in React much easier. Nearly all React applications use JSX syntax.

4-Describe what Webpack does in a project

Webpack is a module bundler for javascript applications. Webpack recursively builds every module in your application, then packs all those modules into a small number of bundles.

In addition to the general benefits listed above, Webpack offers a few of its own helpful features:

Flexible Configurations: Webpack supports things called plugins and loaders that can further configure it to work with other tools. We』ll learn more about them in a moment.

Development Server: It also offers a development server that can be configured to re-bundle code every time it changes. This is called hot reloading or hot module replacement. (We』ll work on this in an upcoming lesson.)

5-What are keys in React, and why are they important?

A 「key」 is a special string attribute you need to include when creating lists of elements.

Keys help React identify which items have changed, are added, or are removed. Keys should be given to the elements inside the array to give the elements a stable identity. The best way to pick a key is to use a string that uniquely identifies a list item among its siblings. Most often you would use IDs from your data as keys.

When you don』t have stable IDs for rendered items, you may use the item index as a key as a last resort.

6-Describe React』s reconciliation process used to update the DOM.

Reconciliation is the process through which React updates the DOM. When a component』s state changes, React has to calculate if it is necessary to update the DOM. It does this by creating a virtual DOM and comparing it with the current DOM. In this context, the virtual DOM will contain the new state of the component.

Good Luck!!!
下載開源日報APP:https://openingsource.org/2579/
加入我們:https://openingsource.org/about/join/
關注我們:https://openingsource.org/about/love/