diff --git a/src/App.fs b/src/App.fs
index 3e08cd4..023094f 100755
--- a/src/App.fs
+++ b/src/App.fs
@@ -1,12 +1,10 @@
-module App
+module Root
 
 open Feliz
 open Browser.Dom
 open Fable.Core.JsInterop
 
-
 importSideEffects "./index.css"
 
-
 let root = ReactDOM.createRoot(document.getElementById "root")
-root.render(App.Components.Counter())
\ No newline at end of file
+root.render(App.Main.El())
\ No newline at end of file
diff --git a/src/App.fsproj b/src/App.fsproj
index 023405e..aed95ec 100755
--- a/src/App.fsproj
+++ b/src/App.fsproj
@@ -5,8 +5,9 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <Compile Include="Components.fs" />
-    <Compile Include="Components.test.fs" />
+    <Compile Include="components/Counter.fs" />
+    <Compile Include="Main.fs" />
+    <Compile Include="Main.test.fs" />
     <Compile Include="App.fs" />
   </ItemGroup>
 
diff --git a/src/Components.fs b/src/Main.fs
similarity index 75%
rename from src/Components.fs
rename to src/Main.fs
index 2e95f6e..0779766 100755
--- a/src/Components.fs
+++ b/src/Main.fs
@@ -4,12 +4,11 @@ open Feliz
 open Fable.Core
 open Fable.Core.JsInterop
 
-type Components() = 
+module Main =
 
     [<ReactComponent>]
-    static member Counter() =
-        let (count, setCount) = React.useState(0)
-
+    let El() =
+        
         let viteLogo: unit -> unit = import "default" "./assets/vite.svg"
         let reactLogo: unit -> unit = import "default" "./assets/react.svg"
         importSideEffects "./App.css"
@@ -51,20 +50,7 @@ type Components() =
                 ]
             ]
             Html.h1 "Vite + React + Feliz"
-            Html.div [
-                prop.className "card"
-                prop.children [
-                    Html.button [
-                        prop.onClick (fun _ -> setCount(count + 1))
-                        prop.text $"count is {count}"
-                    ]
-                    Html.p [
-                        Html.text "Edit "
-                        Html.code "src/App.fs"
-                        Html.text " and save to test HMR"
-                    ]
-                ]
-            ]
+            Components.Counter.El()
             Html.p [
                 prop.className "read-the-docs"
                 prop.text " Click on the Vite, React or Fable Vite Plugin logos to learn more"
diff --git a/src/Components.test.fs b/src/Main.test.fs
similarity index 94%
rename from src/Components.test.fs
rename to src/Main.test.fs
index 2f7e2ec..1a9b968 100755
--- a/src/Components.test.fs
+++ b/src/Main.test.fs
@@ -14,7 +14,7 @@ open Fable.Jester
 open App
 
 Jest.describe("Counter component", fun () ->
-    let element = RTL.render(Components.Counter())
+    let element = RTL.render(App.Main.El())
         
     Jest.test("should render initial count", fun () ->
         let countElement = element.getByText("count is 0")
diff --git a/src/components/Counter.fs b/src/components/Counter.fs
new file mode 100755
index 0000000..0f3a425
--- /dev/null
+++ b/src/components/Counter.fs
@@ -0,0 +1,24 @@
+module App.Components.Counter
+
+open Feliz
+
+[<ReactComponent>]
+let El() =
+    let (count, setCount) = React.useState(0)
+
+    Html.div [
+        prop.className "card"
+        prop.children [
+            Html.h2 "Counter.fs Yes"
+            Html.button [
+                prop.onClick (fun _ -> setCount(count + 1))
+                prop.text $"count is {count}"
+            ]
+            Html.p [
+                Html.text "Edit "
+                Html.code "src/App.fs"
+                Html.text " and save to test HMR yes"
+            ]
+        ]
+    ]
+        
\ No newline at end of file