diff --git a/DSA-Roadmap/Roadmap.md b/DSA-Roadmap/Roadmap.md
new file mode 100644
index 0000000..c0d6b32
--- /dev/null
+++ b/DSA-Roadmap/Roadmap.md
@@ -0,0 +1,149 @@
+Roadmap for DSA (Data Structure and Algorithms)
+
+Todayβs world is highly reliable on data and their appropriate management
+through widely used apps and software. The backbone for appropriate
+management of data is Data Structure and Algorithms. It is a dream for many to achieve expertise in
+handling and creating these apps and software. With this target in mind,
+they set out on the journey of learning DSA. The very first step in the
+journey is the creation of a complete roadmap to learn data structure and algorithms.
+
+
+
+
+There are 5 main steps in learning DSA.
+
+1. Learn at least one Programming Language
+2. Learn about Complexities
+3. Learn Data Structure and Algorithms
+4. Practice On Various Platforms
+5. Compete and participate in contest
+
+Learn at least one Programming Language
+
+There are 250-2,500 coding/programming languages to learn, your task is to choose one of them as per your convinience
+and start learning process. Personally I prefer to learn C++ programming language. Sharing steps to learn C++.
+
+
+
+
+1. Flowcharts
+
+2. Conditionals(if,else if, else)
+
+3. Loops(for, while, do while)
+4. Patterns (for better understanding of loops)
+5. Operators
+6. Functions
+7. Bit Manipulation
+8. Pointers
+9. Dynamic Allocation
+
+Learn about Complexities
+
+Space and Time define any physical object in the Universe. Similarly, Space and Time complexity can define the effectiveness
+of an algorithm. While we know there is more than one way to solve the problem in programming, knowing how the algorithm
+works efficiently can add value to the way we do programming. To find the effectiveness of the program/algorithm, knowing
+how to evaluate them using Space and Time complexity can make the program behave in required optimal conditions, and by
+doing so, it makes us efficient programmers.
+
+
+
+
+https://www.geeksforgeeks.org/time-complexity-and-space-complexity/
+
+
+
+https://youtu.be/mV3wrLBbuuE
+
+
+Learn Data Structure and Algorithms
+
+
+
+
+
+
+
+1. Array
+
+2. Character Array
+3. 2D-Array
+4. String
+5. Searching
+ a. Linear Search
+ b. Binary Search
+6. Sorting
+ a. Bubble Sort
+ b. Insertion Sort
+ c. Selection Sort
+ d. Merge Sort
+ e. Quick Sort
+7. Recursion
+8. Linked List
+9. Stack
+10. Queue
+11. Generic Tree
+ a. Vector
+12. Binary Tree
+13. Binary Search Tree
+14. Priority Queue
+ a. Complete Tree
+ b. Heap
+ i) Min Heap
+ ii) Max Heap
+ c. Heap Sort
+15. Hashmaps
+ a. Unordered Map
+ b. Ordered Map
+16. OOP
+17. Tries and Huffman
+18. Dynamic Programming(DP)
+ a. Brute Force
+ b. Memonization
+ c. DP Approach
+19. Graph
+ a. Union Find Algorithm
+ i) For Cycle Detection
+ b. Kruskal Algorithm
+ c. Prims Algorithm
+20. Backtracking
+
+Practice On Various Platforms
+
+Practice is a key, its like a cherry on a cake. The more you practice, the more confident you became and you will be a pro at DSA.
+
+Resources that I follow to practice π
+
+Leetcode π
+
+https://leetcode.com/
+
+GFG π
+
+https://www.geeksforgeeks.org/
+
+HackerEarth π
+
+https://www.hackerearth.com/
+
+HackerRank π
+
+https://www.hackerrank.com/
+
+InterviewBit π
+
+https://www.interviewbit.com/
+
+Codeforces π
+
+https://codeforces.com/
+
+CodeChef π
+
+https://www.codechef.com/
+
+
+Compete and participate in contest
+
+The most important part during preperation is to excel DSA and problem solving, and to do so you must participate in contest on various platforms.
+It will boost your confidence to face any SDE interviews.
diff --git a/Frontend-Web-Development-Roadmap/Roadmap.md b/Frontend-Web-Development-Roadmap/Roadmap.md
new file mode 100644
index 0000000..f3263de
--- /dev/null
+++ b/Frontend-Web-Development-Roadmap/Roadmap.md
@@ -0,0 +1,172 @@
+Roadmap for Frontend Web Development
+
+Step 1: Inroduction
+
+The most important and mandatory part to get started with any new technologi is to get sufficient knowledge about it.
+To excel Frontend Web Development you have to know two things;
+
+a) What is Frontend Development? π
+https://www.techslang.com/definition/what-is-frontend-development/
+
+b) What actually Frontend Web Developer do? π
+https://www.coursera.org/articles/front-end-developer
+
+c) What are the imporatnt resources to get started? π
+https://www.naukri.com/learning/articles/best-resources-to-learn-web-development/
+
+Step 2: Understanding Internet
+
+To learn Frontend Development you must know how internet works and how it is related to technology.
+a) How does Internet works? π
+https://youtu.be/zN8YNNHcaZc
+b) Internet- CS50's Understanding Technology? π
+https://youtu.be/n_KghQP86Sw
+
+Step 3: Learn HTML (Hypertext Markup Language)
+
+HTML is an acronym which stands for Hyper Text Markup Language which is used for creating web pages and web applications.
+HTML is a markup language which is used for creating attractive web pages with the help of styling, and which looks in a
+nice format on a web browser. An HTML document is made of many HTML tags and each HTML tag contains different content.
+
+To leran HTMl π
+https://www.w3schools.com/html/html_intro.asp
+https://developer.mozilla.org/en-US/docs/Web/HTML
+https://youtu.be/kUMe1FH4CHE
+https://youtu.be/pQN-pnXPaVg
+
+Step 4: Learn CSS (Cascading Style Sheet)
+
+Cascading Style Sheets, fondly referred to as CSS, is a simple design language intended to simplify the process of making web pages presentable.
+CSS handles the look and feel part of a web page. Using CSS, you can control the color of the text, the style of fonts, the spacing between
+paragraphs, how columns are sized and laid out, what background images or colors are used, layout designs,variations in display for different
+devices and screen sizes as well as a variety of other effects.
+
+To leran CSS π
+https://www.w3schools.com/css/css_intro.asp
+https://developer.mozilla.org/en-US/docs/Web/CSS
+https://youtu.be/1Rs2ND1ryYc
+https://youtu.be/yfoY53QXEnI
+
+Step 5: Learn JavaScript
+
+JavaScript is a dynamic computer programming language. It is lightweight and most commonly used as a part of web pages, whose implementations
+allow client-side script to interact with the user and make dynamic pages. It is an interpreted programming language with object-oriented
+capabilities.
+
+To leran JS π
+https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript
+https://www.w3schools.com/whatis/whatis_js.asp
+https://youtu.be/pN6jk0uUrD8
+https://youtu.be/jS4aFq5-91M
+
+Step 6: Learn Version Control
+
+Version control systems are a category of software tools that helps in recording changes made to files by keeping a track of modifications done
+in the code. Basically Version control system keeps track on changes made on a particular software and take a snapshot of every modification.
+Letβs suppose if a team of developer add some new functionalities in an application and the updated version is not working properly so as the
+version control system keeps track of our work so with the help of version control system we can omit the new changes and continue with the
+previous version.
+
+https://serengetitech.com/tech/introduction-to-git-and-types-of-version-control-systems/
+
+Git Documention π
+
+https://www.git-scm.com/documentation
+
+Git/Github Tutorials π
+
+https://youtu.be/apGV9Kg7ics
+https://youtu.be/RGOj5yH7evk
+
+Step 7: Understanding Pacakge Manager
+
+A package manager keeps track of what software is installed on your computer, and allows you to easily install new software, upgrade software to newer
+versions, or remove software that you previously installed. As the name suggests, package managers deal with packages: collections of files that are
+bundled together and can be installed and removed as a group.
+
+What is NPM and why do we need it? π
+https://youtu.be/P3aKRdUyr0s
+
+NPM π
+https://youtu.be/jHDhaSSKmB0
+
+YARN π
+https://youtu.be/g9_6KmiBISk
+
+Learn Pacakge Manager π
+https://frontendmasters.com/books/front-end-handbook/2018/learning/package-manager.html
+
+JavaScript Pacakge Manager π
+https://blog.bitsrc.io/4-npm-alternatives-best-js-package-managers-and-publishing-tools-fe6779937ee9
+
+Package Management Basic π
+https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management
+
+Step 8: Learn Build Tools
+
+Build tools are programs that automate the creation of executable applications from source code. Building incorporates
+compiling, linking and packaging the code into a usable or executable form. In small projects, developers will often
+manually invoke the build process.
+
+What are build-tools? π
+https://stackoverflow.com/questions/7249871/what-is-a-build-tool
+
+6 Best Build Tools π
+https://www.developerdrive.com/best-build-tools-frontend-development/
+
+Learn Build Tools π
+https://youtu.be/V5qvWl-O-zE
+https://www.codecademy.com/learn/learn-build-tools
+
+Step 9: Learn JS Framework/Library
+
+Frameworks and libraries are code written by third parties to solve regular/common problems or to optimise performance.
+A key difference between the two is the inversion of control. When using a library, the control remains with the developer
+who tells the application when to call library functions.
+
+What is JavaScript Framework? π
+https://generalassemb.ly/blog/what-is-a-javascript-framework/
+
+Frontend-Frameworks ->
+
+1. React π
+ https://youtu.be/b9eMGE7QtTk
+ https://youtu.be/bMknfKXIFA8
+
+2. Angular π
+ https://youtu.be/3qBXWUpoPHo
+
+3. Vue.js π
+ https://youtu.be/FXpIoQ_rT_c
+
+Backend-Frameworks ->
+
+1. Express.js π
+ https://youtu.be/Oe421EPjeBE
+
+2. Next.js π
+ https://youtu.be/GHTA143_b-s
+
+Step 10: Learn CSS Framework/Library
+
+1. What is JavaScript Framework? π
+ https://elementor.com/resources/glossary/what-is-a-css-framework/
+
+2. Best CSS Framework π
+ https://hackr.io/blog/best-css-frameworks
+
+Tailwind π
+https://youtu.be/dFgzHOX84xQ
+
+Bootstrap π
+https://youtu.be/bxmDnn7lrnk
+
+Step 11: Learn PWA (Progressive Web Apps)
+
+What is PWA (Progressive Web Apps)? π
+https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps
+
+Step 12: Build amazing projects.
+
+https://frontendsprojects.com/
+https://www.frontendpractice.com/