diff --git a/src/layouts/NewDocsLayout.astro b/src/layouts/NewDocsLayout.astro
index efabf4e..27ae6b4 100644
--- a/src/layouts/NewDocsLayout.astro
+++ b/src/layouts/NewDocsLayout.astro
@@ -40,18 +40,18 @@ const {
 
 const base_dir_end = base_dir.length;
 
-const posts_2 = posts.map(post => ({
-	...post,
-	relative_file: post.file.substring(base_dir_end),
-	path: post.file.substring(base_dir_end),
-	title: post.frontmatter.title,
-}))
+const posts_2 = posts
+	.map(post => ({
+		...post,
+		relative_file: post.file.substring(base_dir_end),
+		path: post.file.substring(base_dir_end).replace(/\.mdx?$/, ""),
+		title: post.frontmatter.title,
+	}))
+	.sort((p1, p2) => p1.frontmatter.order > p2.frontmatter.order? 1 : -1);
 
 const index_page = posts_2.find(post => post.relative_file === "/index.md" || post.relative_file === "/index.mdx");
 const basePath = index_page.url;
 
-console.log(JSON.stringify(index_page, null, 4));
-
 const pagesIndex = posts_2;
 ---
 
diff --git a/src/pages/en/latest/learn/basics.mdx b/src/pages/en/latest/learn/basics.mdx
new file mode 100644
index 0000000..38ec6a7
--- /dev/null
+++ b/src/pages/en/latest/learn/basics.mdx
@@ -0,0 +1,13 @@
+---
+layout: "./_wrapper.astro"
+title: Basics
+order: 2
+---
+import InteractiveCode from "@/components/InteractiveCode.astro";
+import Code from "@/components/Code.astro"
+
+# Hello!
+
+Hi
+
+
diff --git a/src/pages/en/latest/learn/index.mdx b/src/pages/en/latest/learn/index.mdx
index 5b29523..99a4349 100644
--- a/src/pages/en/latest/learn/index.mdx
+++ b/src/pages/en/latest/learn/index.mdx
@@ -1,6 +1,7 @@
 ---
 layout: "./_wrapper.astro"
 title: Welcome
+order: 1
 ---
 import InteractiveCode from "@/components/InteractiveCode.astro";
 import Code from "@/components/Code.astro"