diff --git a/Advanced/conceptual_tutorial_template.md b/Advanced/conceptual_tutorial_template.md
new file mode 100644
index 000000000..649e21b1a
--- /dev/null
+++ b/Advanced/conceptual_tutorial_template.md
@@ -0,0 +1,143 @@
+<!--
+This is an article template you can use as a quick starting point when writing DigitalOcean conceptual tutorials. 
+
+Once you've reviewed the template, delete the comments and begin writing your outline or article. You'll find some examples of our custom Markdown at the very bottom of the template.
+
+As you write, refer to our style and formatting guidelines for more detailed explanations:
+
+- [do.co/style](https://do.co/style)
+
+Use our [Markdown previewer](https://www.digitalocean.com/community/markdown) to review your article's formatting.
+
+-->
+
+
+# Understanding [Some Concept]
+
+<!-- Use Title Case for all Titles -->
+
+<!-- Learn about the title, introduction, and Goals sections at https://do.co/style#title-introduction-and-goals -->
+
+<!-- Learn about formatting headers at https://do.co/style#headers -->
+
+### Introduction
+
+<!-- Our articles have a specific structure. Learn more at https://do.co/style/structure -->
+
+Introductory paragraph about the topic that explains what this topic is about and why the reader should care; what problem does it solve?
+
+In this guide, you will [explore] [some thing]...
+
+When you're finished, you'll be able to...
+
+## Prerequisites
+
+<!-- Prerequisites let you leverage existing tutorials so you don't have to repeat installation or setup steps in your tutorial.  Learn more at https://do.co/style#prerequisites -->
+
+
+## 
+
+<!-- For more information on steps, see https://do.co/style/#steps -->
+
+Introduction to the step. What are we going to do and why are we doing it?
+
+First....
+
+Next...
+
+Finally...
+
+
+Now transition to the next section by telling the reader what's next.
+
+## Another Section
+
+Another introduction
+
+Your content
+
+Transition to the next section
+
+
+## Conclusion
+
+In this article you [explored/learned] [something]. Now you can....
+
+<!-- Speak  to reader benefits of this technique or procedure and optionally provide places for further exploration. -->
+
+
+<!------------ Formatting ------------------------->
+
+<!-- Some examples of how to mark up various things
+
+This is _italics_ and this is **bold**.
+
+Only use italics and bold for specific things. Learn more at https://do.co/style#bold-and-italics
+
+This is `inline code`. Use it for referencing package names and commands.
+
+Here's a command someone types in the Terminal:
+
+```command
+sudo nano /etc/nginx/sites-available/default
+```
+
+Here's a configuration file. The label on the first line lets you clearly state the file that's being shown or modified:
+
+```nginx
+[label /etc/nginx/sites-available/default]
+server {
+    listen 80 default_server;
+    listen [::]:80 default_server ipv6only=on;
+
+    root <^>/usr/share/nginx/html<^>;
+    index index.html index.htm;
+
+    server_name localhost;
+
+    location / {
+        try_files $uri $uri/ =404;
+    }
+}
+```
+
+Here's output from a command:
+
+```
+[secondary_label Output]
+Could not connect to Redis at 127.0.0.1:6379: Connection refused
+```
+
+Learn about formatting commands and terminal output at https://do.co/style#code
+
+Key presses should be written in ALLCAPS with in-line code formatting: `ENTER`.
+
+Use a plus symbol (+) if keys need to be pressed simultaneously: `CTRL+C`.
+
+This is a <^>variable<^>.
+
+This is an `<^>in-line code variable<^>`
+
+Learn more about how to use variables to highlight important items at https://do.co/style#variables
+
+Use `<^>your_server_ip<^>` when referencing the IP of the server.  Use `111.111.111.111` and `222.222.222.222` if you need other IP addresses in examples.
+
+Learn more about host names and domains at https://do.co/style#users-hostnames-and-domains
+
+<$>[note]
+**Note:** This is a note.
+<$>
+
+<$>[warning]
+**Warning:** This is a warning.
+<$>
+
+Learn more about notes at https://do.co/style#notes-and-warnings
+
+Screenshots should be in PNG format and hosted on imgur. Embed them in the article using the following format:
+
+![Alt text for screen readers](/path/to/img.png)
+
+Learn more about images at https://do.co/style#images-and-other-assets
+-->
+Copied
\ No newline at end of file
diff --git a/Advanced/main.md b/Advanced/main.md
new file mode 100644
index 000000000..73c14dca8
--- /dev/null
+++ b/Advanced/main.md
@@ -0,0 +1,331 @@
+# Title Header (H1 header)
+
+
+### Introduction (H3 header)
+
+This is some placeholder text to show examples of Markdown formatting.
+We have [a full article template](https://github.com/do-community/do-article-templates) you can use when writing a DigitalOcean article.
+Please refer to our style and formatting guidelines for more detailed explanations: <https://do.co/style>
+
+
+## Prerequisites (H2 header)
+
+Before you begin this guide you'll need the following:
+
+- Familiarity with [Markdown](https://daringfireball.net/projects/markdown/)
+
+
+## Step 1 — Basic Markdown
+
+This is _italics_, this is **bold**, this is __underline__, and this is ~~strikethrough~~.
+
+- This is a list item.
+- This list is unordered.
+
+1. This is a list item.
+2. This list is ordered.
+
+> This is a quote.
+>
+> > This is a quote inside a quote.
+>
+> - This is a list in a quote.
+> - Another item in the quote list.
+
+Here's how to include an image with alt text and a title:
+
+![Alt text for screen readers](https://i.kym-cdn.com/photos/images/original/001/704/393/8d2.png "Logo")
+
+Use horizontal rules to break up long sections:
+
+---
+
+Rich transformations are also applied:
+
+- On ellipsis: ...
+- On quote pairs: "sammy", 'test'
+- On dangling single quotes: it's
+- On en/em dashes: a -- b, a --- b
+
+<!-- Comments will be removed from the output -->
+
+| Tables | are   | also  | supported | and    | will   | overflow | cleanly | if     | needed |
+|--------|-------|-------|-----------|--------|--------|----------|---------|--------|--------|
+| col 1  | col 2 | col 3 | col 4     | col 5  | col 6  | col 7    | col 8   | col 9  | col 10 |
+| col 1  | col 2 | col 3 | col 4     | col 5  | col 6  | col 7    | col 8   | col 9  | col 10 |
+| col 1  | col 2 | col 3 | col 4     | col 5  | col 6  | col 7    | col 8   | col 9  | col 10 |
+| col 1  | col 2 | col 3 | col 4     | col 5  | col 6  | col 7    | col 8   | col 9  | col 10 |
+| col 1  | col 2 | col 3 | col 4     | col 5  | col 6  | col 7    | col 8   | col 9  | col 10 |
+
+
+## Step 2 — Code
+
+This is `inline code`. This is a <^>variable<^>. This is an `in-line code <^>variable<^>`.
+
+Here's a configuration file with a label:
+
+```nginx
+[label /etc/nginx/sites-available/default]
+server {
+    listen 80 <^>default_server<^>;
+    . . .
+}
+```
+
+Examples can have line numbers, and every code block has a 'Copy' button to copy just the code:
+
+```line_numbers,js
+const test = 'hello';
+const other = 'world';
+console.log(test, other);
+```
+
+Here's output from a command with a secondary label:
+
+```
+[secondary_label Output]
+Could not connect to Redis at 127.0.0.1:6379: Connection refused
+```
+
+This is a non-root user command example:
+
+```command
+sudo apt-get update
+sudo apt-get install python3
+```
+
+This is a root command example:
+
+```super_user
+adduser sammy
+shutdown
+```
+
+This is a custom prefix command example:
+
+```custom_prefix(mysql>)
+FLUSH PRIVILEGES;
+SELECT * FROM articles;
+```
+
+A custom prefix can contain a space by using `\s`:
+
+```custom_prefix((my-server)\smysql>)
+FLUSH PRIVILEGES;
+SELECT * FROM articles;
+```
+
+Indicate where commands are being run with environments:
+
+```command
+[environment local]
+ssh root@server_ip
+```
+
+```command
+[environment second]
+echo "Secondary server"
+```
+
+```command
+[environment third]
+echo "Tertiary server"
+```
+
+```command
+[environment fourth]
+echo "Quaternary server"
+```
+
+```command
+[environment fifth]
+echo "Quinary server"
+```
+
+And all of these can be combined together, with a language for syntax highlighting as well as a line prefix (line numbers, command, custom prefix, etc.), and even an environment and label:
+
+```line_numbers,html
+[environment second]
+[label index.html]
+<html>
+<body>
+<head>
+  <title><^>My Title<^></title>
+</head>
+<body>
+  . . .
+</body>
+</html>
+```
+
+
+## Step 3 — Callouts
+
+Here is a note, a warning, some info and a draft note:
+
+<$>[note]
+**Note:** Use this for notes on a publication.
+<$>
+
+<$>[warning]
+**Warning:** Use this to warn users.
+<$>
+
+<$>[info]
+**Info:** Use this for product information.
+<$>
+
+<$>[draft]
+**Draft:** Use this for notes in a draft publication.
+<$>
+
+A callout can also be given a label, which supports inline markdown as well:
+
+<$>[note]
+[label Labels support _inline_ **markdown**]
+**Note:** Use this for notes on a publication.
+<$>
+
+
+You can also mention users by username:
+
+@MattIPv4
+
+
+## Step 4 — Layout
+
+Columns allow you to customise the layout of your Markdown:
+
+[column
+Content inside a column is regular Markdown block content.
+
+> Any block or inline syntax can be used, including quotes.
+]
+
+[column
+Two or more columns adjacent to each other are needed to create a column layout.
+
+On desktop the columns will be evenly distributed in a single row, on tablets they will wrap naturally, and on mobile they will be in a single stack.
+]
+
+[details Content can be hidden using `details`.
+Inside the details block you can use any block or inline syntax.
+
+You could hide the solution to a problem:
+```js
+// Write a message to console
+console.log('Hello, world!');
+```
+]
+
+[details open You can also have the details block open by default.
+Pass `open` as the first argument to the summary section to do this.
+
+_You can also pass `closed`, though this is the same as not passing anything before the summary._
+]
+
+## Step 5 — Embeds
+
+### YouTube
+
+Embedding a YouTube video (id, height, width):
+
+[youtube iom_nhYQIYk 225 400]
+
+_Both the width and height are optional, with the defaults being 480 and 270 respectively._\
+_The width/height set are treated as maximums -- the video will scale down to fit the available space, maintaining the aspect ratio._
+
+### Wistia
+
+Embedding a Wistia video (id, height, width):
+
+[wistia 7ld71zbvi6 225 400]
+
+_As with the YouTube embed, both the width and height are optional and have the same defaults._\
+_The same behaviour applies to the width/height set, with responsive scaling._
+
+### DNS
+
+Embedding DNS record lookups (hostname, record types...):
+
+[dns digitalocean.com A AAAA]
+
+### Glob
+
+Demonstrating how glob matching works (pattern, tests...):
+
+[glob **/*.js a/b.js c/d.js e.jsx f.md]
+
+Glob embeds can also be written as multiple lines if needed:
+
+[glob **/*.js
+a/b.js
+c/d.js
+e.jsx
+f.md]
+
+### CodePen
+
+To provide code examples, you could embed a CodePen with a username and pen ID:
+
+[codepen MattCowley vwPzeX]
+
+CodePen embeds can be customized with many flags after the username and ID:
+
+- Pass any integer value to set a custom height for the embed (e.g. `[codepen MattCowley vwPzeX 512]`)
+- Pass `dark` to switch the embed to using dark mode (e.g. `[codepen MattCowley vwPzeX dark]`)
+- Pass `lazy` to enable lazy loading (click to run) for the embed (e.g. `[codepen MattCowley vwPzeX lazy]`)
+- Pass one of `html`, `css`, or `js` to change the default tab that is shown (e.g. `[codepen MattCowley vwPzeX css]`)
+- Pass `editable` to enable the user to edit the embed (e.g. `[codepen chriscoyier Yxzjdz editable]`)\
+  _(Note: The embedded pen must be from a user with CodePen Pro for this to work)_
+
+These flags can be combined in any order to create a custom CodePen embed.
+For example, `[codepen MattCowley vwPzeX dark css 384]` would create a dark mode embed that shows the CSS tab by default, with a height of 384px.
+
+### Glitch
+
+Alternatively, you may want to embed a code example from Glitch with a project slug:
+
+[glitch hello-digitalocean]
+
+Similar to CodePen embeds, a set of optional flags can be passed as the slug to customize the embed:
+
+- Pass any integer value to set a custom height for the embed (e.g. `[glitch hello-digitalocean 512]`)
+- Pass `code` to show the project code by default in the embed (e.g. `[glitch hello-digitalocean code]`)
+- Pass `notree` to hide the file tree by default when showing the project code (e.g. `[glitch hello-digitalocean code notree]`)
+- Pass `path=...` to set a default file to show when showing the project code (e.g. `[glitch hello-digitalocean code path=src/app.jsx]`)
+- Pass `highlights=...` to set lines to highlight when showing the project code (e.g. `[glitch hello-digitalocean code path=src/app.jsx highlights=15,25]`)
+- Pass `noattr` to remove the author attribution from the embed (e.g. `[glitch hello-digitalocean noattr]`)
+
+### Can I Use
+
+If you're writing web-related content, you may want to embed a Can I Use table for a feature:
+
+[caniuse css-grid]
+
+Some optional flags can also be set for this embed:
+
+- Pass `past=...` to set how many previous browser versions are listed (0-5) (e.g. `[caniuse css-grid past=5]`)
+- Pass `future=...` to set how many future browser versions are listed (0-3) (e.g. `[caniuse css-grid future=3]`)
+- Pass `accessible` to switch to the accessible color scheme by default (e.g. `[caniuse css-grid accessible]`)
+
+### Asciinema
+
+Embedding a terminal recording from Asciinema (id, cols, rows):
+
+[asciinema 239367 50 20]
+
+
+## Step 6 — Tutorials
+
+Certain features of our Markdown engine are designed specifically for our tutorial content-types.
+These may not be enabled in all contexts in the DigitalOcean community, but are enabled by default in the do-markdownit plugin.
+
+[rsvp_button 1234 "Marketo RSVP buttons use the `rsvp_button` flag"]
+
+[terminal ubuntu:focal Terminal buttons are behind the `terminal` flag]
+
+
+## Conclusion
+
+Please refer to our [writing guidelines](https://do.co/style) for more detailed explanations on our style and formatting.
diff --git a/Advanced/software_development_tutorial_template.md b/Advanced/software_development_tutorial_template.md
new file mode 100644
index 000000000..0a730d276
--- /dev/null
+++ b/Advanced/software_development_tutorial_template.md
@@ -0,0 +1,261 @@
+<!--
+This is an article template you can use as a starting point when writing DigitalOcean procedural tutorials about software development. This template is great for Python, JavaScript, or other softwar development tutorials that readers would follow.  Once you've reviewed the template, delete the comments and begin writing your outline or article. You'll find some examples of our custom Markdown at the very bottom of the template.
+
+As you write, refer to our style and formatting guidelines for more detailed explanations:
+
+- [do.co/style](https://do.co/style)
+
+Use our [Markdown previewer](https://www.digitalocean.com/community/markdown) to review your article's formatting.
+
+Readers should be able to follow your tutorial from the beginning to the end on their own computer. Before submitting your article to the editorial team, please be sure to test your article from start to finish on it exactly as written. Cut and paste commands from the article into your terminal to make sure there aren't typos in the commands. If you find yourself executing a command that isn't in the article, incorporate it into the article to make sure the reader gets the exact same results. We will test your article and send it back to you if we run into technical problems, which significantly slows down the publication process.
+-->
+
+
+# How To [Build/Create/Do Something] in [JavaScript/Node.js/Python 3/Go]
+
+<!-- Use Title Case for all Titles -->
+
+<!-- Learn about the title, introduction, and Goals sections at https://do.co/style#title-introduction-and-goals -->
+
+<!-- Learn about formatting headers at https://do.co/style#headers -->
+
+<!-- Our articles have a specific structure. Procedural tutorials follow this structure:
+
+* Title
+* Introduction (Level 3 heading)
+* Prerequisites (Level 2 heading)
+* Step 1 — Doing Something (Level 2 heading)
+* Step 2 — Doing Something (Level 2 heading)
+...
+* Step 5 — Doing Something (Level 2 heading)
+* Conclusion (Level 2 heading)
+
+
+Learn more at https://do.co/style/structure -->
+
+### Introduction
+
+Introductory paragraph about the topic that explains what this topic is about and why the reader should care; what problem does it solve?
+
+In this guide, you will [configure/set up/build/] [some thing]...
+
+When you're finished, you'll be able to...
+
+## Prerequisites
+
+<!-- Prerequisites let you leverage existing tutorials so you don't have to repeat installation or setup steps in your tutorial.  Learn more at https://do.co/style#prerequisites -->
+
+To complete this tutorial, you will need:
+
+* A local development environment for [your language] 
+* Familiarity with [the language]. You can look at the [tutorial series for the language] to learn more.
+* (Optional) If software such as Git, Docker, or other tooling needs to be installed, link to the proper article describing how to install it.
+* (Optional) List any other accounts needed, such as GitHub, Facebook,  or other services.
+
+<!-- Example - uncomment to use
+
+* A local development environment for Node.js. Follow [How to Install Node.js and Create a Local Development Environment](https://www.digitalocean.com/community/tutorial_series/how-to-install-node-js-and-create-a-local-development-environment).
+* A text editor like [Visual Studio Code](https://code.visualstudio.com/download) or [Atom](https://atom.io/). 
+* A web browser like [Firefox](https://www.mozilla.org/en-US/firefox/new/) or [Chrome](https://www.google.com/chrome/).
+* Familiarity with JavaScript. You can look at the [How To Code in JavaScript](https://www.digitalocean.com/community/tutorial_series/how-to-code-in-javascript) series to learn more.
+* Familiarity with React. You can take a look at our [How To Code in React.js](https://www.digitalocean.com/community/tutorial_series/how-to-code-in-react-js) series.
+-->
+
+## Step 1 — Doing Something
+
+<!-- For more information on steps, see https://do.co/style/#steps -->
+
+Introduction to the step. What are we going to do and why are we doing it?
+
+First....
+
+Next...
+
+Finally...
+
+<!-- When showing a command, explain the command first by talking about what it does. Then show the command. Then show its output in a separate output block: -->
+
+Run the following command to create your React app:
+
+```command
+npx create-react-app <^>digital-ocean-tutorial<^>
+```
+
+You'll see the following output:
+
+```
+[secondary_label Output]
+...
+Success! Created <^>digital-ocean-tutorial at <^>your_file_path/digital-ocean-tutorial<^>
+Inside that directory, you can run several commands:
+
+  npm start
+    Starts the development server.
+
+  npm run build
+    Bundles the app into static files for production.
+
+  npm test
+    Starts the test runner.
+
+  npm run eject
+    Removes this tool and copies build dependencies, configuration files
+    and scripts into the app directory. If you do this, you can’t go back!
+
+We suggest that you begin by typing:
+
+  cd <^>digital-ocean-tutorial<^>
+  npm start
+
+Happy hacking!
+```
+
+<!-- You can use highlighting in output to point out relevant details -->
+
+
+<!-- When asking the reader to open a file, be sure to specify the file name:
+
+Open the file `public/index.htm` in your editor.
+
+
+<!-- When showing the contents of a file, try to show only the relevant parts and explain what needs to change. -->
+
+
+Modify the title by changning the contents of the `<title>` tag:
+
+```js
+[label public/index.html]
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    ...
+    <title><^>Sandbox<^></title>
+  </head>
+...
+```
+
+<!-- See do.co/style#commands-and-code-in-steps for more on how to incorporate command and code in your steps. -->
+
+
+
+Now transition to the next step by telling the reader what's next.
+
+## Step 2 — Title Case
+
+Another introduction
+
+Your content
+
+Transition to the next step.
+
+## Step 3 — Title Case
+
+Another introduction
+
+Your content
+
+Transition to the next step.
+
+## Conclusion
+
+In this article you [configured/set up/built/deployed] [something]. Now you can....
+
+<!-- Speak  to reader benefits of this technique or procedure and optionally provide places for further exploration. -->
+
+
+<!------------ Formatting ------------------------->
+
+<!-- Some examples of how to mark up various things
+
+This is _italics_ and this is **bold**.
+
+Only use italics and bold for specific things. Learn more at https://do.co/style#bold-and-italics
+
+This is `inline code`. Use it for referencing package names and commands.
+
+Here's a command someone types in the Terminal:
+
+```command
+npm start
+```
+
+Here's output from a command:
+
+```
+[secondary_label Output]
+Compiled successfully!
+
+You can now view <^>digital-ocean-tutorial<^> in the browser.
+
+  http://localhost:3000
+
+Note that the development build is not optimized.
+To create a production build, use npm run build.
+```
+
+Learn about formatting commands and terminal output at https://do.co/style#code
+
+Here's a file full of code.  The label on the first line lets you clearly state the file that's being shown or modified. Highlighted lines show what the reader should change.
+
+```js
+[label digital-ocean-tutorial/public/index.html]
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    ...
+    <title><^>Sandbox<^></title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>
+```
+Key presses should be written in ALLCAPS with in-line code formatting: `ENTER`.
+
+Use a plus symbol (+) if keys need to be pressed simultaneously: `CTRL+C`.
+
+This is a <^>variable<^>.
+
+This is an `<^>in-line code variable<^>`
+
+Learn more about how to use variables to highlight important items at https://do.co/style#variables
+
+Use `<^>your_server_ip<^>` when referencing the IP of the server.  Use `111.111.111.111` and `222.222.222.222` if you need other IP addresses in examples.
+
+Learn more about host names and domains at https://do.co/style#users-hostnames-and-domains
+
+<$>[note]
+**Note:** This is a note.
+<$>
+
+<$>[warning]
+**Warning:** This is a warning.
+<$>
+
+Learn more about notes at https://do.co/style#notes-and-warnings
+
+Screenshots should be in PNG format and hosted on imgur. Embed them in the article using the following format:
+
+![Alt text for screen readers](/path/to/img.png)
+
+Learn more about images at https://do.co/style#images-and-other-assets
+-->
\ No newline at end of file
diff --git a/Advanced/systems_procedural_tutorial_template.md b/Advanced/systems_procedural_tutorial_template.md
new file mode 100644
index 000000000..afc3e01c5
--- /dev/null
+++ b/Advanced/systems_procedural_tutorial_template.md
@@ -0,0 +1,228 @@
+<!--
+This is an article template you can use as a starting point when writing DigitalOcean procedural tutorials about intrastructure. Once you've reviewed the template, delete the comments and begin writing your outline or article. You'll find some examples of our custom Markdown at the very bottom of the template.
+
+As you write, refer to our style and formatting guidelines for more detailed explanations:
+
+- [do.co/style](https://do.co/style)
+
+Readers should be able to follow your tutorial from the beginning to the end on a DigitalOcean Droplet. Before submitting your article to the editorial team, please be sure to create a new Droplet and test your article from start to finish on it exactly as written. Cut and paste commands from the article into your terminal to make sure there aren't typos in the commands. If you find yourself executing a command that isn't in the article, incorporate it into the article to make sure the reader gets the exact same results. We will test your article and send it back to you if we run into technical problems, which significantly slows down the publication process.
+-->
+
+
+# How To [Install/Configure/Do Something] on [Distribution]
+
+<!-- Use Title Case for all Titles -->
+
+<!-- Learn about the title, introduction, and Goals sections at https://do.co/style#title-introduction-and-goals -->
+
+<!-- Learn about formatting headers at https://do.co/style#headers -->
+
+<!-- Our articles have a specific structure. Procedural tutorials follow this structure:
+
+* Title
+* Introduction (Level 3 heading)
+* Prerequisites (Level 2 heading)
+* Step 1 — Doing Something (Level 2 heading)
+* Step 2 — Doing Something (Level 2 heading)
+...
+* Step 5 — Doing Something (Level 2 heading)
+* Conclusion (Level 2 heading)
+
+
+Learn more at https://do.co/style/structure -->
+
+### Introduction
+
+Introductory paragraph about the topic that explains what this topic is about and why the reader should care; what problem does it solve?
+
+In this guide, you will [configure/set up/build/deploy] [some thing]...
+
+When you're finished, you'll be able to...
+
+## Prerequisites
+
+<!-- Prerequisites let you leverage existing tutorials so you don't have to repeat installation or setup steps in your tutorial.  Learn more at https://do.co/style#prerequisites -->
+
+Before you begin this guide you'll need the following:
+
+- [number of servers] <OS and OS Version> server(s) <!-- Also specify the amount of RAM the server needs if relevant. -->
+- A non-root user with sudo privileges (<insert link to Initial Server Setup article for the OS used in this tutorial>) explains how to set this up.)
+- (Optional) If software such as Nginx needs to be installed, link to the proper article describing how to install it.
+- (Optional) If the reader needs a fully-qualified domain name (FQDN), mention it here as well.
+- (Optional) List any other accounts needed, such as GitHub, Facebook,  or other services.
+
+<!-- Example:
+* One Ubuntu 18.04 server with at least 1GB of RAM set up by following [the Ubuntu 18.04 initial server setup guide](https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-18-04), including a sudo non-root user and a firewall.
+* Nginx installed on your server, as shown in [How To Install Nginx on Ubuntu 16.04](https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-16-04).
+* A domain name configured to point to your server. You can learn how to point domains to DigitalOcean Droplets by following the [How To Set Up a Host Name with DigitalOcean](https://www.digitalocean.com/community/tutorials/how-to-set-up-a-host-name-with-digitalocean) tutorial.
+-->
+
+## Step 1 — Doing Something
+
+<!-- For more information on steps, see https://do.co/style/#steps -->
+
+Introduction to the step. What are we going to do and why are we doing it?
+
+First....
+
+Next...
+
+Finally...
+
+<!-- When showing a command, explain the command first by talking about what it does. Then show the command. Then show its output in a separate output block: -->
+
+Display the status of your firewall with the following command:
+
+```command
+sudo ufw status
+```
+
+You'll see the following output:
+
+```
+[secondary_label Output]
+Status: active
+
+To                         Action      From
+--                         ------      ----
+OpenSSH                    ALLOW       Anywhere                  
+<^>Nginx HTTP                 ALLOW       Anywhere<^>
+OpenSSH (v6)               ALLOW       Anywhere (v6)             
+<^>Nginx HTTP (v6)            ALLOW       Anywhere (v6)<^>
+```
+
+<!-- You can use highlighting in output to point out relevant details -->
+
+
+<!-- When asking the reader to open a file, specify the file and show the command to open it: -->
+
+Open the file `/etc/nginx.conf` in your editor:
+
+```command
+sudo nano /etc/nginx.com
+```
+
+<!-- When showing a configuration file, try to show only the relevant parts and explain what needs to change.  -->
+
+Change the `root` field so it points to `/var/www/your_domain`:
+
+```nginx
+[label /etc/nginx/sites-available/default]
+server {
+    listen 80 default_server;
+    listen [::]:80 default_server ipv6only=on;
+
+    root <^>/var/www/your_domain<^>;
+    index index.html index.htm;
+
+    server_name localhost;
+
+    location / {
+        try_files $uri $uri/ =404;
+    }
+}
+```
+
+<!-- See do.co/style#commands-and-code-in-steps for more on how to incorporate command and code in your steps. -->
+
+Now transition to the next step by telling the reader what's next.
+
+## Step 2 — Title Case
+
+Another introduction
+
+Your content
+
+Transition to the next step.
+
+## Step 3 — Title Case
+
+Another introduction
+
+Your content
+
+Transition to the next step.
+
+## Conclusion
+
+In this article you [configured/set up/built/deployed] [something]. Now you can....
+
+<!-- Speak  to reader benefits of this technique or procedure and optionally provide places for further exploration. -->
+
+
+<!------------ Formatting ------------------------->
+
+<!-- Some examples of how to mark up various things
+
+This is _italics_ and this is **bold**.
+
+Only use italics and bold for specific things. Learn more at https://do.co/style#bold-and-italics
+
+This is `inline code`. Use it for referencing package names and commands.
+
+Here's a command someone types in the Terminal:
+
+```command
+sudo nano /etc/nginx/sites-available/default
+```
+
+Here's a configuration file. 
+
+The label on the first line lets you clearly state the file that's being shown or modified:
+
+```nginx
+[label /etc/nginx/sites-available/default]
+server {
+    listen 80 default_server;
+    listen [::]:80 default_server ipv6only=on;
+
+    root <^>/usr/share/nginx/html<^>;
+    index index.html index.htm;
+
+    server_name localhost;
+
+    location / {
+        try_files $uri $uri/ =404;
+    }
+}
+```
+
+Here's output from a command:
+
+```
+[secondary_label Output]
+Could not connect to Redis at 127.0.0.1:6379: Connection refused
+```
+
+Learn about formatting commands and terminal output at https://do.co/style#code
+
+Key presses should be written in ALLCAPS with in-line code formatting: `ENTER`.
+
+Use a plus symbol (+) if keys need to be pressed simultaneously: `CTRL+C`.
+
+This is a <^>variable<^>.
+
+This is an `<^>in-line code variable<^>`
+
+Learn more about how to use variables to highlight important items at https://do.co/style#variables
+
+Use `<^>your_server_ip<^>` when referencing the IP of the server.  Use `111.111.111.111` and `222.222.222.222` if you need other IP addresses in examples.
+
+Learn more about host names and domains at https://do.co/style#users-hostnames-and-domains
+
+<$>[note]
+**Note:** This is a note.
+<$>
+
+<$>[warning]
+**Warning:** This is a warning.
+<$>
+
+Learn more about notes at https://do.co/style#notes-and-warnings
+
+Screenshots should be in PNG format and hosted on imgur. Embed them in the article using the following format:
+
+![Alt text for screen readers](/path/to/img.png)
+
+Learn more about images at https://do.co/style#images-and-other-assets
+-->
\ No newline at end of file
diff --git a/BLANK_README.md b/BLANK_README.md
index 6b9048de4..7cff6d920 100644
--- a/BLANK_README.md
+++ b/BLANK_README.md
@@ -1,247 +1,452 @@
+
 <!-- Improved compatibility of back to top link: See: https://github.com/othneildrew/Best-README-Template/pull/73 -->
-<a name="readme-top"></a>
+
+<a  name="readme-top"></a>
+
 <!--
+
 *** Thanks for checking out the Best-README-Template. If you have a suggestion
+
 *** that would make this better, please fork the repo and create a pull request
+
 *** or simply open an issue with the tag "enhancement".
+
 *** Don't forget to give the project a star!
+
 *** Thanks again! Now go create something AMAZING! :D
--->
 
+-->
 
+  
+  
+  
 
 <!-- PROJECT SHIELDS -->
+
 <!--
+
 *** I'm using markdown "reference style" links for readability.
+
 *** Reference links are enclosed in brackets [ ] instead of parentheses ( ).
+
 *** See the bottom of this document for the declaration of the reference variables
+
 *** for contributors-url, forks-url, etc. This is an optional, concise syntax you may use.
+
 *** https://www.markdownguide.org/basic-syntax/#reference-style-links
--->
-[![Contributors][contributors-shield]][contributors-url]
-[![Forks][forks-shield]][forks-url]
-[![Stargazers][stars-shield]][stars-url]
-[![Issues][issues-shield]][issues-url]
-[![MIT License][license-shield]][license-url]
-[![LinkedIn][linkedin-shield]][linkedin-url]
 
+-->
 
+  
+  
+  
 
 <!-- PROJECT LOGO -->
+
 <br />
+
 <div align="center">
-  <a href="https://github.com/github_username/repo_name">
-    <img src="images/logo.png" alt="Logo" width="80" height="80">
-  </a>
-
-<h3 align="center">project_title</h3>
-
-  <p align="center">
-    project_description
-    <br />
-    <a href="https://github.com/github_username/repo_name"><strong>Explore the docs »</strong></a>
-    <br />
-    <br />
-    <a href="https://github.com/github_username/repo_name">View Demo</a>
-    ·
-    <a href="https://github.com/github_username/repo_name/issues">Report Bug</a>
-    ·
-    <a href="https://github.com/github_username/repo_name/issues">Request Feature</a>
-  </p>
+
+<a  href="https://github.com/github_username/repo_name">
+
+<img  src="https://mooeena.neocities.org/img/vaporwave_virus_xenon.gif"  alt="Logo"  width="100"  height="100">
+
+</a>
+
+  
+
+<h1 align="center">project_title</b></h1>
+
+<p align="center">
+
+project_description
+
+<a  href="https://github.com/github_username/repo_name"><strong>Explore the docs »</strong></a>
+
+<a  href="https://github.com/github_username/repo_name">View Demo</a>|
+<a  href="https://github.com/github_username/repo_name/issues">Report 
+Bug</a>|
+<a  href="https://github.com/github_username/repo_name/issues">Request Feature</a>
+
+</p>
+
 </div>
 
+  
+
+[![Contributors][contributors-shield]][contributors-url][![Forks][forks-shield]][forks-url][![Stargazers][stars-shield]][stars-url][![Issues][issues-shield]][issues-url][![MIT License][license-shield]][license-url]
 
+ <!---------Go here and check more bages with customizations-----------
+ https://shields.io/
+  ---------Go here and check more bages with customizations------------>
+  
 
 <!-- TABLE OF CONTENTS -->
+
 <details>
-  <summary>Table of Contents</summary>
-  <ol>
-    <li>
-      <a href="#about-the-project">About The Project</a>
-      <ul>
-        <li><a href="#built-with">Built With</a></li>
-      </ul>
-    </li>
-    <li>
-      <a href="#getting-started">Getting Started</a>
-      <ul>
-        <li><a href="#prerequisites">Prerequisites</a></li>
-        <li><a href="#installation">Installation</a></li>
-      </ul>
-    </li>
-    <li><a href="#usage">Usage</a></li>
-    <li><a href="#roadmap">Roadmap</a></li>
-    <li><a href="#contributing">Contributing</a></li>
-    <li><a href="#license">License</a></li>
-    <li><a href="#contact">Contact</a></li>
-    <li><a href="#acknowledgments">Acknowledgments</a></li>
-  </ol>
-</details>
 
+<summary>Table of Contents</summary>
+
+<ol>
+
+<li>
+
+<a  href="#about-the-project">About The Project</a>
+
+<ul>
+
+<li><a  href="#built-with">Built With</a></li>
 
+</ul>
+
+</li>
+
+<li>
+
+<a  href="#getting-started">Getting Started</a>
+
+<ul>
+
+<li><a  href="#prerequisites">Prerequisites</a></li>
+
+<li><a  href="#installation">Installation</a></li>
+
+</ul>
+
+</li>
+
+<li><a  href="#usage">Usage</a></li>
+
+<li><a  href="#roadmap">Roadmap</a></li>
+
+<li><a  href="#contributing">Contributing</a></li>
+
+<li><a  href="#license">License</a></li>
+
+<li><a  href="#contact">Contact</a></li>
+
+<li><a  href="#acknowledgments">Acknowledgments</a></li>
+
+</ol>
+
+</details>
+
+  
+  
+  
 
 <!-- ABOUT THE PROJECT -->
-## About The Project
+
+## About The Project 🔠
+
+  
 
 [![Product Name Screen Shot][product-screenshot]](https://example.com)
 
+  
+
 Here's a blank template to get started: To avoid retyping too much info. Do a search and replace with your text editor for the following: `github_username`, `repo_name`, `twitter_handle`, `linkedin_username`, `email_client`, `email`, `project_title`, `project_description`
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+  
+  
+
+### Built With ⚙️
+
+  
 
+[![Next][Next.js]][Next-url][![React][React.js]][React-url][![Vue][Vue.js]][Vue-url][![Angular][Angular.io]][Angular-url][![Svelte][Svelte.dev]][Svelte-url][![Laravel][Laravel.com]][Laravel-url][![Bootstrap][Bootstrap.com]][Bootstrap-url][![JQuery][JQuery.com]][JQuery-url]
 
+  
 
-### Built With
+<!----For more Bages Go Here--------
 
-* [![Next][Next.js]][Next-url]
-* [![React][React.js]][React-url]
-* [![Vue][Vue.js]][Vue-url]
-* [![Angular][Angular.io]][Angular-url]
-* [![Svelte][Svelte.dev]][Svelte-url]
-* [![Laravel][Laravel.com]][Laravel-url]
-* [![Bootstrap][Bootstrap.com]][Bootstrap-url]
-* [![JQuery][JQuery.com]][JQuery-url]
+  
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+https://github.com/Envoy-VC/awesome-badges
 
+  
 
+---For more Bages Go Here--------->
+
+  
+  
 
 <!-- GETTING STARTED -->
-## Getting Started
+
+## Getting Started 💫
+
+  
 
 This is an example of how you may give instructions on setting up your project locally.
+
 To get a local copy up and running follow these simple example steps.
 
-### Prerequisites
+  
+
+### Prerequisites 🩴
+
+  
 
 This is an example of how to list things you need to use the software and how to install them.
+
 * npm
-  ```sh
-  npm install npm@latest -g
-  ```
 
-### Installation
+```sh
+
+npm install npm@latest -g
+
+```
+
+  
+
+### Installation ⚒️
+
+  
 
 1. Get a free API Key at [https://example.com](https://example.com)
+
 2. Clone the repo
-   ```sh
-   git clone https://github.com/github_username/repo_name.git
-   ```
+
+```sh
+
+git clone https://github.com/github_username/repo_name.git
+
+```
+
 3. Install NPM packages
-   ```sh
-   npm install
-   ```
+
+```sh
+
+npm install
+
+```
+
 4. Enter your API in `config.js`
-   ```js
-   const API_KEY = 'ENTER YOUR API';
-   ```
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+```js
 
+const  API_KEY  =  'ENTER YOUR API';
 
+```
+
+  
+  
+  
+  
+  
 
 <!-- USAGE EXAMPLES -->
-## Usage
+
+## Usage 😃
+
+  
 
 Use this space to show useful examples of how a project can be used. Additional screenshots, code examples and demos work well in this space. You may also link to more resources.
 
+ ```js
+ // give instructions with coding snippet
+// Import in a single file, then across your whole project...
+ 
+``` 
+
 _For more examples, please refer to the [Documentation](https://example.com)_
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+  
+  
+  
+  
 
+<!-- ROADMAP -->
 
+## Roadmap ➡️
 
-<!-- ROADMAP -->
-## Roadmap
+  
 
 - [ ] Feature 1
+
 - [ ] Feature 2
+
 - [ ] Feature 3
-    - [ ] Nested Feature
 
-See the [open issues](https://github.com/github_username/repo_name/issues) for a full list of proposed features (and known issues).
+- [ ] Nested Features
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+  
 
+See the [open issues](https://github.com/github_username/repo_name/issues) for a full list of proposed features (and known issues).
 
+  
+  
 
 <!-- CONTRIBUTING -->
-## Contributing
+
+## Contribution 🎉
+
+Contributions are welcome! Here are some ways you can contribute to this project:
+
+- 🐛 Report bugs by [creating an issue](https://github.com/yourname/yourproject/issues).
+- 📝 Contribute documentation by [editing the Wiki](https://github.com/yourname/yourproject/wiki).
+- 💻 Contribute code by [creating a pull request](https://github.com/yourname/yourproject/pulls).
+
+
+  
 
 Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
 
+  
+
 If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
+
 Don't forget to give the project a star! Thanks again!
 
+  
+
 1. Fork the Project
+
 2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
+
 3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
+
 4. Push to the Branch (`git push origin feature/AmazingFeature`)
+
 5. Open a Pull Request
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+  
+  
 
+<!-- LICENSE -->
 
+## License 📃
+<!-- You can create this automaticaly when you create repo we suppose you already know that so keep move | if you dont know go check this 
 
-<!-- LICENSE -->
-## License
+🌐 (https://docs.github.com/en/communities/setting-up-your-project-for-healthy-contributions/adding-a-license-to-a-repository) -->
+  
+![License](https://img.shields.io/badge/License-MIT-blue.svg)
 
 Distributed under the MIT License. See `LICENSE.txt` for more information.
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+<!-- CONTACT -->
 
+## Contact
 
+You can reach me at the following:
 
-<!-- CONTACT -->
-## Contact
+- Email: [example@gmail.com](mailto:example@gmail.com)    ![Email](https://img.shields.io/badge/-Email-red?style=flat-square&logo=Gmail)
+- Phone: +1-555-555-5555   ![Phone](https://img.shields.io/badge/-Phone-blue?style=flat-square&logo=Phone)
+- Twitter: [@example](https://twitter.com/example)   ![Twitter](https://img.shields.io/twitter/follow/example?style=flat-square&logo=Twitter&color=blue)
+- LinkedIn: [Your Name](https://www.linkedin.com/in/yourname/)   ![LinkedIn](https://img.shields.io/badge/-LinkedIn-blue?style=flat-square&logo=Linkedin)
+- GitHub: [Your Name](https://github.com/yourname)   ![GitHub](https://img.shields.io/badge/-GitHub-black?style=flat-square&logo=GitHub)
+- Instagram: [@yourname](https://www.instagram.com/yourname/)   ![Instagram](https://img.shields.io/badge/-Instagram-pink?style=flat-square&logo=Instagram)
+- Facebook: [Your Name](https://www.facebook.com/yourname)   ![Facebook](https://img.shields.io/badge/-Facebook-blue?style=flat-square&logo=Facebook)
 
-Your Name - [@twitter_handle](https://twitter.com/twitter_handle) - email@email_client.com
+
+  
 
 Project Link: [https://github.com/github_username/repo_name](https://github.com/github_username/repo_name)
 
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
+  
+  
+  
+  
+  
 
+<!-- ACKNOWLEDGMENTS -->
 
+## Acknowledgments
 
-<!-- ACKNOWLEDGMENTS -->
+<div style="background-color:#1B2631; padding:10px; border-radius: 5px;">
+
+I would like to thank the following people for their contributions and support:
+
+<div style="background-color:#EB984E; padding:10px; border-radius: 5px; margin: 10px 0;">
+
+- [@friend1](https://github.com/friend1) - for providing helpful feedback and suggestions.
+
+</div>
+
+<div style="background-color:#EB984E; padding:10px; border-radius: 5px; margin: 10px 0;">
+
+- [@friend2](https://github.com/friend2) - for contributing code and bug fixes.
+
+</div>
+
+<div style="background-color:#EB984E; padding:10px; border-radius: 5px; margin: 10px 0;">
+
+- [@friend3](https://github.com/friend3) - for helping with documentation and testing.
+
+</div>
+
+Thank you all for your time and effort in making this project better!
+
+</div>
+
+<!----use the bellow design if you need it to be simple -->
+
+<!----
 ## Acknowledgments
 
-* []()
-* []()
-* []()
-
-<p align="right">(<a href="#readme-top">back to top</a>)</p>
-
-
-
-<!-- MARKDOWN LINKS & IMAGES -->
-<!-- https://www.markdownguide.org/basic-syntax/#reference-style-links -->
-[contributors-shield]: https://img.shields.io/github/contributors/github_username/repo_name.svg?style=for-the-badge
-[contributors-url]: https://github.com/github_username/repo_name/graphs/contributors
-[forks-shield]: https://img.shields.io/github/forks/github_username/repo_name.svg?style=for-the-badge
-[forks-url]: https://github.com/github_username/repo_name/network/members
-[stars-shield]: https://img.shields.io/github/stars/github_username/repo_name.svg?style=for-the-badge
-[stars-url]: https://github.com/github_username/repo_name/stargazers
-[issues-shield]: https://img.shields.io/github/issues/github_username/repo_name.svg?style=for-the-badge
-[issues-url]: https://github.com/github_username/repo_name/issues
-[license-shield]: https://img.shields.io/github/license/github_username/repo_name.svg?style=for-the-badge
-[license-url]: https://github.com/github_username/repo_name/blob/master/LICENSE.txt
-[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555
-[linkedin-url]: https://linkedin.com/in/linkedin_username
-[product-screenshot]: images/screenshot.png
-[Next.js]: https://img.shields.io/badge/next.js-000000?style=for-the-badge&logo=nextdotjs&logoColor=white
-[Next-url]: https://nextjs.org/
-[React.js]: https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB
-[React-url]: https://reactjs.org/
-[Vue.js]: https://img.shields.io/badge/Vue.js-35495E?style=for-the-badge&logo=vuedotjs&logoColor=4FC08D
-[Vue-url]: https://vuejs.org/
-[Angular.io]: https://img.shields.io/badge/Angular-DD0031?style=for-the-badge&logo=angular&logoColor=white
-[Angular-url]: https://angular.io/
-[Svelte.dev]: https://img.shields.io/badge/Svelte-4A4A55?style=for-the-badge&logo=svelte&logoColor=FF3E00
-[Svelte-url]: https://svelte.dev/
-[Laravel.com]: https://img.shields.io/badge/Laravel-FF2D20?style=for-the-badge&logo=laravel&logoColor=white
-[Laravel-url]: https://laravel.com
-[Bootstrap.com]: https://img.shields.io/badge/Bootstrap-563D7C?style=for-the-badge&logo=bootstrap&logoColor=white
-[Bootstrap-url]: https://getbootstrap.com
-[JQuery.com]: https://img.shields.io/badge/jQuery-0769AD?style=for-the-badge&logo=jquery&logoColor=white
-[JQuery-url]: https://jquery.com 
+I would like to thank the following people for their contributions and support:
+
+- [@friend1](https://github.com/friend1) - for providing helpful feedback and suggestions.
+- [@friend2](https://github.com/friend2) - for contributing code and bug fixes.
+- [@friend3](https://github.com/friend3) - for helping with documentation and testing.
+
+Thank you all for your time and effort in making this project better!
+
+
+-->
+
+  
+<br>
+<p align="right">(<a  href="#readme-top"><b>back to top 👆</a>)</p>
+
+  
+
+<!----
+Completely remove this section when you use this template this section only contains what we use to gather information and all assets that used to create this template ( or you can use if you have to put references into your project)
+--->
+## References 📚
+
+Here are some resources that were helpful in creating this project:
+
+- [GitHub Markdown Guide](https://guides.github.com/features/mastering-markdown/)
+- [Markdown Cheatsheet](https://www.markdownguide.org/cheat-sheet/)
+- [Emoji Cheat Sheet](https://www.webfx.com/tools/emoji-cheat-sheet/)
+- [ASCII Art Archive](https://www.asciiart.eu/)
+- [Awesome Badges](https://github.com/Envoy-VC/awesome-badge)
+- [Complete list of markdown emoji markup](https://gist.github.com/rxaviers/7360908)
+- [favourite website and app logos ](https://github.com/edent/SuperTinyIcons)
+- [Online markdown preview ](https://stackedit.io/app)
+- [Shield.io Badges](https://shields.io/)
+- [Find Some cool Arts](https://neocities.org/browse)
+
+<!-----------------Remove from bellow ---------------------------------->
+
+## Other `Readme` ⭕
+
+<div style="background-color: #1B2631; border-radius: 10px; padding: 20px;">
+
+`If You Think This is not suitable for your application Readme.md | may be you should check others too ✋`
+
+<div style="background-color: #D5D8DC; border-radius: 10px; padding: 10px; margin: 10px 0;">
+
+- `[Advanced 📌]` 👉[Click here 📌](https://github.com/HMAHD/Best-README-Template/tree/feature/2023-Update/Advanced)
+- `[Basic 📌]` 👉[Click here 📌](https://github.com/HMAHD/Best-README-Template/tree/feature/2023-Update/Basic)
+
+</div>
+Content structure
+<div style="background-color: #D5D8DC; border-radius: 10px; padding: 10px; margin: 10px 0;">
+
+1. [Advanced](#)
+    - [Main one](https://github.com/HMAHD/Best-README-Template/blob/feature/2023-Update/Advanced/main.md)
+    - [Conceptual](https://github.com/HMAHD/Best-README-Template/blob/feature/2023-Update/Advanced/conceptual_tutorial_template.md)
+    - [Software Development](https://github.com/HMAHD/Best-README-Template/blob/feature/2023-Update/Advanced/software_development_tutorial_template.md)
+    - [System Procedural](https://github.com/HMAHD/Best-README-Template/blob/feature/2023-Update/Advanced/systems_procedural_tutorial_template.md)
+    
+2. [Basic](#)
+   - [Basic 01](https://github.com/HMAHD/Best-README-Template/blob/feature/2023-Update/Basic/Basic_README.md)
+   - [Basic 02](https://github.com/HMAHD/Best-README-Template/blob/feature/2023-Update/Basic/Basic_README.md)
+
+</div>
+
+</div>
+
diff --git a/Basic/Basic_README.md b/Basic/Basic_README.md
new file mode 100644
index 000000000..baea58c4a
--- /dev/null
+++ b/Basic/Basic_README.md
@@ -0,0 +1,71 @@
+<div align="center">
+  <a href="https://github.com/github_username/repo_name">
+    <img src="images/logo.png" alt="Logo" width="80" height="80">
+  </a>
+</div>
+
+<p align="center">
+  <a href="#"><img src="https://img.shields.io/badge/Status-In%20Development-yellow" alt="Status"></a>
+  <a href="#"><img src="https://img.shields.io/badge/License-MIT-brightgreen" alt="License"></a>
+  <a href="#"><img src="https://img.shields.io/badge/Made%20with-JavaScript-orange" alt="Made with"></a>
+</p>
+
+## Description
+
+A brief description of the project goes here.
+
+## Links
+
+- [Documentation](https://example.com/documentation)
+- [Demo](https://example.com/demo)
+- [Repository](https://github.com/username/project)
+
+## About
+
+### Screenshot
+
+A screenshot of the project goes here.
+
+### Built With
+
+<h1 align="center">Built With</h1>
+
+- [Technology 1](https://example.com/technology1)
+- [Technology 2](https://example.com/technology2)
+- [Technology 3](https://example.com/technology3)
+
+<p align="center">
+  <a href="#"><img src="https://img.shields.io/badge/Technology%201-1.0.0-blue" alt="Technology 1"></a>
+  <a href="#"><img src="https://img.shields.io/badge/Technology%202-2.0.0-blue" alt="Technology 2"></a>
+  <a href="#"><img src="https://img.shields.io/badge/Technology%203-3.0.0-blue" alt="Technology 3"></a>
+</p>
+
+### Installation
+
+<h1 align="center">Installation</h1>
+
+To install this project, run:
+
+```sh
+npm install
+```
+
+## Usage
+
+<h1 align="center">Usage</h1>
+
+A detailed guide on how to use the project goes here.
+
+## Contributions
+
+<h1 align="center">Contributions</h1>
+
+<p align="center">
+  <a href="#">
+    <img src="https://avatars.githubusercontent.com/u/1234567?s=64" width="64" height="64" alt="Contributor Name">
+  </a>
+</p>
+
+Contributor Name
+
+Contributions to this project are welcome!
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1d9e8f9f3..ba614d8eb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,4 +12,14 @@
 
 ### Removed
 
-- Some packages/libraries from acknowledgements I no longer use
\ No newline at end of file
+- Some packages/libraries from acknowledgements I no longer use
+
+## v1.5.0
+
+### Rechange the template (modernizing)
+- Added modern badges
+- Added more readme's
+- beautified
+- modern view 
+- lots of references and documentation
+- error fixed 
\ No newline at end of file