Wip on homepage.

Add documentation how to optimize code size in production.

app/javascript/controllers/shadcn_test_controller.js

@@ -0,0 +1,39 @@
+import { Controller } from "@hotwired/stimulus"
+import React from "react"
+import { createRoot } from "react-dom/client"
+import { Button } from "@/components/ui/button"
+
+// Connects to data-controller="shadcn-test"
+export default class extends Controller {
+  static targets = ["container"]
+
+  connect() {
+    console.log("Shadcn Button Test Controller connected")
+    this.renderButton()
+  }
+
+  renderButton() {
+    const container = this.containerTarget
+    const root = createRoot(container)
+    
+    root.render(
+      <div className="flex flex-col items-center gap-4 p-6">
+        <h3 className="text-white text-lg font-semibold">Test Button Shadcn</h3>
+        <Button 
+          variant="default" 
+          size="lg"
+          className="bg-gradient-to-r from-purple-600 to-pink-600 hover:from-purple-700 hover:to-pink-700"
+          onClick={this.handleClick}
+        >
+          Cliquez ici - PostCSS Test
+        </Button>
+        <p className="text-gray-300 text-sm">Ce bouton utilise shadcn/ui + Tailwind + PostCSS</p>
+      </div>
+    )
+  }
+
+  handleClick = () => {
+    alert("✅ Le bouton shadcn fonctionne avec PostCSS !")
+    console.log("Shadcn button clicked - PostCSS compilation successful")
+  }
+}