diff --git a/App.js b/App.js
index 798e0d5..c9c8034 100644
--- a/App.js
+++ b/App.js
@@ -1,7 +1,4 @@
 /**
- * Sample React Native App
- * https://github.com/facebook/react-native
- *
  * @format
  * @flow strict-local
  */
@@ -9,58 +6,29 @@
 import React from 'react';
 import {
   StyleSheet,
-  ScrollView,
   View,
-  Text,
 } from 'react-native';
 
-import {
-  Header,
-  LearnMoreLinks,
-  Colors,
-} from 'react-native/Libraries/NewAppScreen';
-
 
 class App extends React.Component {
 
   render() {
     return (
-      <ScrollView style={styles.scrollView}>
-        <Header/>
-        <View style={styles.body}>
-          <View>
-            <Text style={styles.sectionTitle}>Learn More</Text>
-            <Text style={styles.sectionDescription}>
-              Read the docs to discover what to do next:
-            </Text>
-          </View>
-          <LearnMoreLinks />
+      <>
+        <UserAccountPanel />
+        <View style={styles.mainLayout}>
+          <NotesMainPanel/>
         </View>
-      </ScrollView>
+      </>
     );
   }
 };
 
 const styles = StyleSheet.create({
-  scrollView: {
-    backgroundColor: Colors.lighter,
-  },
-  body: {
-    backgroundColor: Colors.lighter,
+  mainLayout: {
+    flex: 1,
+    flexDirection: "row",
   },
-  sectionTitle: {
-    fontSize: 24,
-    paddingHorizontal: 24,
-    fontWeight: '600',
-    color: Colors.black,
-  },
-  sectionDescription: {
-    marginTop: 8,
-    fontSize: 18,
-    paddingHorizontal: 24,
-    fontWeight: '400',
-    color: Colors.dark,
-  }
 });
 
 export default App;
diff --git a/index.js b/index.js
index a850d03..7eb0ad0 100644
--- a/index.js
+++ b/index.js
@@ -6,4 +6,8 @@ import {AppRegistry} from 'react-native';
 import App from './App';
 import {name as appName} from './app.json';
 
+import NotesMainPanel from './src/NotesMainPanel';
+import UserAccountPanel from './src/UserAccountPanel';
+import ApplicationSettingsPanel from './src/ApplicationSettingsPanel';
+
 AppRegistry.registerComponent(appName, () => App);
diff --git a/src/ApplicationSettingsPanel.js b/src/ApplicationSettingsPanel.js
new file mode 100644
index 0000000..f2e932f
--- /dev/null
+++ b/src/ApplicationSettingsPanel.js
@@ -0,0 +1,68 @@
+/**
+ * @format
+ * @flow strict-local
+ */
+import React from 'react';
+import {
+  AppRegistry,
+  StyleSheet,
+  Text,
+  TouchableHighlight,
+  View,
+} from 'react-native';
+
+
+class ApplicationSettingsPanel extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      shouldExpand: true
+    };
+  }
+
+  OnResizeButtonPressed = () => {
+    this.setState( (state) => ({ shouldExpand: state.shouldExpand ? false : true}));
+  };
+
+  render() {
+    return(
+      <View style={this.state.shouldExpand ? styles.panel : styles.panelShrinked}>
+        <TouchableHighlight onPress={this.OnResizeButtonPressed}>
+          <View style={styles.panelModeButton}>
+            <Text>Resize</Text>
+          </View>
+        </TouchableHighlight>
+        <View style={styles.panelContent}>
+          <Text>LeftOptionsPanel</Text>
+        </View>
+      </View>
+    );
+  }
+};
+
+
+const styles = StyleSheet.create({
+  panelModeButton: {
+    margin: 10,
+    backgroundColor: "grey",
+  },
+  panelContent: {
+    flex: 1,
+    flexDirection: "column",
+  },
+  panel: {
+    width: "20%",
+    borderWidth: 1,
+    borderColor: "black",
+  },
+  panelShrinked: {
+    width: 50,
+    borderWidth: 1,
+    borderColor: "black",
+  }
+});
+
+
+AppRegistry.registerComponent("ApplicationSettingsPanel", () => ApplicationSettingsPanel);
+
+export default ApplicationSettingsPanel;
diff --git a/src/NotesMainPanel.js b/src/NotesMainPanel.js
new file mode 100644
index 0000000..12b3cf0
--- /dev/null
+++ b/src/NotesMainPanel.js
@@ -0,0 +1,33 @@
+/**
+ * @format
+ * @flow strict-local
+ */
+
+import React from 'react';
+import {
+  AppRegistry,
+  StyleSheet,
+  Text,
+  View,
+} from 'react-native';
+
+
+class NotesMainPanel extends React.Component {
+
+  render() {
+    return(
+      <View>
+        <Text>NotesMainPanel</Text>
+      </View>
+    );
+  }
+};
+
+
+const styles = StyleSheet.create({
+});
+
+
+AppRegistry.registerComponent("NotesMainPanel", () => NotesMainPanel);
+
+export default NotesMainPanel;
diff --git a/src/UserAccountPanel.js b/src/UserAccountPanel.js
new file mode 100644
index 0000000..64706c2
--- /dev/null
+++ b/src/UserAccountPanel.js
@@ -0,0 +1,46 @@
+/**
+ * @format
+ * @flow strict-local
+ */
+
+import React from 'react';
+import {
+  AppRegistry,
+  StyleSheet,
+  Text,
+  View,
+} from 'react-native';
+
+
+class UserAccountPanel extends React.Component {
+
+  render() {
+    return(
+      <View style={styles.panel}>
+        <View style={styles.panelContent}>
+          <Text>UserAccountPanel</Text>
+          <Text>This panel will have all the features of User's account.</Text>
+          <Text><br/>Further implementation will yet be done!</Text>
+        </View>
+      </View>
+    );
+  }
+};
+
+
+const styles = StyleSheet.create({
+  panel: {
+    height: 75,
+    borderColor: "black",
+    borderWidth: 1,
+  },
+  panelContent: {
+    flex: 1,
+    flexDirection: "column",
+  }
+});
+
+
+AppRegistry.registerComponent("UserAccountPanel", () => UserAccountPanel);
+
+export default UserAccountPanel;
diff --git a/windows/ReactNativeNotes/ApplicationSettingsPage.cpp b/windows/ReactNativeNotes/ApplicationSettingsPage.cpp
new file mode 100644
index 0000000..131ac28
--- /dev/null
+++ b/windows/ReactNativeNotes/ApplicationSettingsPage.cpp
@@ -0,0 +1,16 @@
+#include "pch.h"
+#include "ApplicationSettingsPage.h"
+#include "ApplicationSettingsPage.g.cpp"
+
+#include "App.h"
+
+
+namespace winrt::ReactNativeNotes::implementation
+{
+    ApplicationSettingsPage::ApplicationSettingsPage()
+    {
+        InitializeComponent();
+        auto app = Windows::UI::Xaml::Application::Current().as<App>();
+        ReactRootView().ReactNativeHost( app->Host() );
+    }
+}
diff --git a/windows/ReactNativeNotes/ApplicationSettingsPage.h b/windows/ReactNativeNotes/ApplicationSettingsPage.h
new file mode 100644
index 0000000..75bcf96
--- /dev/null
+++ b/windows/ReactNativeNotes/ApplicationSettingsPage.h
@@ -0,0 +1,19 @@
+#pragma once
+
+#include "ApplicationSettingsPage.g.h"
+
+namespace winrt::ReactNativeNotes::implementation
+{
+    class ApplicationSettingsPage : public ApplicationSettingsPageT<ApplicationSettingsPage>
+    {
+    public:
+        ApplicationSettingsPage();
+    };
+}
+
+namespace winrt::ReactNativeNotes::factory_implementation
+{
+    class ApplicationSettingsPage : public ApplicationSettingsPageT<ApplicationSettingsPage, implementation::ApplicationSettingsPage>
+    {
+    };
+}
diff --git a/windows/ReactNativeNotes/ApplicationSettingsPage.idl b/windows/ReactNativeNotes/ApplicationSettingsPage.idl
new file mode 100644
index 0000000..6459091
--- /dev/null
+++ b/windows/ReactNativeNotes/ApplicationSettingsPage.idl
@@ -0,0 +1,8 @@
+namespace ReactNativeNotes
+{
+    [default_interface]
+    runtimeclass ApplicationSettingsPage : Windows.UI.Xaml.Controls.Page
+    {
+        ApplicationSettingsPage();
+    }
+}
diff --git a/windows/ReactNativeNotes/ApplicationSettingsPage.xaml b/windows/ReactNativeNotes/ApplicationSettingsPage.xaml
new file mode 100644
index 0000000..4656fc1
--- /dev/null
+++ b/windows/ReactNativeNotes/ApplicationSettingsPage.xaml
@@ -0,0 +1,15 @@
+<Page
+    x:Class="ReactNativeNotes.ApplicationSettingsPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:ReactNativeNotes"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:react="using:Microsoft.ReactNative"
+    Background="Transparent"
+    mc:Ignorable="d">
+    <react:ReactRootView
+        x:Name="ReactRootView"
+        ComponentName="ApplicationSettingsPanel"
+        MinHeight="400"/>
+</Page>
diff --git a/windows/ReactNativeNotes/MainPage.cpp b/windows/ReactNativeNotes/MainPage.cpp
index 05f9cae..5499247 100644
--- a/windows/ReactNativeNotes/MainPage.cpp
+++ b/windows/ReactNativeNotes/MainPage.cpp
@@ -15,6 +15,37 @@ namespace winrt::ReactNativeNotes::implementation
     {
         InitializeComponent();
         auto app = Application::Current().as<App>();
-        ReactRootView().ReactNativeHost(app->Host());
     }
-}
+
+    void MainPage::TopNavigationPanel_ItemInvoked( Windows::UI::Xaml::Controls::NavigationView const& sender, Windows::UI::Xaml::Controls::NavigationViewItemInvokedEventArgs const& args )
+    {
+        if( args.IsSettingsInvoked() == true )
+        {
+            Navigate( L"ApplicationSettingsPage" );
+        }
+        else if( args.InvokedItemContainer() != nullptr )
+        {
+            auto selectedPageTag = unbox_value_or<hstring>( args.InvokedItemContainer().Tag(), L"" );
+            Navigate( selectedPageTag );
+        }
+    }
+
+    void MainPage::TopNavigationPanel_BackRequested( Windows::UI::Xaml::Controls::NavigationView const& sender, Windows::UI::Xaml::Controls::NavigationViewBackRequestedEventArgs const& args )
+    {
+    }
+
+    void MainPage::Navigate( winrt::hstring pageName ) noexcept
+    {
+        auto pageToNavigateTo = Windows::UI::Xaml::Interop::TypeName
+        {
+            to_hstring( L"ReactNativeNotes." + pageName ),
+            Windows::UI::Xaml::Interop::TypeKind::Custom
+        };
+        auto navigationAnimation = Windows::UI::Xaml::Media::Animation::SlideNavigationTransitionInfo();
+        navigationAnimation.Effect( Windows::UI::Xaml::Media::Animation::SlideNavigationTransitionEffect::FromLeft );
+        ApplicationContentFrame().Navigate( pageToNavigateTo, nullptr, navigationAnimation );
+    }
+} 
+
+
+
diff --git a/windows/ReactNativeNotes/MainPage.h b/windows/ReactNativeNotes/MainPage.h
index 7e7eed2..e8ea421 100644
--- a/windows/ReactNativeNotes/MainPage.h
+++ b/windows/ReactNativeNotes/MainPage.h
@@ -1,18 +1,26 @@
 #pragma once
 #include "MainPage.g.h"
 #include <winrt/Microsoft.ReactNative.h>
+#include <string>
+
 
 namespace winrt::ReactNativeNotes::implementation
 {
-    struct MainPage : MainPageT<MainPage>
+    class MainPage : public MainPageT<MainPage>
     {
+    public:
         MainPage();
+        void TopNavigationPanel_ItemInvoked( Windows::UI::Xaml::Controls::NavigationView const& sender, Windows::UI::Xaml::Controls::NavigationViewItemInvokedEventArgs const& args );
+        void TopNavigationPanel_BackRequested( Windows::UI::Xaml::Controls::NavigationView const& sender, Windows::UI::Xaml::Controls::NavigationViewBackRequestedEventArgs const& args );
+
+    private:
+        void Navigate( winrt::hstring pageName ) noexcept;
     };
 }
 
 namespace winrt::ReactNativeNotes::factory_implementation
 {
-    struct MainPage : MainPageT<MainPage, implementation::MainPage>
+    class MainPage : public MainPageT<MainPage, implementation::MainPage>
     {
     };
 }
diff --git a/windows/ReactNativeNotes/MainPage.xaml b/windows/ReactNativeNotes/MainPage.xaml
index 56e80e8..78cde15 100644
--- a/windows/ReactNativeNotes/MainPage.xaml
+++ b/windows/ReactNativeNotes/MainPage.xaml
@@ -7,10 +7,13 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     mc:Ignorable="d"
-    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
-    <react:ReactRootView 
-        x:Name="ReactRootView"
-        ComponentName="ReactNativeNotes"
-        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
-        MinHeight="400"/>
+    Background="Transparent">
+    <NavigationView x:Name="TopNavigationPanel" PaneDisplayMode="Top" ItemInvoked="TopNavigationPanel_ItemInvoked" BackRequested="TopNavigationPanel_BackRequested">
+        <NavigationView.MenuItems>
+            <NavigationViewItem  Content="Account" Tag="UserAccountPage" />
+            <NavigationViewItem  Content="Settings" Tag="ApplicationSettingsPage" />
+            <NavigationViewItem  Content="Notes" Tag="NotesPage" />
+        </NavigationView.MenuItems>
+        <Frame x:Name="ApplicationContentFrame"/>
+    </NavigationView>
 </Page>
diff --git a/windows/ReactNativeNotes/NotesPage.cpp b/windows/ReactNativeNotes/NotesPage.cpp
new file mode 100644
index 0000000..4d2778f
--- /dev/null
+++ b/windows/ReactNativeNotes/NotesPage.cpp
@@ -0,0 +1,16 @@
+#include "pch.h"
+#include "NotesPage.h"
+#include "NotesPage.g.cpp"
+
+#include "App.h"
+
+
+namespace winrt::ReactNativeNotes::implementation
+{
+    NotesPage::NotesPage()
+    {
+        InitializeComponent();
+        auto app = Windows::UI::Xaml::Application::Current().as<App>();
+        ReactRootView().ReactNativeHost( app->Host() );
+    }
+}
diff --git a/windows/ReactNativeNotes/NotesPage.h b/windows/ReactNativeNotes/NotesPage.h
new file mode 100644
index 0000000..0c441f7
--- /dev/null
+++ b/windows/ReactNativeNotes/NotesPage.h
@@ -0,0 +1,20 @@
+#pragma once
+
+#include "NotesPage.g.h"
+#include <winrt/Microsoft.ReactNative.h>
+
+namespace winrt::ReactNativeNotes::implementation
+{
+    class NotesPage : public NotesPageT<NotesPage>
+    {
+    public:
+        NotesPage();
+    };
+}
+
+namespace winrt::ReactNativeNotes::factory_implementation
+{
+    class NotesPage : public NotesPageT<NotesPage, implementation::NotesPage>
+    {
+    };
+}
diff --git a/windows/ReactNativeNotes/NotesPage.idl b/windows/ReactNativeNotes/NotesPage.idl
new file mode 100644
index 0000000..a5b15d7
--- /dev/null
+++ b/windows/ReactNativeNotes/NotesPage.idl
@@ -0,0 +1,8 @@
+namespace ReactNativeNotes
+{
+    [default_interface]
+    runtimeclass NotesPage : Windows.UI.Xaml.Controls.Page
+    {
+        NotesPage();
+    }
+}
diff --git a/windows/ReactNativeNotes/NotesPage.xaml b/windows/ReactNativeNotes/NotesPage.xaml
new file mode 100644
index 0000000..9a38813
--- /dev/null
+++ b/windows/ReactNativeNotes/NotesPage.xaml
@@ -0,0 +1,15 @@
+<Page
+    x:Class="ReactNativeNotes.NotesPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:ReactNativeNotes"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:react="using:Microsoft.ReactNative"
+    Background="Transparent"
+    mc:Ignorable="d">
+    <react:ReactRootView
+        x:Name="ReactRootView"
+        ComponentName="NotesMainPanel"
+        MinHeight="400"/>
+</Page>
diff --git a/windows/ReactNativeNotes/ReactNativeNotes.vcxproj b/windows/ReactNativeNotes/ReactNativeNotes.vcxproj
index 76d436c..047a83d 100644
--- a/windows/ReactNativeNotes/ReactNativeNotes.vcxproj
+++ b/windows/ReactNativeNotes/ReactNativeNotes.vcxproj
@@ -14,7 +14,7 @@
     <ApplicationType>Windows Store</ApplicationType>
     <ApplicationTypeRevision>10.0</ApplicationTypeRevision>
     <WindowsTargetPlatformVersion Condition=" '$(WindowsTargetPlatformVersion)' == '' ">10.0.18362.0</WindowsTargetPlatformVersion>
-    <WindowsTargetPlatformMinVersion>10.0.16299.0</WindowsTargetPlatformMinVersion>
+    <WindowsTargetPlatformMinVersion>10.0.17763.0</WindowsTargetPlatformMinVersion>
     <PackageCertificateKeyFile>ReactNativeNotes_TemporaryKey.pfx</PackageCertificateKeyFile>
     <PackageCertificateThumbprint>2D6D803E40573C229AE14FFCCBB1DAD20B244DC4</PackageCertificateThumbprint>
     <PackageCertificatePassword>password</PackageCertificatePassword>
@@ -71,7 +71,8 @@
     <LinkIncremental>false</LinkIncremental>
   </PropertyGroup>
   <Import Project="$(VCTargetsPath)\Microsoft.Cpp.props" />
-  <ImportGroup Label="ExtensionSettings"></ImportGroup>
+  <ImportGroup Label="ExtensionSettings">
+  </ImportGroup>
   <ImportGroup Label="PropertySheets">
     <Import Project="$(UserRootDir)\Microsoft.Cpp.$(Platform).user.props" Condition="exists('$(UserRootDir)\Microsoft.Cpp.$(Platform).user.props')" Label="LocalAppDataPlatform" />
   </ImportGroup>
@@ -108,12 +109,24 @@
       <DependentUpon>MainPage.xaml</DependentUpon>
       <SubType>Code</SubType>
     </ClInclude>
+    <ClInclude Include="NotesPage.h">
+      <DependentUpon>NotesPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClInclude>
     <ClInclude Include="ReactPackageProvider.h" />
     <ClInclude Include="AutolinkedNativeModules.g.h" />
     <ClInclude Include="pch.h" />
     <ClInclude Include="App.h">
       <DependentUpon>App.xaml</DependentUpon>
     </ClInclude>
+    <ClInclude Include="UserAccountPage.h">
+      <DependentUpon>UserAccountPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClInclude>
+    <ClInclude Include="ApplicationSettingsPage.h">
+      <DependentUpon>ApplicationSettingsPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClInclude>
   </ItemGroup>
   <ItemGroup>
     <ApplicationDefinition Include="App.xaml">
@@ -139,6 +152,10 @@
       <DependentUpon>MainPage.xaml</DependentUpon>
       <SubType>Code</SubType>
     </ClCompile>
+    <ClCompile Include="NotesPage.cpp">
+      <DependentUpon>NotesPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClCompile>
     <ClCompile Include="ReactPackageProvider.cpp" />
     <ClCompile Include="AutolinkedNativeModules.g.cpp" />
     <ClCompile Include="pch.cpp">
@@ -148,6 +165,14 @@
       <DependentUpon>App.xaml</DependentUpon>
     </ClCompile>
     <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
+    <ClCompile Include="UserAccountPage.cpp">
+      <DependentUpon>UserAccountPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClCompile>
+    <ClCompile Include="ApplicationSettingsPage.cpp">
+      <DependentUpon>ApplicationSettingsPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClCompile>
   </ItemGroup>
   <ItemGroup>
     <Midl Include="App.idl">
@@ -157,6 +182,18 @@
       <DependentUpon>MainPage.xaml</DependentUpon>
       <SubType>Code</SubType>
     </Midl>
+    <Midl Include="NotesPage.idl">
+      <DependentUpon>NotesPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Midl>
+    <Midl Include="UserAccountPage.idl">
+      <DependentUpon>UserAccountPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Midl>
+    <Midl Include="ApplicationSettingsPage.idl">
+      <DependentUpon>ApplicationSettingsPage.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Midl>
   </ItemGroup>
   <ItemGroup>
     <None Include="packages.config" />
@@ -169,6 +206,15 @@
     <Page Include="MainPage.xaml">
       <SubType>Designer</SubType>
     </Page>
+    <Page Include="NotesPage.xaml">
+      <SubType>Designer</SubType>
+    </Page>
+    <Page Include="UserAccountPage.xaml">
+      <SubType>Designer</SubType>
+    </Page>
+    <Page Include="ApplicationSettingsPage.xaml">
+      <SubType>Designer</SubType>
+    </Page>
   </ItemGroup>
   <Import Project="$(VCTargetsPath)\Microsoft.Cpp.targets" />
   <ImportGroup Label="ReactNativeWindowsTargets">
@@ -193,4 +239,4 @@
     <Error Condition="!Exists('..\packages\Microsoft.Windows.CppWinRT.2.0.200615.7\build\native\Microsoft.Windows.CppWinRT.targets')" Text="$([System.String]::Format('$(ErrorText)', '..\packages\Microsoft.Windows.CppWinRT.2.0.200615.7\build\native\Microsoft.Windows.CppWinRT.targets'))" />
     <Error Condition="!Exists('..\packages\$(WinUIPackageName).$(WinUIPackageVersion)\build\native\$(WinUIPackageName).targets')" Text="$([System.String]::Format('$(ErrorText)', '..\packages\$(WinUIPackageName).$(WinUIPackageVersion)\build\native\$(WinUIPackageName).targets'))" />
   </Target>
-</Project>
+</Project>
\ No newline at end of file
diff --git a/windows/ReactNativeNotes/ReactNativeNotes.vcxproj.filters b/windows/ReactNativeNotes/ReactNativeNotes.vcxproj.filters
index 2aa08b7..a0dc1bc 100644
--- a/windows/ReactNativeNotes/ReactNativeNotes.vcxproj.filters
+++ b/windows/ReactNativeNotes/ReactNativeNotes.vcxproj.filters
@@ -59,5 +59,8 @@
   </ItemGroup>
   <ItemGroup>
     <Page Include="MainPage.xaml" />
+    <Page Include="NotesPage.xaml" />
+    <Page Include="UserAccountPage.xaml" />
+    <Page Include="ApplicationSettingsPage.xaml" />
   </ItemGroup>
 </Project>
\ No newline at end of file
diff --git a/windows/ReactNativeNotes/UserAccountPage.cpp b/windows/ReactNativeNotes/UserAccountPage.cpp
new file mode 100644
index 0000000..23536ae
--- /dev/null
+++ b/windows/ReactNativeNotes/UserAccountPage.cpp
@@ -0,0 +1,16 @@
+#include "pch.h"
+#include "UserAccountPage.h"
+#include "UserAccountPage.g.cpp"
+
+#include "App.h"
+
+
+namespace winrt::ReactNativeNotes::implementation
+{
+    UserAccountPage::UserAccountPage()
+    {
+        InitializeComponent();
+        auto app = Windows::UI::Xaml::Application::Current().as<App>();
+        ReactRootView().ReactNativeHost( app->Host() );
+    }
+}
diff --git a/windows/ReactNativeNotes/UserAccountPage.h b/windows/ReactNativeNotes/UserAccountPage.h
new file mode 100644
index 0000000..2cc2356
--- /dev/null
+++ b/windows/ReactNativeNotes/UserAccountPage.h
@@ -0,0 +1,19 @@
+#pragma once
+
+#include "UserAccountPage.g.h"
+
+namespace winrt::ReactNativeNotes::implementation
+{
+    class UserAccountPage : public UserAccountPageT<UserAccountPage>
+    {
+    public:
+        UserAccountPage();
+    };
+}
+
+namespace winrt::ReactNativeNotes::factory_implementation
+{
+    class UserAccountPage : public UserAccountPageT<UserAccountPage, implementation::UserAccountPage>
+    {
+    };
+}
diff --git a/windows/ReactNativeNotes/UserAccountPage.idl b/windows/ReactNativeNotes/UserAccountPage.idl
new file mode 100644
index 0000000..196446a
--- /dev/null
+++ b/windows/ReactNativeNotes/UserAccountPage.idl
@@ -0,0 +1,8 @@
+namespace ReactNativeNotes
+{
+    [default_interface]
+    runtimeclass UserAccountPage : Windows.UI.Xaml.Controls.Page
+    {
+        UserAccountPage();
+    }
+}
diff --git a/windows/ReactNativeNotes/UserAccountPage.xaml b/windows/ReactNativeNotes/UserAccountPage.xaml
new file mode 100644
index 0000000..0a6161b
--- /dev/null
+++ b/windows/ReactNativeNotes/UserAccountPage.xaml
@@ -0,0 +1,15 @@
+<Page
+    x:Class="ReactNativeNotes.UserAccountPage"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:ReactNativeNotes"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:react="using:Microsoft.ReactNative"
+    Background="Transparent"
+    mc:Ignorable="d">
+    <react:ReactRootView
+        x:Name="ReactRootView"
+        ComponentName="UserAccountPanel"
+        MinHeight="400"/>
+</Page>
diff --git a/windows/ReactNativeNotes/pch.h b/windows/ReactNativeNotes/pch.h
index 13f3eec..4c800f1 100644
--- a/windows/ReactNativeNotes/pch.h
+++ b/windows/ReactNativeNotes/pch.h
@@ -16,6 +16,7 @@
 #include <winrt/Windows.UI.Xaml.Markup.h>
 #include <winrt/Windows.UI.Xaml.Navigation.h>
 #include <winrt/Windows.UI.Xaml.h>
+#include <winrt/Windows.UI.Xaml.Media.Animation.h>
 
 #include <winrt/Microsoft.ReactNative.h>