diff --git a/pages/Homepage.py b/Homepage.py
similarity index 98%
rename from pages/Homepage.py
rename to Homepage.py
index 1d2342105..3e2b24530 100644
--- a/pages/Homepage.py
+++ b/Homepage.py
@@ -8,7 +8,7 @@ st.set_page_config(
 
 
 # load pythonx logo
-st.image("../image/PythonXPicture.png")
+st.image("./image/PythonXPicture.png")
 
 st.markdown("# :question: What is PythonX")
 
@@ -32,4 +32,6 @@ st.markdown(
     :+1: Overall, Python is a **powerful, versatile, and easy-to-learn** programming language, making it one of the most popular languages in use today.    
 
     """
-)
\ No newline at end of file
+)
+
+
diff --git a/image/CodingProcess.png b/image/CodingProcess.png
new file mode 100644
index 000000000..6919970d7
Binary files /dev/null and b/image/CodingProcess.png differ
diff --git a/pages/Lesson1.py b/pages/Lesson1.py
deleted file mode 100644
index 23c8f4bf2..000000000
--- a/pages/Lesson1.py
+++ /dev/null
@@ -1,3 +0,0 @@
-import streamlit as st
-
-st.title("Lesson1")
\ No newline at end of file
diff --git a/pages/Lesson2.py b/pages/Lesson2.py
deleted file mode 100644
index ca561f188..000000000
--- a/pages/Lesson2.py
+++ /dev/null
@@ -1,3 +0,0 @@
-import streamlit as st
-
-st.title("Lesson2")
\ No newline at end of file
diff --git a/pages/Lesson_1_Introduction_to_Python.py b/pages/Lesson_1_Introduction_to_Python.py
new file mode 100644
index 000000000..3204236f6
--- /dev/null
+++ b/pages/Lesson_1_Introduction_to_Python.py
@@ -0,0 +1,24 @@
+import streamlit as st
+
+st.title("Lesson 1: Introduction to Python")
+
+st.markdown("# :one: From Idea to Program")
+
+st.markdown(
+    """
+        The following chat outlines the basic logic of computer programming. We start with a task that we want the computer to help complete.
+
+        - **Step 1**: The programmer **analyzes reuqirements** to identify the process to complete the task.
+        - **Step 2**: The programmer **implements** the identified process in programming code as a computer program.
+        - **Step 3**: The programmer **deploys** the program on the computer and let the complete complete the task and give expected outcomes.
+
+        This is a simplified outline of coding (computer programming), and additional steps may be involved depending on the task's complexity and the program.
+    """)
+st.image("./image/CodingProcess.png")
+
+
+st.markdown("# :two: First Python Program: Hello PythonX!")
+st.markdown("""Now, let's try our first program, which print out "Hello PythonX" on our computer screen""")
+
+
+    
diff --git a/pages/Lesson_2_Create_WordClouds_in_Python.py b/pages/Lesson_2_Create_WordClouds_in_Python.py
new file mode 100644
index 000000000..bbd569546
--- /dev/null
+++ b/pages/Lesson_2_Create_WordClouds_in_Python.py
@@ -0,0 +1,4 @@
+import streamlit as st
+
+st.title("Lesson 2: Create WordClouds in Python")
+
diff --git a/pages/resources_for_coding.py b/pages/resources_for_coding.py
new file mode 100644
index 000000000..f7c7fb743
--- /dev/null
+++ b/pages/resources_for_coding.py
@@ -0,0 +1,9 @@
+import streamlit as st
+
+st.markdown("This page is used to list all references when implementing this online tutorials")
+st.markdown("""
+            
+            - [Emoji for Markdown](https://gist.github.com/rxaviers/7360908)"
+            - [Streamlit Cheat Sheet](https://cheat-sheet.streamlit.app/)
+            
+""")
\ No newline at end of file
diff --git a/pages/testing.py b/pages/testing.py
new file mode 100644
index 000000000..253b1d453
--- /dev/null
+++ b/pages/testing.py
@@ -0,0 +1,8 @@
+import streamlit as st
+
+
+
+video = "https://youtu.be/HluANRwPyNo?feature=shared"
+st.video(video)
+
+