From d570618d321a599b357119ab0ab7b6a653b65c59 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 12:48:24 +0100 Subject: [PATCH 01/77] Fix golang title question --- src/data/roadmaps/golang/golang.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/roadmaps/golang/golang.md b/src/data/roadmaps/golang/golang.md index 06100106c..7d7126a6d 100644 --- a/src/data/roadmaps/golang/golang.md +++ b/src/data/roadmaps/golang/golang.md @@ -11,7 +11,7 @@ dimensions: width: 968 height: 1495.21 question: - title: Is Golang as fast as C++? + title: What is Golang? description: | Golang is an open-source programming language developed at Google by developers like Rob Pike. As an interesting trivia fact, Golang is often referred to as "the go language". From 35aa2d07f0d575c9482317f637610958b733be3e Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 13:05:16 +0100 Subject: [PATCH 02/77] Add missing FAQs to ai roadmap --- .../roadmaps/ai-data-scientist/faqs.astro | 48 +++++++++++++++++++ 1 file changed, 48 insertions(+) diff --git a/src/data/roadmaps/ai-data-scientist/faqs.astro b/src/data/roadmaps/ai-data-scientist/faqs.astro index 1a2267f39..4206985cd 100644 --- a/src/data/roadmaps/ai-data-scientist/faqs.astro +++ b/src/data/roadmaps/ai-data-scientist/faqs.astro @@ -98,6 +98,54 @@ export const faqs: FAQType[] = [ "The difference between [data science and data analytics](https://roadmap.sh/ai-data-scientist/vs-data-analytics) might not be obvious at first sight, but it's a big one once you look closer into both roles. Data science involves creating predictive models, applying statistical methods, and exploring data to uncover insights. It usually includes advanced techniques such as machine learning. Data analysts, on the other hand, focus on analyzing current and historical data to answer specific questions and generate reports or dashboards, often with less emphasis on predictive modeling or advanced algorithms.", ], }, + { + question: 'What is the difference between Data Science and Statistics?', + answer: [ + 'The difference between [data science vs statistics](https://roadmap.sh/ai-data-scientist/vs-statistics) is that the first one is an interdisciplinary field that not only relies on statistical methods but also incorporates programming, data engineering, and domain expertise.', + 'It usually works with large-scale, unstructured data (sometimes) and uses techniques such as machine learning and data visualization to derive insights and drive decisions.', + 'Statistics, on the other hand, is centered mainly on mathematical theories and probability, used to analyze controlled datasets. It traditionally emphasizes hypothesis testing, model fitting, and drawing conclusions from sample data.', + ], + }, + { + question: + 'What is the difference between Data Science and Business Analytics?', + answer: [ + 'The [difference between data science and business analytics](https://roadmap.sh/ai-data-scientist/vs-business-analytics) is that data science focuses on extracting insights from massive and diverse datasets by developing predictive models and leveraging advanced algorithms.', + 'Business Analytics, on the other hand, is more concerned with analyzing historical data and generating reports to support immediate data-driven decision making.', + "In a data science vs business analytics scenario, you're confronting development and insight discovery vs historical data analysis.", + ], + }, + { + question: + 'What is the difference between Data Science and Machine Learning?', + answer: [ + 'The [difference between data science and machine learning](https://roadmap.sh/ai-data-scientist/vs-machine-learning) is actually not that clear; in fact, many developers confuse them as being the same thing. Machine learning can be seen as a subset of data science that specifically deals with creating and refining algorithms capable of learning from data.', + 'Its primary goal is to make predictions or classify data based on learned patterns. Data science, however, encompasses a wider spectrum—from data collection and cleaning to analysis and communication of insights—using a variety of tools, including machine learning techniques, to trigger decision-making.', + ], + }, + { + question: + 'What is the difference between Data Science and Computer Science?', + answer: [ + 'The [difference between data science and computer science](https://roadmap.sh/ai-data-scientist/vs-computer-science) is that data science applies statistical and computational methods to solve real-world problems using data, while computer science is a broader discipline that covers theory, algorithms, programming languages, and system design.', + 'You could even say that the question of data science vs computer science makes no sense because the latter is just an umbrella term that encompasses the first one and many other disciplines.', + ], + }, + { + question: 'What is the difference between Data Science and Cyber Security?', + answer: [ + 'The difference between data science and cyber security is that while the first one is centered on analyzing and interpreting data to generate actionable insights, the latter is focused on protecting systems, networks, and data from unauthorized access and cyber threats.', + 'In other words, the question of data science vs cyber security could be answered shortly by saying that data science seeks to leverage data for better decision-making, and cyber security is dedicated to safeguarding information and ensuring system integrity.', + ], + }, + { + question: + 'What is the difference between Data Science and Software Engineering?', + answer: [ + 'The difference between data science and software engineering is that data science focuses on extracting insights from data through statistical analysis, machine learning, and data visualization. Software Engineering, on the other hand, is centered on designing, building, and maintaining software systems.', + 'While both fields require programming skills, data scientists primarily manipulate and analyze data to support decision-making, and software engineers focus more on building the architecture and systems that allow for the creation of a specific software functionality.', + ], + }, { question: 'What is the difference between Data Science and Data Engineering?', From b4e633673295add67a1e0a1881a7ae583fc36180 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 13:34:59 +0100 Subject: [PATCH 03/77] Add data analyst FAQs --- .../roadmaps/data-analyst/data-analyst.md | 30 +++++++++++ src/data/roadmaps/data-analyst/faqs.astro | 51 +++++++++++++++++++ 2 files changed, 81 insertions(+) diff --git a/src/data/roadmaps/data-analyst/data-analyst.md b/src/data/roadmaps/data-analyst/data-analyst.md index ef99d9fad..e657a10ac 100644 --- a/src/data/roadmaps/data-analyst/data-analyst.md +++ b/src/data/roadmaps/data-analyst/data-analyst.md @@ -18,6 +18,36 @@ schema: imageUrl: 'https://roadmap.sh/roadmaps/data-analyst.png' datePublished: '2024-04-02' dateModified: '2024-04-02' +question: + title: 'What is Data Analysis?' + description: | + Data analysis is the process of transforming data into insights. It gives organizations the ability to support strategic business decisions. + + In a nutshell, this practice involves collecting data from different data sources, cleaning data to remove errors, and then applying different techniques to find patterns and identify anomalies. While the role of data analysts might be often confused with data scientists, those roles are not exactly the same. + + By using tools like data visualization and techniques, such as creating charts with Power BI or Microsoft Excel, you can present data in a way that helps stakeholders interpret it and make informed decisions (this is what the industry calls “data-driven decisions”). + + In essence, it’s all about using technical skills, different languages, and methods such as predictive modeling to analyze the data, predict future trends, and ultimately support the so-called data-driven insights. + + ## What does a Data Analyst do? + + A data analyst does many things, because the role itself is very versatile, it involves everything from collecting data to the presentation of findings (i.e. plotting results in charts, or presenting reports with found insights) and everything in between. + + To be more specific, a data analyst's work revolves around collecting and gathering data from databases, spreadsheets, and other data sources (usually structured data sources). They perform data analysis by cleaning data and then applying techniques such as regression analysis, and data mining to model data. The final aim is to identify trends and predict outcomes. + + With a strong foundation in both computer science and data science, they can use different programming languages and various tools to analyze data and generate reports or visualizations that support strategic decisions. + + By the nature of their work, no matter if they’re finding anomalies, performing predictive analytics, or simply solving problems with data-driven insights, data analysts function at the intersection of tech skills (i.e. coding) and business intelligence (they can’t produce meaning results if they don’t understand the business), transforming an organization’s data into data-driven decisions. + + ## What skills are required for Data Analysis? + + There are several skills required for data analysis, and they’re all technical skills. Data analysts must start by getting a solid foundation in working with raw data. They then need the ability to ingest and collect data from different sources—be it through databases, spreadsheets like Microsoft Excel or Google Sheets, or specialized data collection tools. + + Once you’ve gathered the data comes data cleaning. This means removing inconsistencies, errors, and outliers so that your data sets are accurate and reliable. Techniques like statistical analysis and data mining help you identify anomalies and ensure that you’re working with data that truly represents your problem universe. + + With the clean data, the next logical step is to analyze it. This involves using several techniques, such as regression analysis, and statistical modeling to recognize patterns and trends. In the end, the end goal is to learn from the data and share those insights with the business. + + When it comes to skills, understanding and having proficiency in languages such as Python or R, along with expertise in various tools like Power BI, are incredibly valuable here. They enable you to perform predictive modeling and even apply machine learning techniques when needed. seo: title: 'Data Analyst Roadmap' description: 'Learn to become an Data Analyst using this roadmap. Community driven, articles, resources, guides, interview questions, quizzes for modern backend development.' diff --git a/src/data/roadmaps/data-analyst/faqs.astro b/src/data/roadmaps/data-analyst/faqs.astro index e69de29bb..77b1553c9 100644 --- a/src/data/roadmaps/data-analyst/faqs.astro +++ b/src/data/roadmaps/data-analyst/faqs.astro @@ -0,0 +1,51 @@ +--- +import type { FAQType } from '../../components/FAQs/FAQs.astro'; + +export const faqs: FAQType[] = [ + { + question: 'Is Data Analysis a good career choice?', + answer: [ + 'Data analysis is a good career choice, in fact, it\'s a great career choice if you think about how technology is at the core of every company, and by definition, company operations produce data that can later be used to gather insights. Using these insights to drive decisions, and innovation and decide the future of the company, helps ensure these decisions are based on reality.', + 'With organizations increasingly relying on data to support decision-making, the demand for professionals who can analyze data, interpret data, and identify future trends is exceptionally high.', + 'This field not only offers the opportunity to work as a data analyst and develop your findings using different analysis and mining techniques, but also allows you to be a key player in making strategic business decisions.', + 'The field of data analytics is continuously growing and advancing with new techniques, AI-driven analysis or even new visualization tools, ensuring that a career as a data analyst is both challenging and rewarding for those who want to stay competitive and solve problems with actionable knowledge.', + ], + }, + { + question: 'Are Data Analysts well paid?', + answer: [ + 'Data analysts are generally well paid, reflecting both the complexity of their role and the high demand for their data analyst skills. While salaries depend on experience, location, and industry, data analysts are usually very well paid.', + 'For example, according to Glassdoor, data analysts start with an average salary of 111,000 USD in the United States, and can go up to 140,000 USD (on average) after 10 to 15 years of experience.', + 'The ability to collect and analyze data, through the use of sophisticated tools that generate insights makes data analysts invaluable to organizations of all sizes.', + 'The current labor statistics and market trends indicate that data analysts continue to be in high demand.', + ], + }, + { + question: 'What qualifications do I need to be a Data Analyst?', + answer: [ + 'To be a data analyst, most employers look for a solid educational foundation, usually a bachelor\'s degree in computer science, business administration, or data science.', + 'However, the needs of the organization tend to also determine the type of qualifications needed to get the job. Besides formal education, practical experience with programming languages, data tools, and data cleaning is crucial.', + 'You need to be comfortable using tools like (or similar to) Microsoft Excel, Power BI, or Google Sheets to collect data and perform analysis. On top of that, proficiency in statistics, predictive modeling, and even a touch of machine learning are all great skills to have, along with the ability to communicate what you find clearly, this last one being key because as a data analyst you\'ll be doing it quite a lot.', + 'Many successful data analysts develop these skills through a mix of formal education and self-learning, allowing them to analyze and model data, gathering insights from it.', + ], + }, + { + question: 'Can I teach myself Data Analysis?', + answer: [ + 'Yes, you can definitely teach yourself data analysis. Many devs looking to become a data analyst have built their careers by self-studying the principles of statistical analysis, and predictive analytics. Just like with any other technical profession, if you are able to pick up the knowledge on your own, you\'re more than capable of applying it on your day-to-day.', + 'And to get there, you can use one (or several) of the many online courses, tutorials and roadmaps (like this one) that cover everything from data collection and data cleaning to using advanced languages and data tools. Pick the ones that resonate with you the most, and go for it.', + 'The more you learn about the data analyst role and how to create effective data visualizations, the more you develop the technical skills necessary to support informed decisions and drive business intelligence. The first step is to start with the basics, such as understanding how to work with raw data and performing statistical analysis, and then gradually move on to more advanced topics like machine learning.', + 'With dedication and continuous practice, you can acquire the necessary data analyst skills and become a successful data analyst without formal classroom training.', + ], + }, + { + question: 'Is Data Analysis an IT job?', + answer: [ + 'Data Analysis is an IT job exactly like software development. In fact, one could say that while it involves significant technical expertise and the use of IT tools, it is much more than "just an IT job".', + 'The job of a data analyst blends practices like business intelligence, data science, and computer science to transform raw data into actionable insights.', + 'A data analyst uses technical skills such as programming, statistical modeling, and data cleaning, but the primary focus is on turning an organization\'s data into clear, actionable insights that support strategic decisions.', + 'This interdisciplinary approach ensures that data analysis is not confined to traditional IT roles, but is an essential function that supports business decisions and helps organizations stay competitive in a rapidly changing market.', + ], + }, +]; +--- From 614429283f966476c560bf326ad440f15c669dc3 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 13:44:36 +0100 Subject: [PATCH 04/77] Add java title faq --- src/data/roadmaps/java/java.md | 41 ++++++++++++++++++++++++++++++++++ 1 file changed, 41 insertions(+) diff --git a/src/data/roadmaps/java/java.md b/src/data/roadmaps/java/java.md index b0931ea9d..5e2424649 100644 --- a/src/data/roadmaps/java/java.md +++ b/src/data/roadmaps/java/java.md @@ -8,6 +8,47 @@ briefDescription: 'Step by step guide to becoming a Java Developer in 2025' title: 'Java Developer' description: 'Step by step guide to becoming a Java developer in 2025' hasTopics: true +question: + title: 'What is a Java Developer?' + description: | + A Java Developer is a software engineer specialized in developing applications using the Java language. + + Their work includes building web apps (like AEM or Liferay, both built in Java), desktop apps (such as Eclipse, the de facto IDE for Java itself), and enterprise systems (like ERP & CRM systems). Their responsibilities include writing code, solving technical issues, and ensuring the performance and reliability of the software. + + Java developers usually work with various tools and technologies, including JVM, frameworks like Vaadin, Struts, and others, and REST APIs, to deliver high-quality solutions. + + While Java is a very versatile language and the JVM allows for portability across multiple environments, Java developers can typically be found working in the financial, healthcare, telecom, and data-related industries. + + ## What do Java Developers do? + + Java Developers spend most of their time creating Java programs for various applications, including web apps, desktop applications, and large-scale enterprise systems. They are responsible for designing, writing, testing, and maintaining code to ensure performance, functionality, and security. + + One of the most common tasks of a Java Developer is working on backend development, where they create server-side logic, manage databases, and ensure seamless communication between different parts of an application. For example, they can use Spring Boot and Hibernate to build RESTful APIs. + + In enterprise environments, Java Developers work with large-scale solutions used by corporations, banks, and government institutions. For instance, they might develop an online banking system that processes thousands of transactions per second, ensuring high performance and reliability. In this case, they would work with JVM tuning, concurrency management, and database optimization to maintain system stability. + + Overall, Java Developers are expected to continuously learn and stay updated with the latest tech trends and best practices to ensure they deliver high-performance software solutions that meet business and user needs. + + ## What skills do I need to become a Java Developer? + + To become a Java Developer you need multiple different skills. The first thing you need is a strong foundation in the Java programming language, its ecosystem, and a proper understanding of software engineering principles. + + Of course, going deeper into Java, knowledge of JVM, concurrency, and memory management are crucial [java developer skills](https://roadmap.sh/java/developer-skills) to work on those large-scale enterprise systems. + + If you're working with RESTful APIs (which is highly likely), understanding technologies like Hibernate and having experience with Oracle (or other types of SQL) databases are important for backend Java developers. + + Generally speaking, devs should also be skilled in analyzing and solving tech problems, working within a team, and following industry standards in software development. Given the industries where Java is quite popular, familiarity with web applications, testing tools, and modern engineering practices is also very valuable. + + ## How do I become a Java Developer? + + To become a Java developer, it's highly recommended to follow a structured learning process (for example, the [Java roadmap](https://roadmap.sh/java) is a good place to start). + + The first thing to focus on is to learn the Java programming language, gaining an understanding of its core concepts, typing system, and some Object Oriented Programming (given how Java is highly based on it). You'll likely expand this last part over time, as it's one of the core principles around the language. + + Once familiar with Java, start practicing developing small Java programs; they will give you a chance to face real-world problems and find creative solutions to them. While you're doing that, try to study best practices and understand development methodologies to help you build expertise. + + And if that wasn't enough, many aspiring developers take online training courses and gain real-world experience through entry-level roles. In the end, the best way to learn programming is by doing, and these entry-level jobs are great for that. + dimensions: width: 968 height: 2000 From ef242e8747c9bfa26d1fc0468e53c2bcb4fac7a2 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 13:54:23 +0100 Subject: [PATCH 05/77] Add Java FAQs --- src/data/roadmaps/java/faqs.astro | 74 +++++++++++++++++++++++++++++++ 1 file changed, 74 insertions(+) diff --git a/src/data/roadmaps/java/faqs.astro b/src/data/roadmaps/java/faqs.astro index e69de29bb..b92df9edf 100644 --- a/src/data/roadmaps/java/faqs.astro +++ b/src/data/roadmaps/java/faqs.astro @@ -0,0 +1,74 @@ +--- +import type { FAQType } from '../../components/FAQs/FAQs.astro'; + +export const faqs: FAQType[] = [ + { + question: 'Is Java Development a good career choice?', + answer: [ + 'Java development is, indeed, a good career choice. Given the popularity of Java developers across many industries, this can be seen as a rewarding and stable career. Even after 30 years of language evolution and considering the many other competing programming languages in the market, Java remains one of the most widely used languages in software development, powering everything from web apps to enterprise solutions.', + 'There are companies across the globe, ranging from San Francisco all the way to India, searching for skilled Java developers to build scalable and high-performing systems.', + 'Another factor that makes Java Development a great career choice is the strong community and endless number of learning resources. With countless training programs, open-source projects, and frameworks, developers can constantly upgrade their skills and stay relevant in a rapidly evolving industry.', + 'The best part about this career path is that, given the high enterprise demand, it offers many opportunities for growth, exposure to innovative technologies, and the chance to work on challenging large-scale projects.', + ], + }, + { + question: 'How long does it take to become a Java Developer?', + answer: [ + 'Becoming a Java developer takes time and effort. However, the time required to learn the language depends on multiple factors, including the previous programming experience that the developer might bring as well as the depth of knowledge that is being aimed for (it\'s not the same as having a basic understanding of Java as mastering it).', + 'Becoming proficient in Java and securing a job as a Java Developer typically takes anywhere from a few months to a couple of years, again, depending on your prior experience.', + 'For absolute beginners with no programming experience, it can take anywhere from 12 to 24 months to reach a level where they can confidently apply for entry-level roles. However, by that time, they would\'ve fully covered all the programming basics, a great deal of Object Oriented Programming, and of course, many of the common use cases around Java.', + 'For those with actual programming knowledge but new to Java, such as Python or JavaScript developers, the transition to becoming a Java Developer can take 6 to 12 months. Since they already understand software development concepts, their main focus is on learning Java-specific syntax, frameworks, JVM internals, memory management, and performance optimization.', + 'The key to moving fast through this learning process is consistent practice, working on different projects, developing real-world applications, and staying updated with the latest tech trends.', + ], + }, + { + question: 'What does a Java Developer job description typically look like?', + answer: [ + 'A typical Java Developer job description usually involves two parts, on one side you have the classic and generic section where topics like designing and implementing Java programs, writing clean and maintainable code, and troubleshooting technical issues are mentioned, but then they go into more details and start mentioning topics like concurrency & multithreading, JVM optimization and design and implementation of scalable platforms.', + 'After that, they will go on to talk about databases such as Oracle, MySQL, or PostgreSQL, writing SQL queries, managing transactions, and ensuring data integrity. Which are key activities for any Java developer.', + 'When it comes to mentioning technologies, the list may vary depending on the industry, but they will likely include names such as Spring Boot, Maven, and JUnit, and typically IDEs such as IntelliJ or Eclipse will also be mentioned.', + 'Depending on their seniority, Java Developers may also interact with clients to understand business needs, propose architectures, and implement new features to improve user experience. For those scenarios, good soft skills are a must. Understanding how to talk to non-technical audiences and properly communicate with others are skills that will differentiate you from other developers.', + 'In the end, the job (the job\'s description) can change based on the company, industry, and geography, but regardless of location, the career path offers strong growth opportunities, job stability, and the chance to work on challenging and rewarding projects.', + ], + }, + { + question: 'How is JavaScript different from Java?', + answer: [ + 'JavaScript is different from Java because JavaScript is a dynamic, interpreted language primarily used for web development, running directly in browsers or on servers, thanks to runtimes such as Node.js, Bun, or Deno.', + 'Java, in contrast, is a statically typed, compiled language that runs on the Java Virtual Machine (JVM) and is popular for building large-scale applications and Android software.', + 'Despite the similarity in their names, they\'re completely different. Their design, execution, and typical use cases differ significantly. For more details, see this [java vs javascript](https://roadmap.sh/java/vs-javascript) guide.', + ], + }, + { + question: 'How is a Java Developer different from a Python Developer?', + answer: [ + 'A Java developer is different from a Python developer mostly because of the primary focus of their programming languages and the slight (but significant) differences in their development lifecycle.', + 'For the Java programmer, with Java being statically typed and compiled, their development workflow is not exactly the same as for the Python developer, whose language is dynamically typed and interpreted. This impacts performance, startup time, memory management, and how they structure code.', + 'In terms of technological focus, Java developers typically build enterprise applications, web apps, and backend systems using Spring Boot, JPA, and RESTful APIs. They work on high-performance applications where JVM tuning, memory management, and concurrency are critical to ensure the scalability and availability of the platform.', + 'On the other hand, Python developers tend to specialize in data science, machine learning, automation, and scripting, using frameworks like TensorFlow, Pandas, and SciKit. Mind you, Python devs can also do web development. However, in the enterprise scene, Java is one of the household names that almost no one dares to contradict.', + 'In the end, both career paths offer a great chance at growth and stability, with Java being usually better for enterprise software, while Python excels in AI, automation, and rapid prototyping.', + 'More on this topic here: [Java vs Python](https://roadmap.sh/java/vs-python).', + ], + }, + { + question: 'Is Java still relevant in modern software development?', + answer: [ + 'Java is highly relevant in modern software development, even after all these years, due to its versatility, performance, and incredible industry adoption. The language has evolved since it was first released 30 years ago, and the fact that it still remains relevant is solid proof of that process.', + 'Nowadays, it\'s really difficult to find an industry where Java isn\'t a known and valid option (even if there are alternatives).', + 'Many large enterprises, startups, and tech giants continue to use Java for building web applications, desktop apps, and full cloud platforms. Java\'s ability to handle concurrency, optimize memory, and provide stable performance makes it ideal for high-demand applications.', + 'In terms of flexibility and portability, the JVM (Java Virtual Machine) allows Java to run on multiple platforms, making it one of the best choices for cross-platform development in industries like financial services, e-commerce, big data processing, and enterprise applications.', + 'This is why, even after 30 years, Java Developers continue to be quite popular. With ongoing improvements to the language, modern tools, and the growing focus on cloud computing and microservices, Java remains a top choice for software engineers looking for a long-term career in development.', + ], + }, + { + question: 'What are the typical salaries for Java Developers in different regions?', + answer: [ + 'The typical salaries for Java developers will change from region to region, and even then, the seniority and responsibility of the role will also affect the final number.', + 'However, as a guide, we can look at some statistics from sites such as Glassdoor, which put the average annual Java developer salary in San Francisco at around $131,000. For a senior developer, the number goes, on average, up to $220,000.', + 'In India, for example, the average we can glean from sites like Indeed is between ₹410,306 and ₹839,714 per year.', + 'And finally, in Europe, salaries for Java Developers vary by country. In Germany, for instance, the average annual salary is approximately €60,000, while in the United Kingdom, it ranges around £55,000.', + 'It\'s important to note that these numbers are averages and can vary based on experience, industry, company size, specific job requirements, and your ability to negotiate the final salary. So, take them with a grain of salt and use them carefully.', + ], + }, +]; +--- From 27cbdd18fdd567393927b58602a4352dacbc456f Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 14:52:04 +0100 Subject: [PATCH 06/77] Add full stack roadmap FAQs --- src/data/roadmaps/full-stack/faqs.astro | 66 +++++++++++++++++++++- src/data/roadmaps/full-stack/full-stack.md | 36 +++++++++++- 2 files changed, 98 insertions(+), 4 deletions(-) diff --git a/src/data/roadmaps/full-stack/faqs.astro b/src/data/roadmaps/full-stack/faqs.astro index c074eb0e5..d1ae72244 100644 --- a/src/data/roadmaps/full-stack/faqs.astro +++ b/src/data/roadmaps/full-stack/faqs.astro @@ -3,9 +3,71 @@ import type { FAQType } from '../../../components/FAQs/FAQs.astro'; export const faqs: FAQType[] = [ { - question: 'What does a Full Stack Developer do?', + question: 'Can I learn Full Stack Development in 3 months?', answer: [ - 'A Full Stack Developer is a developer who is comfortable working with both the front-end and back-end of a web application. They are responsible for developing and maintaining the entire application, from the user interface to the server-side logic and a [full stack developer job description](https://roadmap.sh/full-stack/job-description) can vary depending on the company and the project they are working on.', + 'You can learn full stack development in 3 months, but only if you are already proficient in either front-end or back-end development, and you just need to pick up the missing half. Otherwise, expecting to learn the ins and outs of web development (both front and back end) in such a short amount of time is too much for a single developer.', + "Usually mastering full stack development takes more time and a lot of hands-on experience. If you only have a 3-month span of time to learn the skill and assuming you already have programming experience, the best thing you can do is to quickly run through [the full stack developer roadmap](https://roadmap.sh/full-stack). While you won't learn everything you need to be a proficient full stack developer, you'll have a basic notion of everything that entails the role.", + ], + }, + { + question: + 'What does a Full Stack Developer job description typically look like?', + answer: [ + "A typical full stack developer job description will look for proficiency in both front-end and back-end technologies. You'll often see requirements for HTML, CSS, and JavaScript (and related frameworks like React or Angular) alongside server-side languages such as Python, Ruby, or Java.", + 'With these technologies, employers will also look for experience with databases (either some flavor of SQL or some more exotic noSQL option), API integration (usually RESTful, although there is always someone asking for GraphQL experience), version control systems like Git, and a knack for problem-solving, but then again, that last one is critical for any dev role.', + 'They might even mention collaborative skills and a willingness to adapt to new technologies as projects evolve.', + ], + }, + { + question: 'How should I prepare for a Full Stack Developer Interview?', + answer: [ + 'To prepare for a full stack developer interview you should start by refreshing all web development basics. Starting with HTML, CSS and JavaScript of course, and then moving on to other topics such as the DOM, event bubbling, error handling, HTTP protocol, the client-server pattern and finally making the jump into back-end land, covering topics such as server-side rendering, REST, database base management and SQL just to name a few.', + 'On top of that, try to practice common coding challenges, review algorithms and data structures, and brush up on system design principles.', + 'In the end, for full stack developers having a well-rounded portfolio can really help illustrate your experience, so consider working on some small but hyper-focused personal projects to showcase different aspects of your full stack skillset.', + ], + }, + { + question: + 'How is a Full Stack Developer different from a Software Engineer?', + answer: [ + 'A full stack developer is different from a software engineer because while all full stack devs are software engineers, not all software engineers are full stack devs.', + "You can think of a Full Stack Developer as a specialized software developer that's focused on web applications, handling everything from the visual design on the front-end to server-side logic and databases on the back-end.", + 'On the other hand, a Software Engineer has a larger scope and can work on a range of systems and projects, from mobile apps and desktop software to embedded systems and large-scale distributed platforms.', + ], + }, + { + question: 'What is a Full Stack Engineer?', + answer: [ + 'A Full Stack Engineer is usually a term used interchangeably with that of full stack developer. However, the "engineer" portion of the name could imply a deeper understanding of system designs, architecture (both in the back-end and front-end), and scalability.', + 'On the other hand, the full stack "developer" might signal a more code-oriented role, where there is less strategy involved and more problem solving through code.', + 'In the end, the difference might be barely noticeable, depending on the company and the project.', + ], + }, + { + question: 'Is Learning Full Stack Development Difficult?', + answer: [ + "Learning full stack development can be difficult if you're not already versed in one of the two areas tackled by this role, because that means having to learn how the entire web ecosystem works, starting with the browser and its DOM API, all the way down to server-side programming, and the communication between both environments.", + "While learning full stack development, you'll be mastering multiple technologies, but you have to keep the learning path structured to avoid losing yourself halfway through. This is why using the [full stack roadmap](https://roadmap.sh/full-stack) is such a great idea, it'll help you keep the goal in sight while taking you through all the technologies you'll be using (HTML, JavaScript, CSS, server-side scripting languages, SQL, etc).", + "If you're just getting started, this process can take anywhere from 6 months to 2 years, depending on the level of experience you already have and your learning pace.", + ], + }, + { + question: 'What are the most popular stacks in Full Stack Development?', + answer: [ + "The most popular stacks in full stack development have become industry standards for a while now. While it is true that you're completely free to pick the best stack that suits your particular needs and context (project timeline, team's experience, etc), there are options that have already been proven to work great together.", + "Some of the most popular ones include the [MERN stack](https://www.code-clash.net/stacks/MERN) using MongoDB (for a quick and versatile database), Express.js (as the backend framework), React (frontend), and Node.js (server). If you're an Angular developer, you can try the [MEAN stack](https://www.mongodb.com/resources/languages/mean-stack), which is similar to MERN but uses Angular instead of React.", + "And there are others; for PHP, you have the battle-tested LAMP stack; if you're more into Python, you can try to use Django + React, and if you're into Ruby on Rails, you have the ROR stack (just to name a few).", + "If you're just getting started and don't know what technologies to focus on, trying a few of these industry-standard tech stacks might be a great starting point.", + ], + }, + { + question: 'What are the most common frameworks for full stack development?', + answer: [ + "For full stack development, the most common frameworks will vary based on your technology preferences. However, for each major tech, there are some industry standards that you can go with if you don't have any other preferences.", + 'If JavaScript is your main programming language, then you can use frameworks like ExpressJS, NestJS, or even Hono for the backend, and a front-end library like React (with React router for instance) for all your UI needs. This combo gives you all you need to develop efficient web applications.', + 'If you\'re into Python, the Django + DRF (Django REST Framework) will give you all you need to get started. This is a high-level Python framework that follows the "batteries-included" philosophy (meaning it comes with everything you need). It has a built-in ORM (great for dealing with that relational database), authentication, and an admin panel, which solves 95% of all your web development needs. And, paired with DRF, you can build a great API-based scalable backend with minimum effort.', + "And finally, if you're more of a Ruby developer, you can always go with Ruby on Rails (RoR), which is built with the convention-over-configuration framework that simplifies full stack development. It works great with the MVC pattern, also comes with an included ORM (ActiveRecord), and has scaffolding tools to help speed up development.", + "There are plenty of options around, so make sure you do your research before picking the one you'll go with.", ], }, ]; diff --git a/src/data/roadmaps/full-stack/full-stack.md b/src/data/roadmaps/full-stack/full-stack.md index bbe4e9d76..e1dcea338 100644 --- a/src/data/roadmaps/full-stack/full-stack.md +++ b/src/data/roadmaps/full-stack/full-stack.md @@ -13,9 +13,41 @@ dimensions: width: 968 height: 2075 question: - title: 'What is Full Stack Development?' + title: 'What is a Full Stack Developer?' description: | - Full stack development is the practice of being proficient in both the front-end and back-end aspects of web application development. A full stack developer is capable of working on all layers of a software application, from the user interface and user experience (front-end) to the server, database, and server-side logic (back-end). This versatility allows them to create and maintain complete web applications independently or as part of a development team. + A Full Stack Developer is someone who can work on both the front-end and the back-end of an application. They write code and, most of the time, also take care of everything required to push the product into production. + + Full stack developers (also known as full stack web developers) will usually have the required skills to tackle any part of the web development process. In the front end, they'll focus on building the user interface using technologies such as HTML, [JavaScript](https://roadmap.sh/javascript), and CSS (Cascading Style Sheets - usually mixed with some UI framework such as React or Vue). For the back-end side of these projects, they will code the business logic and any type of data access required involving either some [SQL](https://roadmap.sh/sql) database or, in some projects, noSQL options. As part of the back-end, there might also be some API design involved, as well as other performance and scalability optimizations that need to be performed. + + As a summary, you could say that a full stack developer is a "jack of all trades" when it comes to web development. While they might not always be the absolute experts in any of those technologies, they're more than capable of filling any gaps in the team. + + ## What languages are used in Full Stack Development? + + In full stack development, the languages used can range from just 3 to a multitude of options. + + For the front-end there aren't that many options; you can only use HTML, CSS, and JavaScript (with the freedom of picking the framework that best suits your preferences). However, on the back-end, the story is quite different. Of course, you can pick JavaScript, keeping the full tech stack homogenous, but you also have the option to add multiple programming languages if you're going with a microservices-based architecture, using the right language for each service. If that's your situation, some of the most popular languages include [Python](https://roadmap.sh/python), Ruby, [Java](https://roadmap.sh/java), [PHP](https://roadmap.sh/php), or [C#](https://roadmap.sh/aspnet-core). + + And to top it all out, you'll often use something like SQL (Structured Query Language) for your database interactions (unless you're going with a NoSQL database). + + ## What skills do I need to become a Full Stack Developer? + + To become a full stack developer, the skills you'll need are very varied. You'll need to understand both front-end and back-end software development, including some of the most popular frameworks and libraries. + + That means you'll have to know how to turn designs into good user interfaces following the latest UX trends. In the back-end, you'll need to grasp server-side programming, work with databases, manage APIs, and ensure that everything integrates as it should. And you'll do all of that as part of your regular development process. + + On top of all of this, other key full stack developer skills that would enhance your profile are version control systems (such as Git which is the current industry standard) and understanding RESTful APIs. + + Of course, strong problem-solving abilities, debugging skills, and a willingness to continuously learn new technologies are also crucial for this role, like they are for any software development job. + + In the end, this particular blend of skills allows developers to build full-featured web applications from start to finish. + + ## How do I become a Full Stack Developer? + + To become a full stack developer, you need to start by learning the basics of HTML, CSS, and JavaScript, they will give you everything you need to master front-end development. + + Once you're ready, you can then pick up a back-end language such as Python or Java (or even JavaScript again through Node.js). Try to start small and build a simple back-end for your website. A good idea here is to pick up a full stack framework, such as NextJS or Django; they will make it easy for you to integrate the back-end into your project. Slowly start introducing database management into the mix. This will open up the door to more complex applications. Just remember to start with small projects to practice your full stack developer skills and gradually work on more complex ones. + + As a long-term learning plan, creating a portfolio to showcase your progress can be a great motivator. Consider following roadmaps like the [full stack roadmap](https://roadmap.sh/full-stack), and keep learning through online courses or bootcamps to boost your journey into full stack development. schema: headline: 'Full Stack Developer Roadmap' description: 'Learn how to become a Full Stack Developer with this interactive step by step guide in 2025. We also have resources and short descriptions attached to the roadmap items so you can get everything you want to learn in one place.' From 2124ce96dcd6b2e63d3b3e8097009b5a2a1c834a Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 15:44:17 +0100 Subject: [PATCH 07/77] Add changelog entry --- .../changelogs/ai-tutor-cpp-java-roadmaps.md | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 src/data/changelogs/ai-tutor-cpp-java-roadmaps.md diff --git a/src/data/changelogs/ai-tutor-cpp-java-roadmaps.md b/src/data/changelogs/ai-tutor-cpp-java-roadmaps.md new file mode 100644 index 000000000..1fd86dd76 --- /dev/null +++ b/src/data/changelogs/ai-tutor-cpp-java-roadmaps.md @@ -0,0 +1,20 @@ +--- +title: 'AI Tutor, C++ and Java Roadmaps' +description: 'We just launched our first paid SQL course' +images: + 'AI Tutor': 'https://assets.roadmap.sh/guest/ai-tutor-xwth3.png' + 'Java Roadmap': 'https://assets.roadmap.sh/guest/new-java-roadmap-t7pkk.png' + 'C++ Roadmap': 'https://assets.roadmap.sh/guest/new-cpp-roadmap.png' +seo: + title: 'AI Tutor, C++ and Java Roadmaps' + description: '' +date: 2025-04-03 +--- + +We have revised the C++ and Java roadmaps and introduced an AI tutor to help you learn anything. + +- We just launched an [AI Tutor](https://roadmap.sh/ai-tutor), just give it a topic, pick a difficulty level and it will generate a personalized study plan for you. There is a map view, quizzes an embedded chat to help you along the way. +- [C++ roadmap](https://roadmap.sh/cpp) has been revised with improved content +- We have also redrawn the [Java roadmap](https://roadmap.sh/java) from scratch, replacing the deprecated items, adding new content and improving the overall structure. + + From b576ad5f867610a107673ec92b134d5d2445bfd8 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 15:47:20 +0100 Subject: [PATCH 08/77] Fix typo in file name --- ...1aUsWbF1OFcmMUHbJa.md => standards@vvE1aUsWbF1OFcmMUHbJa.md} | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) rename src/data/roadmaps/cpp/content/{standardds@vvE1aUsWbF1OFcmMUHbJa.md => standards@vvE1aUsWbF1OFcmMUHbJa.md} (97%) diff --git a/src/data/roadmaps/cpp/content/standardds@vvE1aUsWbF1OFcmMUHbJa.md b/src/data/roadmaps/cpp/content/standards@vvE1aUsWbF1OFcmMUHbJa.md similarity index 97% rename from src/data/roadmaps/cpp/content/standardds@vvE1aUsWbF1OFcmMUHbJa.md rename to src/data/roadmaps/cpp/content/standards@vvE1aUsWbF1OFcmMUHbJa.md index 5940deba6..01da099e9 100644 --- a/src/data/roadmaps/cpp/content/standardds@vvE1aUsWbF1OFcmMUHbJa.md +++ b/src/data/roadmaps/cpp/content/standards@vvE1aUsWbF1OFcmMUHbJa.md @@ -60,4 +60,4 @@ Here's a brief summary of the different C++ standards released to date: ``` - Coroutines and more. -Remember that to use these language features, you might need to configure your compiler to use the specific C++ standard version. For example, with GCC or Clang, you can use the `-std=c++11`, `-std=c++14`, `-std=c++17`, or `-std=c++20` flags. \ No newline at end of file +Remember that to use these language features, you might need to configure your compiler to use the specific C++ standard version. For example, with GCC or Clang, you can use the `-std=c++11`, `-std=c++14`, `-std=c++17`, or `-std=c++20` flags. From 7a988cbbea70f54a0b54f2422bfa9f259e9e1abb Mon Sep 17 00:00:00 2001 From: Kalvin Chakma <123386698+kalvin-chakma@users.noreply.github.com> Date: Thu, 3 Apr 2025 20:48:07 +0600 Subject: [PATCH 09/77] fix: label typo (#8454) --- src/data/roadmaps/cpp/cpp.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/roadmaps/cpp/cpp.json b/src/data/roadmaps/cpp/cpp.json index 404e1ad89..25843ff50 100644 --- a/src/data/roadmaps/cpp/cpp.json +++ b/src/data/roadmaps/cpp/cpp.json @@ -3117,7 +3117,7 @@ "position": { "x": 227.76444711909286, "y": 2041.110352538959 }, "selected": true, "data": { - "label": "Standardds", + "label": "Standards", "style": { "fontSize": 17, "justifyContent": "flex-start", From f798035f0f494715f397d5c4771aebe4b02c0b4d Mon Sep 17 00:00:00 2001 From: Arik Chakma Date: Thu, 3 Apr 2025 20:50:22 +0600 Subject: [PATCH 10/77] feat: remove ai roadmap limit for pro user (#8442) --- .../GenerateRoadmap/GenerateRoadmap.tsx | 37 +++++++++++-------- .../GenerateRoadmap/RoadmapSearch.tsx | 30 +++++++-------- src/pages/ai/[aiRoadmapSlug].astro | 2 + src/pages/ai/index.astro | 4 +- 4 files changed, 42 insertions(+), 31 deletions(-) diff --git a/src/components/GenerateRoadmap/GenerateRoadmap.tsx b/src/components/GenerateRoadmap/GenerateRoadmap.tsx index 6d0414441..1c8050bea 100644 --- a/src/components/GenerateRoadmap/GenerateRoadmap.tsx +++ b/src/components/GenerateRoadmap/GenerateRoadmap.tsx @@ -35,8 +35,9 @@ import { readAIRoadmapStream, } from '../../lib/ai.ts'; import { AITermSuggestionInput } from './AITermSuggestionInput.tsx'; -import { IncreaseRoadmapLimit } from './IncreaseRoadmapLimit.tsx'; import { AuthenticationForm } from '../AuthenticationFlow/AuthenticationForm.tsx'; +import { UpgradeAccountModal } from '../Billing/UpgradeAccountModal.tsx'; +import { useIsPaidUser } from '../../queries/billing.ts'; export type GetAIRoadmapLimitResponse = { used: number; @@ -101,6 +102,7 @@ export function GenerateRoadmap(props: GenerateRoadmapProps) { const roadmapContainerRef = useRef(null); + const { isPaidUser, isLoading: isLoadingPaidUser } = useIsPaidUser(); const { rc: referralCode } = getUrlParams() as { rc?: string; }; @@ -472,12 +474,25 @@ export function GenerateRoadmap(props: GenerateRoadmapProps) { } const pageUrl = `https://roadmap.sh/ai/${roadmapSlug}`; - const canGenerateMore = roadmapLimitUsed < roadmapLimit; + const canGenerateMore = roadmapLimitUsed < roadmapLimit || isPaidUser; + const isGenerateButtonDisabled = + isLoadingResults || + (isAuthenticatedUser && + // if no limit, + (!roadmapLimit || + // no roadmap term, + !roadmapTerm || + // if limit is reached and user is not paid user, + (roadmapLimitUsed >= roadmapLimit && !isPaidUser) || + // if roadmap term is the same as the current roadmap term, + roadmapTerm === currentRoadmap?.term || + // if key only, + isKeyOnly)); return ( <> {isConfiguring && ( - { setIsConfiguring(false); loadAIRoadmapLimit().finally(() => null); @@ -519,7 +534,7 @@ export function GenerateRoadmap(props: GenerateRoadmapProps) { {!isLoading && (
- {isKeyOnly && isAuthenticatedUser && ( + {isKeyOnly && isAuthenticatedUser && !isPaidUser && (

We have hit the limit for AI roadmap generation. Please try @@ -533,7 +548,7 @@ export function GenerateRoadmap(props: GenerateRoadmapProps) {

)} - {!isKeyOnly && isAuthenticatedUser && ( + {!isKeyOnly && isAuthenticatedUser && !isPaidUser && (
{ @@ -591,15 +606,7 @@ export function GenerateRoadmap(props: GenerateRoadmapProps) { showLoginPopup(); } }} - disabled={ - isLoadingResults || - (isAuthenticatedUser && - (!roadmapLimit || - !roadmapTerm || - roadmapLimitUsed >= roadmapLimit || - roadmapTerm === currentRoadmap?.term || - isKeyOnly)) - } + disabled={isGenerateButtonDisabled} > {isLoadingResults && ( <> diff --git a/src/components/GenerateRoadmap/RoadmapSearch.tsx b/src/components/GenerateRoadmap/RoadmapSearch.tsx index cb26813c0..62cdab641 100644 --- a/src/components/GenerateRoadmap/RoadmapSearch.tsx +++ b/src/components/GenerateRoadmap/RoadmapSearch.tsx @@ -5,7 +5,8 @@ import { isLoggedIn } from '../../lib/jwt'; import { showLoginPopup } from '../../lib/popup'; import { cn } from '../../lib/classname.ts'; import { AITermSuggestionInput } from './AITermSuggestionInput.tsx'; -import { IncreaseRoadmapLimit } from './IncreaseRoadmapLimit.tsx'; +import { UpgradeAccountModal } from '../Billing/UpgradeAccountModal.tsx'; +import { useIsPaidUser } from '../../queries/billing.ts'; type RoadmapSearchProps = { roadmapTerm: string; @@ -30,6 +31,7 @@ export function RoadmapSearch(props: RoadmapSearchProps) { isKeyOnly, } = props; + const { isPaidUser, isLoading } = useIsPaidUser(); const canGenerateMore = limitUsed < limit; const [isConfiguring, setIsConfiguring] = useState(false); const [isAuthenticatedUser, setIsAuthenticatedUser] = useState(false); @@ -44,7 +46,7 @@ export function RoadmapSearch(props: RoadmapSearchProps) { return (
{isConfiguring && ( - { setIsConfiguring(false); loadAIRoadmapLimit(); @@ -193,7 +195,7 @@ export function RoadmapSearch(props: RoadmapSearchProps) {

)} - {isKeyOnly && isAuthenticatedUser && ( + {isKeyOnly && isAuthenticatedUser && !isPaidUser && (

We have hit the limit for AI roadmap generation. Please try again @@ -222,7 +224,7 @@ export function RoadmapSearch(props: RoadmapSearchProps) {

)} - {!isKeyOnly && limit > 0 && isAuthenticatedUser && ( + {!isKeyOnly && limit > 0 && isAuthenticatedUser && !isPaidUser && (

You have generated{' '} @@ -235,17 +237,15 @@ export function RoadmapSearch(props: RoadmapSearchProps) { {' '} roadmaps today.

- {isAuthenticatedUser && ( -

- -

- )} +

+ +

)}
diff --git a/src/pages/ai/[aiRoadmapSlug].astro b/src/pages/ai/[aiRoadmapSlug].astro index 03243697f..79fbfbf97 100644 --- a/src/pages/ai/[aiRoadmapSlug].astro +++ b/src/pages/ai/[aiRoadmapSlug].astro @@ -2,6 +2,7 @@ import { aiRoadmapApi } from '../../api/ai-roadmap'; import BaseLayout from '../../layouts/BaseLayout.astro'; import { GenerateRoadmap } from '../../components/GenerateRoadmap/GenerateRoadmap'; +import { CheckSubscriptionVerification } from '../../components/Billing/CheckSubscriptionVerification'; export const prerender = false; @@ -31,4 +32,5 @@ const title = roadmap?.title || 'Roadmap AI'; isAuthenticatedUser={roadmap?.isAuthenticatedUser} client:load /> + diff --git a/src/pages/ai/index.astro b/src/pages/ai/index.astro index c2c7c1e6d..40a280b0d 100644 --- a/src/pages/ai/index.astro +++ b/src/pages/ai/index.astro @@ -1,8 +1,10 @@ --- import { GenerateRoadmap } from '../../components/GenerateRoadmap/GenerateRoadmap'; import BaseLayout from '../../layouts/BaseLayout.astro'; +import { CheckSubscriptionVerification } from '../../components/Billing/CheckSubscriptionVerification'; --- - + + From 0d9374285beceeb01475b80bdffe6e904d610d2c Mon Sep 17 00:00:00 2001 From: Pavan Kumar Balijepalli Date: Thu, 3 Apr 2025 20:21:51 +0530 Subject: [PATCH 11/77] Fix md syntax issue (#8452) --- src/data/roadmaps/ai-data-scientist/ai-data-scientist.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/data/roadmaps/ai-data-scientist/ai-data-scientist.md b/src/data/roadmaps/ai-data-scientist/ai-data-scientist.md index aec3b3421..67794d2ab 100644 --- a/src/data/roadmaps/ai-data-scientist/ai-data-scientist.md +++ b/src/data/roadmaps/ai-data-scientist/ai-data-scientist.md @@ -53,7 +53,7 @@ question: **#1. Learn the Basics:** Start with math (like statistics) and programming (Python or R) to understand and process data efficiently. - **#2.** Practice with Data: Begin with small projects, like analyzing trends or creating charts, and gradually tackle more complex goals. + **#2. Practice with Data:** Begin with small projects, like analyzing trends or creating charts, and gradually tackle more complex goals. **#3. Take Courses:** Use online classes and tutorials to learn Data Science step by step. From b75d36a8c070c6fed11c178ac9da73abd45f57e6 Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Thu, 3 Apr 2025 17:41:46 +0100 Subject: [PATCH 12/77] Changes to the ai tutor URL --- src/components/Analytics/GoogleAd.astro | 2 +- .../AuthenticationFlow/GitHubButton.tsx | 2 +- .../AuthenticationFlow/GoogleButton.tsx | 10 +++------- .../AuthenticationFlow/LinkedInButton.tsx | 7 ++----- .../Dashboard/DashboardAiRoadmaps.tsx | 19 +++++-------------- .../Dashboard/ListDashboardCustomProgress.tsx | 11 +++-------- .../ExploreAIRoadmap/AIRoadmapsList.tsx | 2 +- .../ExploreAIRoadmap/EmptyRoadmaps.tsx | 2 +- src/components/GenerateCourse/AICourse.tsx | 2 +- .../GenerateCourse/AICourseActions.tsx | 2 +- .../GenerateCourse/AICourseCard.tsx | 2 +- .../GenerateCourse/AICourseContent.tsx | 6 +++--- .../GenerateCourse/GenerateAICourse.tsx | 2 +- src/components/GenerateCourse/GetAICourse.tsx | 2 +- .../GenerateRoadmap/GenerateRoadmap.tsx | 6 +++--- .../GenerateRoadmap/RoadmapSearch.tsx | 8 ++++---- .../GenerateRoadmap/RoadmapTopicDetail.tsx | 2 +- .../HeroSection/FavoriteRoadmaps.tsx | 10 ++++------ src/components/Navigation/Navigation.astro | 6 ++---- src/components/RoadmapAlert.tsx | 10 +++++----- .../RoadmapDropdownMenu.tsx | 6 +++--- .../changelogs/ai-tutor-cpp-java-roadmaps.md | 2 +- src/helper/generate-ai-course.ts | 2 +- src/layouts/BaseLayout.astro | 4 ++++ src/layouts/SkeletonLayout.astro | 1 + .../{ai => ai-roadmaps}/[aiRoadmapSlug].astro | 0 src/pages/{ai => ai-roadmaps}/explore.astro | 2 +- src/pages/ai-roadmaps/index.astro | 10 ++++++++++ src/pages/ai-tutor/index.astro | 17 ----------------- src/pages/{ai-tutor => ai}/[courseSlug].astro | 3 ++- src/pages/ai/index.astro | 14 +++++++++++--- src/pages/{ai-tutor => ai}/search.astro | 3 ++- 32 files changed, 80 insertions(+), 97 deletions(-) rename src/pages/{ai => ai-roadmaps}/[aiRoadmapSlug].astro (100%) rename src/pages/{ai => ai-roadmaps}/explore.astro (93%) create mode 100644 src/pages/ai-roadmaps/index.astro delete mode 100644 src/pages/ai-tutor/index.astro rename src/pages/{ai-tutor => ai}/[courseSlug].astro (89%) rename src/pages/{ai-tutor => ai}/search.astro (91%) diff --git a/src/components/Analytics/GoogleAd.astro b/src/components/Analytics/GoogleAd.astro index 34efd7927..a2ccae16f 100644 --- a/src/components/Analytics/GoogleAd.astro +++ b/src/components/Analytics/GoogleAd.astro @@ -10,8 +10,8 @@ 'roadmaps', 'community', 'start-here', + 'ai-roadmaps', 'ai', - 'ai-tutor', 'teams', 'about', 'account', diff --git a/src/components/AuthenticationFlow/GitHubButton.tsx b/src/components/AuthenticationFlow/GitHubButton.tsx index adba8132f..350b3807d 100644 --- a/src/components/AuthenticationFlow/GitHubButton.tsx +++ b/src/components/AuthenticationFlow/GitHubButton.tsx @@ -127,7 +127,7 @@ export function GitHubButton(props: GitHubButtonProps) { // For non authentication pages, we want to redirect back to the page // the user was on before they clicked the social login button if (!['/login', '/signup'].includes(window.location.pathname)) { - const pagePath = ['/respond-invite', '/befriend', '/r', '/ai'].includes( + const pagePath = ['/respond-invite', '/befriend', '/r', '/ai-roadmaps'].includes( window.location.pathname, ) ? window.location.pathname + window.location.search diff --git a/src/components/AuthenticationFlow/GoogleButton.tsx b/src/components/AuthenticationFlow/GoogleButton.tsx index 8655f68dd..cdd51a4fb 100644 --- a/src/components/AuthenticationFlow/GoogleButton.tsx +++ b/src/components/AuthenticationFlow/GoogleButton.tsx @@ -1,9 +1,6 @@ import { useEffect, useState } from 'react'; -import Cookies from 'js-cookie'; import { - FIRST_LOGIN_PARAM, - TOKEN_COOKIE_NAME, - setAuthToken, + FIRST_LOGIN_PARAM, setAuthToken } from '../../lib/jwt'; import { httpGet } from '../../lib/http'; import { COURSE_PURCHASE_PARAM } from '../../lib/jwt'; @@ -11,8 +8,7 @@ import { GoogleIcon } from '../ReactIcons/GoogleIcon.tsx'; import { Spinner } from '../ReactIcons/Spinner.tsx'; import { CHECKOUT_AFTER_LOGIN_KEY } from './CourseLoginPopup.tsx'; import { - getStoredUtmParams, - triggerUtmRegistration, + triggerUtmRegistration } from '../../lib/browser.ts'; import { cn } from '../../lib/classname.ts'; @@ -132,7 +128,7 @@ export function GoogleButton(props: GoogleButtonProps) { '/respond-invite', '/befriend', '/r', - '/ai', + '/ai-roadmaps', ].includes(window.location.pathname) ? window.location.pathname + window.location.search : window.location.pathname; diff --git a/src/components/AuthenticationFlow/LinkedInButton.tsx b/src/components/AuthenticationFlow/LinkedInButton.tsx index 6447f3e7d..b665c249e 100644 --- a/src/components/AuthenticationFlow/LinkedInButton.tsx +++ b/src/components/AuthenticationFlow/LinkedInButton.tsx @@ -1,10 +1,7 @@ import { useEffect, useState } from 'react'; -import Cookies from 'js-cookie'; import { FIRST_LOGIN_PARAM, - COURSE_PURCHASE_PARAM, - TOKEN_COOKIE_NAME, - setAuthToken, + COURSE_PURCHASE_PARAM, setAuthToken } from '../../lib/jwt'; import { cn } from '../../lib/classname.ts'; import { httpGet } from '../../lib/http'; @@ -131,7 +128,7 @@ export function LinkedInButton(props: LinkedInButtonProps) { '/respond-invite', '/befriend', '/r', - '/ai', + '/ai-roadmaps', ].includes(window.location.pathname) ? window.location.pathname + window.location.search : window.location.pathname; diff --git a/src/components/Dashboard/DashboardAiRoadmaps.tsx b/src/components/Dashboard/DashboardAiRoadmaps.tsx index bcc6ca597..45e183266 100644 --- a/src/components/Dashboard/DashboardAiRoadmaps.tsx +++ b/src/components/Dashboard/DashboardAiRoadmaps.tsx @@ -1,15 +1,6 @@ -import type { UserProgress } from '../TeamProgress/TeamProgressPage'; -import { DashboardCustomProgressCard } from './DashboardCustomProgressCard'; import { DashboardCardLink } from './DashboardCardLink'; -import { useState } from 'react'; -import { CreateRoadmapModal } from '../CustomRoadmap/CreateRoadmap/CreateRoadmapModal'; -import { Simulate } from 'react-dom/test-utils'; import { - ArrowUpRight, - Bot, - BrainCircuit, - Map, - PencilRuler, + BrainCircuit } from 'lucide-react'; type DashboardAiRoadmapsProps = { @@ -30,7 +21,7 @@ export function DashboardAiRoadmaps(props: DashboardAiRoadmapsProps) {

My AI Roadmaps

AI Generated Roadmaps @@ -41,7 +32,7 @@ export function DashboardAiRoadmaps(props: DashboardAiRoadmapsProps) { @@ -61,7 +52,7 @@ export function DashboardAiRoadmaps(props: DashboardAiRoadmapsProps) { {roadmaps.map((roadmap) => ( {roadmap.title} @@ -70,7 +61,7 @@ export function DashboardAiRoadmaps(props: DashboardAiRoadmapsProps) { + Generate New diff --git a/src/components/Dashboard/ListDashboardCustomProgress.tsx b/src/components/Dashboard/ListDashboardCustomProgress.tsx index 67febd891..f73c3fe5e 100644 --- a/src/components/Dashboard/ListDashboardCustomProgress.tsx +++ b/src/components/Dashboard/ListDashboardCustomProgress.tsx @@ -3,13 +3,8 @@ import { DashboardCustomProgressCard } from './DashboardCustomProgressCard'; import { DashboardCardLink } from './DashboardCardLink'; import { useState } from 'react'; import { CreateRoadmapModal } from '../CustomRoadmap/CreateRoadmap/CreateRoadmapModal'; -import { Simulate } from 'react-dom/test-utils'; import { - ArrowUpRight, - Bot, - BrainCircuit, - Map, - PencilRuler, + BrainCircuit, PencilRuler } from 'lucide-react'; type ListDashboardCustomProgressProps = { @@ -63,7 +58,7 @@ export function ListDashboardCustomProgress( @@ -99,7 +94,7 @@ export function ListDashboardCustomProgress( { if (!isAIGeneratedRoadmaps) { e.preventDefault(); diff --git a/src/components/ExploreAIRoadmap/AIRoadmapsList.tsx b/src/components/ExploreAIRoadmap/AIRoadmapsList.tsx index 7129410e6..a376c873c 100644 --- a/src/components/ExploreAIRoadmap/AIRoadmapsList.tsx +++ b/src/components/ExploreAIRoadmap/AIRoadmapsList.tsx @@ -26,7 +26,7 @@ export function AIRoadmapsList(props: AIRoadmapsListProps) { return (