Is it necessary to use inline JavaScript with React? Would React therefore get blocked by default by Content Security Policies (CSPs)?

Question

According to https://www.quora.com/What-are-the-key-difference-between-ReactNative-and-NativeScript/answer/Valentin-Stoychev , "ReactNative as using the notation found in React for inlining the UI declaration in a single file." Is this supposed to mean that when writing React (or ReactNative) code you have to use inline JavaScript?

Would React therefore get blocked by default by a Content Security Policy (CSP)?

According to http://www.asd.gov.au/publications/protect/protecting_web_apps.htm :

A Content Security Policy (CSP) provides security controls which can mitigate attacks such as cross-site scripting (XSS) and other attacks based on introducing malicious or otherwise undesirable content into a web application. A CSP achieves this by specifying a whitelist of content sources for a web application that a compatible browser then enforces. A large variety of content can be controlled using a CSP including scripts, images and audio or video.

By default, a CSP also implements other mitigations beyond whitelisting content sources. The main additional mitigations are:

• Inline JavaScript will not execute: this mitigates the most common types of XSS attacks.
• JavaScript code will not be created from strings: this prevents attackers abusing JavaScript functionality to execute arbitrary JavaScript code.

P.S. I'm totally new to React.

Answer 1

No, that's a totally different thing :-) He simply meant that when you write react, you put the UI directly into the component (although you can of yourse also put it in a separate "template" file and then reuse it).

Something like this:

 class Thing extends React.Component {
     render() {
        return <div>{this.props.text}</div>
    }
 }