diff --git a/snippets/TypescriptReactSetup.md b/snippets/TypescriptReactSetup.md new file mode 100644 index 000000000..e521602de --- /dev/null +++ b/snippets/TypescriptReactSetup.md @@ -0,0 +1,32 @@ +### Typescript React Component + +To get started with React and Typescript you need to import the React Module. +Next you define your Interface for the Props. Typescript requires that you define the types as well. +After you defined your interfaces you pass them as Type Arguments into the React.Component function call. The first Parameter is for the Props and the second for the State. +As soon as you passed in the Props you are able to display them. + +```tsx +import * as React from "react"; + +interface IProps { + greeting: string; +} + +class TypescriptComponent extends React.Component { + public render(): JSX.Element { + return
{this.props.greeting}
; + } +} + +``` + +```tsx +const htmlNode: HtmlElement = document.getElementById("demoTypescript"); +if (htmlNode) { + ReactDOM.render(, htmlNode); +} +``` + + + +