Used Turbo Frames/Streams for adding/deleting tasks without refresh entire browser

app/views/projects/index.html.erb

@@ -10,3 +10,6 @@
                   } %>
   <% end %>
 </ul>
+
+<br>
+<h2><%= link_to "Add Project", new_project_path %></h2>

app/views/projects/show.html.erb

@@ -1,16 +1,21 @@
 <h1><%= @project.project_name %></h1>
 <p><%= @project.description %></p>
 
-<ul>
-<% @project.tasks.each do |task| %>
-    <li>
-      <%= task.title %>  (<%= task.status %>)
-    </li>
-    <%= link_to "Destroy", project_task_path(@project, task), data: {
-                    turbo_method: :delete,
-                    turbo_confirm: "Are you sure?"
-                  } %>
-  <% end %>
-</ul>
+<turbo-frame id="tasks">
+  <ul id="tasks_list">
+    <% @project.tasks.each do |task| %>
+      <li id="<%= dom_id(task) %>">
+        <%= task.title %> (<%= task.status %>)
+        <%= link_to "Destroy", project_task_path(@project, task), data: {
+                        turbo_method: :delete,
+                        turbo_confirm: "Are you sure?"
+                    } %>
+      </li>
+    <% end %>
+  </ul>
+</turbo-frame>
 
-<%= link_to "Add Task", new_project_task_path(@project) %>
+
+<turbo-frame id="new_task">
+  <%= render partial: "tasks/form", locals: { project: @project, task: Task.new } %>
+</turbo-frame>