diff --git a/src/HelloShop.AppHost/DaprComponents/redis-lock.yaml b/src/HelloShop.AppHost/DaprComponents/redis-lock.yaml
index fe28ae5..9839bc6 100644
--- a/src/HelloShop.AppHost/DaprComponents/redis-lock.yaml
+++ b/src/HelloShop.AppHost/DaprComponents/redis-lock.yaml
@@ -7,9 +7,8 @@ spec:
   version: v1
   metadata:
   - name: redisHost
-    secretKeyRef:
-       name: ConnectionStrings__cache
+    value: "localhost:6379"
   - name: redisPassword
-    value: ""
+    value: "guest"
 auth:
   secretStore: env-secretstore
\ No newline at end of file
diff --git a/src/HelloShop.AppHost/Program.cs b/src/HelloShop.AppHost/Program.cs
index 2558785..52cb8aa 100644
--- a/src/HelloShop.AppHost/Program.cs
+++ b/src/HelloShop.AppHost/Program.cs
@@ -13,7 +13,8 @@ var identitydb = postgres.AddDatabase("identitydb");
 var productdb = postgres.AddDatabase("productdb");
 var orderingdb = postgres.AddDatabase("orderingdb");
 
-var cache = builder.AddRedis("cache", port: 6380).WithLifetime(ContainerLifetime.Persistent).WithPersistence();
+var redisPassword = builder.AddParameter("redisPassword", secret: true);
+var cache = builder.AddRedis("cache", port: 6379, password: redisPassword).WithLifetime(ContainerLifetime.Persistent).WithPersistence();
 
 var rabbitmqUser = builder.AddParameter("rabbitmqUser", secret: true);
 var rabbitmqPassword = builder.AddParameter("rabbitmqPassword", secret: true);
diff --git a/src/HelloShop.AppHost/appsettings.json b/src/HelloShop.AppHost/appsettings.json
index ec31b2e..a141799 100644
--- a/src/HelloShop.AppHost/appsettings.json
+++ b/src/HelloShop.AppHost/appsettings.json
@@ -10,6 +10,7 @@
     "postgreUser": "postgres",
     "postgrePassword": "postgres",
     "rabbitmqUser": "guest",
-    "rabbitmqPassword": "guest"
+    "rabbitmqPassword": "guest",
+    "redisPassword": "guest"
   }
 }
diff --git a/src/HelloShop.AppShared/Components/Demo/CountComponent.razor b/src/HelloShop.AppShared/Components/Demo/CountComponent.razor
new file mode 100644
index 0000000..ca873a7
--- /dev/null
+++ b/src/HelloShop.AppShared/Components/Demo/CountComponent.razor
@@ -0,0 +1,19 @@
+<h1>@Title</h1>
+
+<p role="status" class="counter-value">Current count: @InitCount</p>
+
+<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
+
+@code {
+
+    [Parameter]
+    public string? Title { get; set; }
+
+    [Parameter]
+    public int InitCount { get; set; }
+
+    private void IncrementCount()
+    {
+        InitCount++;
+    }
+}
\ No newline at end of file
diff --git a/src/HelloShop.AppShared/Components/Demo/CountComponent.razor.css b/src/HelloShop.AppShared/Components/Demo/CountComponent.razor.css
new file mode 100644
index 0000000..acd1008
--- /dev/null
+++ b/src/HelloShop.AppShared/Components/Demo/CountComponent.razor.css
@@ -0,0 +1,3 @@
+h1 {
+    color:dodgerblue;
+}
diff --git a/src/HelloShop.AppShared/Components/Pages/Counter.razor b/src/HelloShop.AppShared/Components/Pages/Counter.razor
index edb6b54..ea26617 100644
--- a/src/HelloShop.AppShared/Components/Pages/Counter.razor
+++ b/src/HelloShop.AppShared/Components/Pages/Counter.razor
@@ -1,19 +1,7 @@
 @page "/counter"
 @rendermode InteractiveAuto
+@using HelloShop.AppShared.Components.Demo
 
 <PageTitle>Counter</PageTitle>
 
-<h1>Counter</h1>
-
-<p role="status">Current count: @currentCount</p>
-
-<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
-
-@code {
-    private int currentCount = 0;
-
-    private void IncrementCount()
-    {
-        currentCount++;
-    }
-}
\ No newline at end of file
+<CountComponent InitCount="1" Title="Counter" />
diff --git a/src/HelloShop.AppShared/wwwroot/app.css b/src/HelloShop.AppShared/wwwroot/app.css
index 73a69d6..1d4ad64 100644
--- a/src/HelloShop.AppShared/wwwroot/app.css
+++ b/src/HelloShop.AppShared/wwwroot/app.css
@@ -57,4 +57,8 @@ h1:focus {
 
 .form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
     text-align: start;
+}
+
+.counter-value {
+    color:orangered;
 }
\ No newline at end of file
diff --git a/src/HelloShop.HybridApp/Components/Pages/Component1.razor b/src/HelloShop.HybridApp/Components/Pages/Component1.razor
index 17018ba..1876ab1 100644
--- a/src/HelloShop.HybridApp/Components/Pages/Component1.razor
+++ b/src/HelloShop.HybridApp/Components/Pages/Component1.razor
@@ -1,3 +1,3 @@
 @page "/component1"
 
-<h3>Component1</h3>
\ No newline at end of file
+<h1>Component1</h1>
\ No newline at end of file
diff --git a/src/HelloShop.HybridApp/wwwroot/index.html b/src/HelloShop.HybridApp/wwwroot/index.html
index 73abb89..1dc847b 100644
--- a/src/HelloShop.HybridApp/wwwroot/index.html
+++ b/src/HelloShop.HybridApp/wwwroot/index.html
@@ -6,7 +6,7 @@
     <title>HelloShop.HybridApp</title>
     <base href="/" />
     <link rel="stylesheet" href="_content/HelloShop.AppShared/lib/bootstrap/dist/css/bootstrap.min.css" />
-    <link rel="stylesheet" href="_content/HelloShop.AppShared/lib/app.css" />
+    <link rel="stylesheet" href="_content/HelloShop.AppShared/app.css" />
     <link rel="stylesheet" href="HelloShop.HybridApp.styles.css" />
     <link rel="icon" href="data:,">
 </head>
diff --git a/src/HelloShop.WebApp/HelloShop.WebApp.Client/Components/Pages/Component2.razor b/src/HelloShop.WebApp/HelloShop.WebApp.Client/Components/Pages/Component2.razor
index 612de20..53e3cca 100644
--- a/src/HelloShop.WebApp/HelloShop.WebApp.Client/Components/Pages/Component2.razor
+++ b/src/HelloShop.WebApp/HelloShop.WebApp.Client/Components/Pages/Component2.razor
@@ -1,4 +1,7 @@
 @page "/component2"
 @rendermode InteractiveAuto
+@using HelloShop.AppShared.Components.Demo
 
-<h3>Component2</h3>
\ No newline at end of file
+<h3>Component2</h3>
+
+<CountComponent InitCount="30" Title="Counter1" />
diff --git a/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor b/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor
index 389a130..16aefde 100644
--- a/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor
+++ b/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor
@@ -1,4 +1,15 @@
 @page "/component1"
 @rendermode InteractiveServer
 
-<h3>Component1</h3>
\ No newline at end of file
+@using HelloShop.AppShared.Components.Demo
+
+<h1>Component1</h1>
+
+<div class="border my-3 p-3">
+    <CountComponent Title="Counter1" InitCount="1"></CountComponent>
+</div>
+
+<div class="border my-3 p-3">
+    <CountComponent Title="Counter2" InitCount="2"></CountComponent>
+</div>
+
diff --git a/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor.css b/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor.css
new file mode 100644
index 0000000..60f04d6
--- /dev/null
+++ b/src/HelloShop.WebApp/HelloShop.WebApp/Components/Pages/Component1.razor.css
@@ -0,0 +1,4 @@
+::deep .counter-value {
+    font-size: 2rem;
+    font-weight: bold;
+}
diff --git a/src/HelloShop.WebApp/HelloShop.WebApp/Properties/launchSettings.json b/src/HelloShop.WebApp/HelloShop.WebApp/Properties/launchSettings.json
index 914a563..82abc87 100644
--- a/src/HelloShop.WebApp/HelloShop.WebApp/Properties/launchSettings.json
+++ b/src/HelloShop.WebApp/HelloShop.WebApp/Properties/launchSettings.json
@@ -6,7 +6,7 @@
         "dotnetRunMessages": true,
         "launchBrowser": true,
         "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
-        "applicationUrl": "http://localhost:5224",
+        "applicationUrl": "http://localhost:8080",
         "environmentVariables": {
           "ASPNETCORE_ENVIRONMENT": "Development"
         }
@@ -16,7 +16,7 @@
         "dotnetRunMessages": true,
         "launchBrowser": true,
         "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
-        "applicationUrl": "https://localhost:7169;http://localhost:5224",
+        "applicationUrl": "https://localhost:8181;http://localhost:8080",
         "environmentVariables": {
           "ASPNETCORE_ENVIRONMENT": "Development"
         }