diff --git a/10.project-setup/01.static/config.php b/10.project-setup/01.static/config.php
new file mode 100644
index 0000000..e69de29
diff --git a/10.project-setup/01.static/index.php b/10.project-setup/01.static/index.php
new file mode 100644
index 0000000..8926c8c
--- /dev/null
+++ b/10.project-setup/01.static/index.php
@@ -0,0 +1,131 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Project Sample</title>
+    <link rel="stylesheet" href="style.css">
+
+</head>
+
+<body>
+    <header>
+        <a href="./">Project Sample</a>
+    </header>
+    <nav>
+        <ul>
+            <li><a href="./">Home</a></li>
+            <li><a href="page.php">page</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+        </ul>
+    </nav>
+    <section class="mid">
+        <div class="mid_left">
+            <article>
+                <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+                    veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+                    illum
+                    dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+                    nam
+                    veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+                    laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+                    sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+                    architecto
+                    adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+                    eaque
+                    laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+                    voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+                    eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+                    tempore
+                    consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+                    animi,
+                    aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+                    architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+                    neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+                    doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+                <ul>
+                    <li>HTML</li>
+                    <li>HTML layout</li>
+                    <li>HTML template</li>
+                    <li>HTML code</li>
+                </ul>
+            </article>
+            <article>
+                <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+                    veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+                    illum
+                    dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+                    nam
+                    veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+                    laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+                    sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+                    architecto
+                    adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+                    eaque
+                    laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+                    voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+                    eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+                    tempore
+                    consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+                    animi,
+                    aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+                    architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+                    neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+                    doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+                <ul>
+                    <li>HTML</li>
+                    <li>HTML layout</li>
+                    <li>HTML template</li>
+                    <li>HTML code</li>
+                </ul>
+            </article>
+            <article>
+                <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+                    veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+                    illum
+                    dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+                    nam
+                    veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+                    laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+                    sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+                    architecto
+                    adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+                    eaque
+                    laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+                    voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+                    eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+                    tempore
+                    consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+                    animi,
+                    aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+                    architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+                    neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+                    doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+                <ul>
+                    <li>HTML</li>
+                    <li>HTML layout</li>
+                    <li>HTML template</li>
+                    <li>HTML code</li>
+                </ul>
+            </article>
+        </div>
+        <div class="mid_right">
+            <marquee>This is aside Section</marquee>
+        </div>
+    </section>
+    <footer>
+        <h4>copyright &copy; 2021-2022 Project Sample </h4>
+    </footer>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/10.project-setup/01.static/page.php b/10.project-setup/01.static/page.php
new file mode 100644
index 0000000..e13574a
--- /dev/null
+++ b/10.project-setup/01.static/page.php
@@ -0,0 +1,132 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Project Sample</title>
+    <link rel="stylesheet" href="style.css">
+
+</head>
+
+<body>
+    <header>
+        <a href="./">Project Sample</a>
+    </header>
+    <nav>
+        <ul>
+            <li><a href="./">Home</a></li>
+            <li><a href="page.php">page</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+        </ul>
+    </nav>
+    <section class="mid">
+        <div class="mid_left">
+            <article>
+                <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+                    veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+                    illum
+                    dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+                    nam
+                    veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+                    laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+                    sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+                    architecto
+                    adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+                    eaque
+                    laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+                    voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+                    eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+                    tempore
+                    consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+                    animi,
+                    aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+                    architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+                    neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+                    doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+                <ul>
+                    <li>HTML</li>
+                    <li>HTML layout</li>
+                    <li>HTML template</li>
+                    <li>HTML code</li>
+                </ul>
+            </article>
+            <article>
+                <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+                    veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+                    illum
+                    dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+                    nam
+                    veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+                    laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+                    sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+                    architecto
+                    adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+                    eaque
+                    laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+                    voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+                    eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+                    tempore
+                    consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+                    animi,
+                    aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+                    architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+                    neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+                    doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+                <ul>
+                    <li>HTML</li>
+                    <li>HTML layout</li>
+                    <li>HTML template</li>
+                    <li>HTML code</li>
+                </ul>
+            </article>
+            <article>
+                <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+                    veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+                    illum
+                    dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+                    nam
+                    veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+                    laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+                    sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+                    architecto
+                    adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+                    eaque
+                    laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+                    voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+                    eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+                    tempore
+                    consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+                    animi,
+                    aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+                    architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+                    neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+                    doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+                <ul>
+                    <li>HTML</li>
+                    <li>HTML layout</li>
+                    <li>HTML template</li>
+                    <li>HTML code</li>
+                </ul>
+            </article>
+        </div>
+        <div class="mid_right">
+            <marquee>This is aside Section</marquee>
+            <img src="src/image/aside.jpg" width="100%">
+        </div>
+    </section>
+    <footer>
+        <h4>copyright &copy; 2021-2022 Project Sample </h4>
+    </footer>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/10.project-setup/01.static/src/image/aside.jpg b/10.project-setup/01.static/src/image/aside.jpg
new file mode 100644
index 0000000..5e43fcb
Binary files /dev/null and b/10.project-setup/01.static/src/image/aside.jpg differ
diff --git a/10.project-setup/01.static/style.css b/10.project-setup/01.static/style.css
new file mode 100644
index 0000000..465d597
--- /dev/null
+++ b/10.project-setup/01.static/style.css
@@ -0,0 +1,16 @@
+*{ margin: 0; padding: 0; box-sizing: border-box;}
+header{ padding: 2%; background-color: royalblue;}
+header a{ font-size: 2rem; text-decoration: none; color: white;}
+nav{padding:0.50% 2%; background-color: tomato;}
+nav ul{ display: flex;}
+nav ul li{ list-style: none; margin-right: 20px;}
+nav ul li a{ text-decoration: none; color: white; text-transform: uppercase;}
+.mid{ width: 96%; margin: auto; border: 1px solid black; min-height: 700px; display: flex; margin-top: 10px;}
+.mid_left{ width: 70%;}
+article{ padding: 1%;}
+article h1{ padding: 1%; background-color: teal; color: white;}
+article p{ line-height: 1.2; text-align: justify;}
+article ul{ display: flex;}
+article ul li{ padding: 1%; list-style: none; background-color: whitesmoke;}
+.mid_right{ width: 29%;}
+footer{padding: 2%; background-color: royalblue; margin-top: 10px;}
\ No newline at end of file
diff --git a/10.project-setup/02.dynamic/config.php b/10.project-setup/02.dynamic/config.php
new file mode 100644
index 0000000..387ebf2
--- /dev/null
+++ b/10.project-setup/02.dynamic/config.php
@@ -0,0 +1,3 @@
+<?php
+$user=1;
+?>
\ No newline at end of file
diff --git a/10.project-setup/02.dynamic/footer.php b/10.project-setup/02.dynamic/footer.php
new file mode 100644
index 0000000..cd9829f
--- /dev/null
+++ b/10.project-setup/02.dynamic/footer.php
@@ -0,0 +1,8 @@
+</section>
+<footer>
+    <h4>copyright &copy; 2021-2022 Project Sample </h4>
+</footer>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/10.project-setup/02.dynamic/head.php b/10.project-setup/02.dynamic/head.php
new file mode 100644
index 0000000..b1e3e2d
--- /dev/null
+++ b/10.project-setup/02.dynamic/head.php
@@ -0,0 +1,43 @@
+<?php
+if(@$user==NULL)
+{
+    echo "Error 404 page not found";
+}
+else
+{
+    ?>
+
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Project Sample</title>
+    <link rel="stylesheet" href="style.css">
+
+</head>
+
+<body>
+    <header>
+        <a href="./">Project Sample 1</a>
+    </header>
+    <nav>
+        <ul>
+            <li><a href="./">Home</a></li>
+            <li><a href="page.php">page</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+            <li><a href="./">Home</a></li>
+        </ul>
+    </nav>
+    <section class="mid">
+
+
+        <?php
+}
+
+?>
\ No newline at end of file
diff --git a/10.project-setup/02.dynamic/index.php b/10.project-setup/02.dynamic/index.php
new file mode 100644
index 0000000..f173372
--- /dev/null
+++ b/10.project-setup/02.dynamic/index.php
@@ -0,0 +1,105 @@
+<?php
+include_once('config.php');
+
+include "head.php";
+?>
+<div class="mid_left">
+    <article>
+        <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+            veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+            illum
+            dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+            nam
+            veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+            laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+            sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+            architecto
+            adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+            eaque
+            laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+            voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+            eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+            tempore
+            consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+            animi,
+            aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+            architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+            neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+            doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+        <ul>
+            <li>HTML</li>
+            <li>HTML layout</li>
+            <li>HTML template</li>
+            <li>HTML code</li>
+        </ul>
+    </article>
+    <article>
+        <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+            veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+            illum
+            dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+            nam
+            veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+            laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+            sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+            architecto
+            adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+            eaque
+            laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+            voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+            eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+            tempore
+            consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+            animi,
+            aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+            architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+            neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+            doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+        <ul>
+            <li>HTML</li>
+            <li>HTML layout</li>
+            <li>HTML template</li>
+            <li>HTML code</li>
+        </ul>
+    </article>
+    <article>
+        <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+            veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+            illum
+            dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+            nam
+            veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+            laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+            sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+            architecto
+            adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+            eaque
+            laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+            voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+            eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+            tempore
+            consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+            animi,
+            aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+            architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+            neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+            doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+        <ul>
+            <li>HTML</li>
+            <li>HTML layout</li>
+            <li>HTML template</li>
+            <li>HTML code</li>
+        </ul>
+    </article>
+</div>
+<div class="mid_right">
+    <marquee>This is aside Section</marquee>
+    <img src="src/image/php-include-require.png" width="100%">
+</div>
+
+<?php
+include 'footer.php';
+?>
\ No newline at end of file
diff --git a/10.project-setup/02.dynamic/page.php b/10.project-setup/02.dynamic/page.php
new file mode 100644
index 0000000..e463546
--- /dev/null
+++ b/10.project-setup/02.dynamic/page.php
@@ -0,0 +1,104 @@
+<?php
+include_once('config.php');
+include_once('head.php');
+
+?>
+<div class="mid_left">
+    <article>
+        <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+            veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+            illum
+            dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+            nam
+            veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+            laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+            sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+            architecto
+            adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+            eaque
+            laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+            voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+            eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+            tempore
+            consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+            animi,
+            aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+            architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+            neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+            doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+        <ul>
+            <li>HTML</li>
+            <li>HTML layout</li>
+            <li>HTML template</li>
+            <li>HTML code</li>
+        </ul>
+    </article>
+    <article>
+        <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+            veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+            illum
+            dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+            nam
+            veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+            laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+            sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+            architecto
+            adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+            eaque
+            laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+            voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+            eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+            tempore
+            consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+            animi,
+            aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+            architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+            neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+            doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+        <ul>
+            <li>HTML</li>
+            <li>HTML layout</li>
+            <li>HTML template</li>
+            <li>HTML code</li>
+        </ul>
+    </article>
+    <article>
+        <h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Suscipit, ea?</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores provident facere eius debitis, quas
+            veniam asperiores distinctio consectetur est at ipsa aliquam aliquid architecto eum consequatur
+            illum
+            dolor culpa libero delectus perferendis sit molestiae error. Quibusdam, incidunt reiciendis at quis
+            nam
+            veritatis sequi dolor vitae repellat placeat, explicabo praesentium consequatur suscipit ex. Dicta
+            laborum fugiat fuga magnam rerum id earum doloremque adipisci sed! Veritatis, suscipit. Fuga maxime
+            sequi dolores amet. Necessitatibus atque rerum quo deleniti tempore aliquam ad laboriosam,
+            architecto
+            adipisci, debitis officia itaque, minima quos minus doloribus tempora repellat! Culpa nisi saepe,
+            eaque
+            laborum aperiam dolorem obcaecati consectetur assumenda iste vel eum nobis, itaque vero eligendi
+            voluptate facilis ducimus tenetur. Similique inventore voluptates suscipit recusandae, ab aspernatur
+            eaque libero autem adipisci eligendi perspiciatis aliquam tenetur corrupti pariatur magnam. A
+            tempore
+            consequuntur nemo quod rem omnis unde ullam obcaecati. Nobis quod quam magnam qui unde, alias sed
+            animi,
+            aliquid libero id perferendis cupiditate esse, quia beatae modi itaque necessitatibus sit. Cum alias
+            architecto est distinctio maxime accusantium nobis sapiente modi iure. Itaque ex ab ipsa voluptates
+            neque sint totam impedit inventore eos, eaque, dignissimos eveniet at veniam odio illo ad voluptate
+            doloremque, eligendi corrupti ullam dolorum dicta. Vel, facilis quod.</p>
+        <ul>
+            <li>HTML</li>
+            <li>HTML layout</li>
+            <li>HTML template</li>
+            <li>HTML code</li>
+        </ul>
+    </article>
+</div>
+<div class="mid_right">
+    <marquee>This is aside Section</marquee>
+    <img src="src/image/aside.jpg" width="100%">
+</div>
+<?php
+include("footer.php");
+?>
\ No newline at end of file
diff --git a/10.project-setup/02.dynamic/src/image/aside.jpg b/10.project-setup/02.dynamic/src/image/aside.jpg
new file mode 100644
index 0000000..5e43fcb
Binary files /dev/null and b/10.project-setup/02.dynamic/src/image/aside.jpg differ
diff --git a/10.project-setup/02.dynamic/src/image/php-include-require.png b/10.project-setup/02.dynamic/src/image/php-include-require.png
new file mode 100644
index 0000000..579f3a1
Binary files /dev/null and b/10.project-setup/02.dynamic/src/image/php-include-require.png differ
diff --git a/10.project-setup/02.dynamic/style.css b/10.project-setup/02.dynamic/style.css
new file mode 100644
index 0000000..465d597
--- /dev/null
+++ b/10.project-setup/02.dynamic/style.css
@@ -0,0 +1,16 @@
+*{ margin: 0; padding: 0; box-sizing: border-box;}
+header{ padding: 2%; background-color: royalblue;}
+header a{ font-size: 2rem; text-decoration: none; color: white;}
+nav{padding:0.50% 2%; background-color: tomato;}
+nav ul{ display: flex;}
+nav ul li{ list-style: none; margin-right: 20px;}
+nav ul li a{ text-decoration: none; color: white; text-transform: uppercase;}
+.mid{ width: 96%; margin: auto; border: 1px solid black; min-height: 700px; display: flex; margin-top: 10px;}
+.mid_left{ width: 70%;}
+article{ padding: 1%;}
+article h1{ padding: 1%; background-color: teal; color: white;}
+article p{ line-height: 1.2; text-align: justify;}
+article ul{ display: flex;}
+article ul li{ padding: 1%; list-style: none; background-color: whitesmoke;}
+.mid_right{ width: 29%;}
+footer{padding: 2%; background-color: royalblue; margin-top: 10px;}
\ No newline at end of file
diff --git a/10.project-setup/index.html b/10.project-setup/index.html
new file mode 100644
index 0000000..e69de29
