diff --git a/client/src/AuthenticatedApp.tsx b/client/src/AuthenticatedApp.tsx
index 5585b81..fcf46d0 100644
--- a/client/src/AuthenticatedApp.tsx
+++ b/client/src/AuthenticatedApp.tsx
@@ -49,14 +49,10 @@ interface IAppState {
 }
 
 export class AuthenticatedApp extends React.Component<{}, IAppState> {
-  public constructor(props: {}) {
-    super(props);
-
-    this.state = {
-      currentUser: null,
-      isLoading: true
-    };
-  }
+  public readonly state: IAppState = {
+    currentUser: null,
+    isLoading: true
+  };
 
   public componentDidMount(): void {
     AuthenticatedServerApi.get("users/me")
diff --git a/client/src/common/ErrorBoundary.tsx b/client/src/common/ErrorBoundary.tsx
index d0d7a82..d7a3afe 100644
--- a/client/src/common/ErrorBoundary.tsx
+++ b/client/src/common/ErrorBoundary.tsx
@@ -8,10 +8,9 @@ interface IErrorBoundaryState {
 }
 
 export class ErrorBoundary extends React.PureComponent<{}, IErrorBoundaryState> {
-  public constructor(props: {}) {
-    super(props);
-    this.state = { error: undefined };
-  }
+  public readonly state: IErrorBoundaryState = {
+    error: undefined
+  };
 
   public static ensureError(component: React.Component, error: Error) {
     component.setState(() => {
diff --git a/client/src/common/Header.tsx b/client/src/common/Header.tsx
index deb8a63..a2358c0 100644
--- a/client/src/common/Header.tsx
+++ b/client/src/common/Header.tsx
@@ -39,13 +39,11 @@ interface IHeaderState {
 }
 
 export class Header extends React.PureComponent<IHeaderProps, IHeaderState> {
-  public constructor(props: IHeaderProps) {
-    super(props);
-
-    this.state = {
-      title: ""
-    };
+  public readonly state: IHeaderState = {
+    title: ""
+  };
 
+  public componentDidMount(): void {
     new Typer("engraved.").startTyping((typedText: string) => this.setState({ title: typedText }));
   }
 
diff --git a/client/src/common/form/fields/markdown/Markdown.tsx b/client/src/common/form/fields/markdown/Markdown.tsx
index 54b6b33..a6062a5 100644
--- a/client/src/common/form/fields/markdown/Markdown.tsx
+++ b/client/src/common/form/fields/markdown/Markdown.tsx
@@ -118,13 +118,9 @@ interface IMarkdownState {
 const tocSeparator = "---ngrvd-separator---";
 
 export class Markdown extends React.PureComponent<IMarkdownProps, IMarkdownState> {
-  public constructor(props: IMarkdownProps) {
-    super(props);
-
-    this.state = {
-      isTocExpanded: false
-    };
-  }
+  public readonly state: IMarkdownState = {
+    isTocExpanded: false
+  };
 
   public render(): ReactNode {
     if (!this.props.markdown || !this.props.markdown.trim()) {
diff --git a/client/src/common/form/fields/markdown/MarkdownField.tsx b/client/src/common/form/fields/markdown/MarkdownField.tsx
index 3231584..2f43c17 100644
--- a/client/src/common/form/fields/markdown/MarkdownField.tsx
+++ b/client/src/common/form/fields/markdown/MarkdownField.tsx
@@ -42,13 +42,9 @@ interface IMarkdownFieldState {
 }
 
 export class MarkdownField extends React.PureComponent<IMarkdownFieldProps, IMarkdownFieldState> {
-  public constructor(props: IMarkdownFieldProps) {
-    super(props);
-
-    this.state = {
-      isPreview: false
-    };
-  }
+  public readonly state: IMarkdownFieldState = {
+    isPreview: false
+  };
 
   public render(): ReactNode {
     return (
diff --git a/client/src/common/searchBox/SearchBox.tsx b/client/src/common/searchBox/SearchBox.tsx
index fc569c7..980c4a0 100644
--- a/client/src/common/searchBox/SearchBox.tsx
+++ b/client/src/common/searchBox/SearchBox.tsx
@@ -65,15 +65,11 @@ interface ISearchBoxState {
 export class SearchBox extends React.Component<ISearchBoxProps, ISearchBoxState> {
   private node: HTMLDivElement;
 
-  public constructor(props: ISearchBoxProps) {
-    super(props);
-
-    this.state = {
-      showDropDown: true,
-      hidePlaceholder: false,
-      hasFocus: false
-    };
-  }
+  public readonly state: ISearchBoxState = {
+    showDropDown: true,
+    hidePlaceholder: false,
+    hasFocus: false
+  };
 
   public render(): ReactNode {
     return (
diff --git a/client/src/items/url/ViewUrlItem.tsx b/client/src/items/url/ViewUrlItem.tsx
index 13287d9..dbc5325 100644
--- a/client/src/items/url/ViewUrlItem.tsx
+++ b/client/src/items/url/ViewUrlItem.tsx
@@ -52,13 +52,9 @@ export class ViewUrlItem extends React.PureComponent<IViewItemProps<IUrlItem>, I
 
   private imageAnchorEl: HTMLImageElement;
 
-  public constructor(props: IViewItemProps<IUrlItem>) {
-    super(props);
-
-    this.state = {
-      showFallbackIcon: false
-    };
-  }
+  public readonly state: IViewUrlItemState = {
+    showFallbackIcon: false
+  };
 
   public render(): ReactNode {
     return (
diff --git a/client/src/notifications/Notifications.tsx b/client/src/notifications/Notifications.tsx
index 3bc5d70..0f8277a 100644
--- a/client/src/notifications/Notifications.tsx
+++ b/client/src/notifications/Notifications.tsx
@@ -57,13 +57,9 @@ interface INotificationsState {
 export class Notifications extends React.PureComponent<{}, INotificationsState> {
   private notifications$Subscription: Subscription;
 
-  public constructor(props: {}) {
-    super(props);
-
-    this.state = {
-      notifications: []
-    };
-  }
+  public readonly state: INotificationsState = {
+    notifications: []
+  };
 
   public componentDidMount(): void {
     this.notifications$Subscription = NotificationStore.instance.notifications$.subscribe(
diff --git a/client/src/pages/search/GlobalSearchBox.tsx b/client/src/pages/search/GlobalSearchBox.tsx
index 135e8a6..6af0289 100644
--- a/client/src/pages/search/GlobalSearchBox.tsx
+++ b/client/src/pages/search/GlobalSearchBox.tsx
@@ -44,31 +44,27 @@ interface IGlobalSearchBoxState {
 export class GlobalSearchBox extends React.PureComponent<{}, IGlobalSearchBoxState> {
   private findOnTypeTimer: any;
 
-  private keywordsSubscription: Subscription;
-
-  public constructor(props: {}) {
-    super(props);
-
-    this.state = {
-      searchValue: ItemStore.instance.searchText,
-      keywordSearchValue: "",
-      showDropDown: true,
-      actionDropDownItems: [],
-      keywordDropDownItems: [],
-      selectedKeywords: [],
-      redirectToUrl: null
-    };
-  }
+  private keywords$Subscription: Subscription;
+
+  public readonly state: IGlobalSearchBoxState = {
+    searchValue: ItemStore.instance.searchText,
+    keywordSearchValue: "",
+    showDropDown: true,
+    actionDropDownItems: [],
+    keywordDropDownItems: [],
+    selectedKeywords: [],
+    redirectToUrl: null
+  };
 
   public componentDidMount(): void {
-    this.keywordsSubscription = ItemStore.instance.keywords$.subscribe(keywords =>
+    this.keywords$Subscription = ItemStore.instance.keywords$.subscribe(keywords =>
       this.setState({ selectedKeywords: keywords })
     );
   }
 
   public componentWillUnmount(): void {
-    if (this.keywordsSubscription) {
-      this.keywordsSubscription.unsubscribe();
+    if (this.keywords$Subscription) {
+      this.keywords$Subscription.unsubscribe();
     }
   }
 
diff --git a/client/src/pages/search/results/ItemsList.tsx b/client/src/pages/search/results/ItemsList.tsx
index e5873d4..f9a247e 100644
--- a/client/src/pages/search/results/ItemsList.tsx
+++ b/client/src/pages/search/results/ItemsList.tsx
@@ -23,11 +23,9 @@ interface IListOfItemsState {
 export class ItemsList extends React.PureComponent<{}, IListOfItemsState> {
   private items$Subscription: Subscription;
 
-  public constructor(props: {}) {
-    super(props);
-
-    this.state = { items: [] };
-  }
+  public readonly state: IListOfItemsState = {
+    items: []
+  };
 
   public componentDidMount(): void {
     this.items$Subscription = ItemStore.instance.items$.subscribe(