fix: topic id

* feat: implement todo and resource button

* feat: add hover color

.astro/settings.json

@@ -3,6 +3,6 @@
 		"enabled": false
 	},
 	"_variables": {
-		"lastUpdateCheck": 1719080230711
+		"lastUpdateCheck": 1720119515249
 	}
 }

contributing.md

@@ -50,7 +50,6 @@ Visit the following resources to learn more:
 - `@opensource@`
 - `@article@`
 - `@course@`
-- `@opensource@`
 - `@podcast@`
 - `@video@`
 
@@ -96,6 +95,6 @@ It's important to add a valid type, this will help us categorize the content and
 
   - Adding whitespace that doesn't add to the readability of the content.
   - Rewriting content in a way that doesn't add any value.
-  - None English content.
+  - Non-English content.
   - PR's that don't follow our style guide, have no description and a default title.
-  - Links to your own blog articles.
+  - Links to your own blog articles.

readme.md

@@ -42,6 +42,7 @@ Here is the list of available roadmaps with more being actively worked upon.
 - [AI and Data Scientist Roadmap](https://roadmap.sh/ai-data-scientist)
 - [AWS Roadmap](https://roadmap.sh/aws)
 - [Linux Roadmap](https://roadmap.sh/linux)
+- [Terraform Roadmap](https://roadmap.sh/terraform)
 - [Data Analyst Roadmap](https://roadmap.sh/data-analyst)
 - [MLOps Roadmap](https://roadmap.sh/mlops)
 - [Product Manager Roadmap](https://roadmap.sh/product-manager)
@@ -79,6 +80,7 @@ Here is the list of available roadmaps with more being actively worked upon.
 - [Docker Roadmap](https://roadmap.sh/docker)
 - [Prompt Engineering Roadmap](https://roadmap.sh/prompt-engineering)
 - [Technical Writer Roadmap](https://roadmap.sh/technical-writer)
+- [DevRel Engineer Roadmap](https://roadmap.sh/devrel)
 
 There are also interactive best practices:
 

src/components/EditorRoadmap/EditorRoadmapRenderer.css

@@ -7,21 +7,24 @@ svg text tspan {
 svg > g[data-type='topic'],
 svg > g[data-type='subtopic'],
 svg g[data-type='link-item'],
-svg > g[data-type='button'] {
+svg > g[data-type='button'],
+svg > g[data-type='resourceButton'],
+svg > g[data-type='todo-checkbox'],
+svg > g[data-type='todo'] {
   cursor: pointer;
 }
 
 svg > g[data-type='topic']:hover > rect {
-  fill: #d6d700;
+  fill: var(--hover-color);
 }
 
 svg > g[data-type='subtopic']:hover > rect {
-  fill: #f3c950;
+  fill: var(--hover-color);
 }
-svg > g[data-type='button']:hover {
-  opacity: 0.8;
-}
-svg g[data-type='link-item']:hover {
+svg g[data-type='button']:hover,
+svg g[data-type='link-item']:hover,
+svg g[data-type='resourceButton']:hover,
+svg g[data-type='todo-checkbox']:hover {
   opacity: 0.8;
 }
 

src/components/EditorRoadmap/EditorRoadmapRenderer.tsx

@@ -45,7 +45,15 @@ function getNodeDetails(svgElement: SVGElement): RoadmapNodeDetails | null {
   return { nodeId, nodeType, targetGroup, title };
 }
 
-const allowedNodeTypes = ['topic', 'subtopic', 'button', 'link-item'];
+const allowedNodeTypes = [
+  'topic',
+  'subtopic',
+  'button',
+  'link-item',
+  'resourceButton',
+  'todo',
+  'todo-checkbox',
+];
 
 export function EditorRoadmapRenderer(props: RoadmapRendererProps) {
   const { resourceId, nodes = [], edges = [] } = props;
@@ -90,7 +98,11 @@ export function EditorRoadmapRenderer(props: RoadmapRendererProps) {
       return;
     }
 
-    if (nodeType === 'button' || nodeType === 'link-item') {
+    if (
+      nodeType === 'button' ||
+      nodeType === 'link-item' ||
+      nodeType === 'resourceButton'
+    ) {
       const link = targetGroup?.dataset?.link || '';
       const isExternalLink = link.startsWith('http');
       if (isExternalLink) {
@@ -104,6 +116,20 @@ export function EditorRoadmapRenderer(props: RoadmapRendererProps) {
     const isCurrentStatusLearning = targetGroup?.classList.contains('learning');
     const isCurrentStatusSkipped = targetGroup?.classList.contains('skipped');
 
+    if (nodeType === 'todo-checkbox') {
+      e.preventDefault();
+      if (!isLoggedIn()) {
+        showLoginPopup();
+        return;
+      }
+
+      const newStatus = targetGroup?.classList.contains('done')
+        ? 'pending'
+        : 'done';
+      updateTopicStatus(nodeId, newStatus);
+      return;
+    }
+
     if (e.shiftKey) {
       e.preventDefault();
       if (!isLoggedIn()) {

src/components/FrameRenderer/renderer.ts

@@ -152,6 +152,10 @@ export class Renderer {
       return;
     }
 
+    if (/^check:/.test(topicId)) {
+      topicId = topicId.replace('check:', '');
+    }
+
     pageProgressMessage.set('Updating progress');
     updateResourceProgress(
       {

src/components/OpenSourceBanner.astro

@@ -24,7 +24,7 @@ const discordInfo = await getDiscordInfo();
       class='mt-5 grid grid-cols-1 justify-between gap-2 divide-x-0 sm:my-11 sm:grid-cols-3 sm:gap-0 sm:divide-x mb-4 sm:mb-0'
     >
       <OpenSourceStat text='GitHub Stars' value={starCount} />
-      <OpenSourceStat text='Registered Users' value={'850k'} />
+      <OpenSourceStat text='Registered Users' value={'+1M'} />
       <OpenSourceStat
         text='Discord Members'
         value={discordInfo.totalFormatted}

src/components/OpenSourceStat.astro

@@ -28,7 +28,7 @@ const isDiscordMembers = text.toLowerCase() === 'discord members';
   {
     isRegistered && (
       <p class='flex items-center text-sm text-blue-500 sm:flex'>
-        <span class='mr-1.5 rounded-md bg-blue-500 px-1 text-white'>+55k</span>
+        <span class='mr-1.5 rounded-md bg-blue-500 px-1 text-white'>+75k</span>
         every month
       </p>
     )
@@ -44,7 +44,7 @@ const isDiscordMembers = text.toLowerCase() === 'discord members';
   }
   <div class="flex flex-row items-center sm:flex-col my-1 sm:my-0">
     <p
-      class='relative my-0 sm:my-4 mr-1 sm:mr-0 text-base font-bold lowercase sm:w-auto sm:text-5xl'
+      class='relative my-0 sm:my-4 mr-1 sm:mr-0 text-base font-bold sm:w-auto sm:text-5xl'
     >
       {value}
     </p>

src/components/RelatedRoadmaps.astro

@@ -24,9 +24,6 @@ const relatedQuestionDetails = await getQuestionGroupsByIds(relatedQuestions);
           <span class='text-md flex items-center rounded-md border bg-white px-3 py-1 font-medium'>
             <Clipboard className='mr-1.5 text-black' size='17px' />
             Test your Knowledge
-            <span class='ml-2 rounded-md border border-yellow-300 bg-yellow-100 px-1 py-0.5 text-xs uppercase'>
-              New
-            </span>
           </span>
           <a
             href='/questions'

src/components/Roadmaps/RoadmapsPage.tsx

@@ -222,6 +222,12 @@ const groups: GroupType[] = [
         type: 'skill',
         otherGroups: ['Web Development'],
       },
+      {
+        title: 'Terraform',
+        link: '/terraform',
+        type: 'skill',
+        otherGroups: ['Web Development'],
+      },
     ],
   },
   {
@@ -315,6 +321,11 @@ const groups: GroupType[] = [
         link: '/product-manager',
         type: 'role',
       },
+      {
+        title: 'DevRel Engineer',
+        link: '/devrel',
+        type: 'role',
+      },
     ],
   },
   {

src/components/TopicDetail/TopicDetail.tsx

@@ -421,7 +421,7 @@ export function TopicDetail(props: TopicDetailProps) {
               )}
 
               {/* Contribution */}
-              {canSubmitContribution && !hasEnoughLinks && contributionUrl && (
+              {canSubmitContribution && !hasEnoughLinks && contributionUrl && hasContent && (
                 <div className="mb-12 mt-3 border-t text-sm text-gray-400 sm:mt-12">
                   <div className="mb-4 mt-3">
                     <p className="">

src/data/question-groups/react/react.md

@@ -35,7 +35,7 @@ questions:
       - 'Beginner'
   - question: What is the difference between Real DOM and Virtual DOM?
     answer: |
-      Virtual DOM is the representation of a UI in the form of a plain javascript object. It is a node tree that lists the elements, their attributes and content as Objects and their properties. Real DOM is the real representation of a UI which can be seen and inspected in the browser.
+      Virtual DOM is the representation of a UI in the form of a plain JavaScript object. It is a node tree that lists the elements, their attributes and content as Objects and their properties. Real DOM is the real representation of a UI which can be seen and inspected in the browser.
       Manipulating the virtual DOM is much faster than real DOM, because nothing gets drawn on the screen. React uses this virtual DOM to figure out the most efficient way to update the browser DOM.
     topics:
       - 'Core'
@@ -80,7 +80,7 @@ questions:
   - question: What are refs in React?
     answer: |
       Refs are used to get reference to a DOM node or an instance of a component. They help to access the DOM nodes or React elements created in the render method.
-      You can also use refs When you want a component to “remember” some information, but you don’t want that information to trigger new renders, you can use a ref.
+      You can also use refs when you want a component to “remember” some information, but you don’t want that information to trigger new renders, you can use a ref.
     topics:
       - 'Core'
       - 'Intermediate'
@@ -98,7 +98,7 @@ questions:
       - 'Advanced'
   - question: What is the difference between react and react-dom packages?
     answer: |
-      React is a library for building user interfaces. The package `react` contains only the renderer-agnostic code i.e. the core React library, algorithm for computing changes in the UI and other helpers. . The package `react-dom` contains the code specific to the DOM rendering of React components.
+      React is a library for building user interfaces. The package `react` contains only the renderer-agnostic code i.e. the core React library, algorithm for computing changes in the UI and other helpers. The package `react-dom` contains the code specific to the DOM rendering of React components.
     topics:
       - 'Core'
       - 'Beginner'
@@ -224,7 +224,7 @@ questions:
     topics:
       - 'UX'
       - 'Intermediate'
-  - question: How React Virtual DOM works?
+  - question: How does React Virtual DOM work?
     answer: virtual-dom.md
     topics:
       - 'Core'

src/data/roadmaps/android/android.md

@@ -1,5 +1,6 @@
 ---
 pdfUrl: '/pdfs/roadmaps/android.pdf'
+renderer: 'editor'
 order: 5
 briefTitle: 'Android'
 briefDescription: 'Step by step guide to becoming an Android Developer in 2024'
@@ -9,7 +10,7 @@ hasTopics: true
 isNew: false
 dimensions:
   width: 968
-  height: 2197.76
+  height: 2070
 schema:
   headline: 'Android Developer Roadmap'
   description: 'Learn how to become a Android Developer with this interactive step by step guide in 2024. We also have resources and short descriptions attached to the roadmap items so you can get everything you want to learn in one place.'

src/data/roadmaps/android/content/104-interface-and-navigation/elements/100-text-view.md

@@ -1,3 +0,0 @@
-# TextView
-
-`TextView` in Android is a UI (User Interface) element that allows you to display text to the user. You can set the text to be displayed by declaring it in XML or introducing it programmatically. This element supports various attributes such as `android:textAllCaps`, `android:textAppearance`, `android:textColor`, etc., to customize its appearance. Each `TextView` corresponds to an `android.widget.TextView` object. You can also react to user interaction events such as touch or click with the help of listeners (like `View.onClickListener` or `View.onTouchListener`). Manipulating with `TextView` is common when creating Android apps as they form the basic building block for user interface components.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/101-edit-text.md

@@ -1,3 +0,0 @@
-# EditText
-
-`EditText` is a common element used in Android development. It's a fundamental component for accepting user input in simple form or dialog. It allows users to modify text within its bounding box, much like what a TextField does in more general programming languages. If you have used a form or a webpage that allows you to input text, it was probably created with an EditText or similar control. You can customize an `EditText` in various ways including size, color, initial text, and hint text. You can also listen for changes in the text in an EditText, apply filters, specify input types, and more. The `android:text` attribute lets you pre-fill the EditText with text, and `android:hint` provides hint text when the EditText is empty.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/102-buttons.md

@@ -1,3 +0,0 @@
-# Buttons
-
-Buttons in Android are user interactions that trigger certain programmable actions. They are part of the `View` class in Android, making them an essential part of user interfaces. Android provides different types of buttons such as `Button`, `ToggleButton`, `RadioButton`, `CheckBox`, `Switch`, `ImageButton`, and `FloatingActionButton`. Each of these serves a different purpose and provides varied interactivity options. Their behavior and appearance can be customized in terms of different properties such as text, ID, color, etc. They can be programmed in the XML layout files or dynamically in the Java/Kotlin code.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/103-image-view.md

@@ -1,3 +0,0 @@
-# ImageView
-
-An `ImageView` is a class used in Android for displaying an image file. It inherits from 'View' class and extends the ability of views to show images. Images can be loaded from various sources such as a resource file, drawable, or a URL, with varying scale types. This class also provides methods to manage the image scale type, define padding, set tint, and manipulate the color filter. It's important to note that `ImageView` should be used in moderation as it is resource-intensive and could degrade app performance if used excessively.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/104-list-view.md

@@ -1,3 +0,0 @@
-# ListView
-
-`ListView` in Android is a view which groups several items and displays them in vertical scrollable list. The list items are automatically inserted to the list using an `Adapter` that pulls content from a source such as an array or database query and converts each item result into a view that's placed into the list. It is widely used in android apps as it offers an easy way to display a list of data in an organized manner. Functions such as `setAdapter(Adapter)` to specify data source, `setOnItemClickListener(OnItemClickListener)` to listen for click events on items, and `setOnScrollListener(OnScrollListener)` to listen for scroll events, provide further control over the list behavior.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/105-tabs.md

@@ -1,3 +0,0 @@
-# Tabs
-
-Tabs are commonly used in Android for switching between different views within the same activity. Some instances may make use of a `TabLayout` located within a `ViewPager` to create swipeable tabs. Each tab is usually associated with a fragment. To create tabs in Android, you need to use the `TabLayout` component that is available in the Material Design library. A typical `TabLayout` contains multiple `TabItem`, each representing a tab in the interface. The `TabLayout` works with a `ViewPager` to provide a consistent swipeable interface. Users can approach tabs differently depending on whether they are coded for manual or automatic filling. Manual tab creation and addition require explicit defining of each tab and adding them to the `TabLayout`, while in automatic filling tabs are generated from the `PagerAdaptor`'s page title.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/106-fragments.md

@@ -1,3 +0,0 @@
-# Fragments
-
-In Android, **Fragments** represent a behavior or a part of the user interface in an Activity. They are modular sections of an activity, which are reusable in different activities. They contribute to making an application adaptive to different devices with varied screen sizes. A fragment has its own lifecycle, receives its own input events, and can be added or removed while the activity is running. While they exist within the context of an activity, they can also be used independently to encapsulate functionality for easier development and reuse. Multiple fragments can combine in a single activity to build a multi-pane UI.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/107-dialogs.md

@@ -1,5 +0,0 @@
-# Dialogs
-
-Dialogs in Android are small windows that prompt users to make a decision or enter additional information. They don't fill the screen and are normally used for modal events that require users to take action before they can proceed. In Android, `Dialog` is actually an abstract class directly subclassed from `Object`. `AlertDialog` is the subclass that you will most commonly use, which contains a number of methods as compared to `Dialog` to support features like lists, checkboxes, radio buttons, and a custom layout design. They are typically used for user interactions such as warnings, notifications, and menus. 
-
-To create a dialog, you must use the `Dialog` class or one of its subclasses, such as `DialogFragment` or `AlertDialog`. For a more detailed explanation on implementing dialogs in Android, you can refer to the official Android Developer's Guide.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/108-toast.md

@@ -1,3 +0,0 @@
-# Toast
-
-`Toast` in Android is a simple message that appears on the screen for a short period of time then disappears automatically. It is generally used to provide feedback to the user about an operation in a small popup without requiring any user interaction. This feedback could be an error message or simply information that a process completed successfully. You can configure the toast to appear anywhere on the screen and specify how long it stays up. In order to use a toast, you have to import the `android.widget.Toast` package and instantiate a Toast object. Here's an example of creating a simple toast: `Toast.makeText(context, text, duration).show()`, where context is your application context, text is the message to display, and duration is either `Toast.LENGTH_SHORT` or `Toast.LENGTH_LONG`.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/109-bottom-sheet.md

@@ -1,3 +0,0 @@
-# Bottom Sheet
-
-The **Bottom Sheet** is a popular UI component within the Android development environment. This interface element acts like a drawer that slides up from the bottom of the screen to reveal more content or options. There are two types of bottom sheets in Android: "persistent" and "modal". The persistent bottom sheet shows in-app content that supplements the primary screen content, remaining visible even when the user interacts with the primary surface. On the other hand, the modal bottom sheet is a simple menu presenting a list of options, often used for sharing content, navigating, or for user-editable content. It can be dismissed by the user and does not remain visible when the user interacts with the primary surface.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/110-drawer.md

@@ -1,3 +0,0 @@
-# Drawer
-
-The `Drawer` in Android is a slide-out menu that enables users to navigate between different parts of an application. It is usually triggered by a hamburger icon in the app's top-left corner. The `Drawer` can contain a list of options, subheadings, and separators to articulate the app's structure. In Android, this component can be implemented using `DrawerLayout` and `NavigationView`. The `DrawerLayout` is the parent component and `NavigationView` is typically placed within the `DrawerLayout`. One key thing to note is that the `Drawer` should not be used as the only means of navigating through an application, according to Android's design guidelines.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/111-animations.md

@@ -1,5 +0,0 @@
-# Animations
-
-In Android, animations are used to give a more visual, dynamic, and interactive aspect to a static user interface. Android offers four categories of animation APIs in order to create and manage the animations. These are: **Property Animation**: This allows modification of properties of an object over a given time period. **View Animation**: Consists of two subcategories i.e. Tween Animation (transition of a view from one state to another) and Frame Animation (displaying frames one after another). **Drawable Animation**: This is similar to a slideshow, showing one image after another. Lastly, **Layout Animation**: This is used to animate the layout itself when views are added or removed.
-
-You can utilize Android's built-in animations or fully customize your own to add unique transitions and movements in your applications. Every app can benefit from a touch of animation to create a more immersive and pleasant user experience.

src/data/roadmaps/android/content/104-interface-and-navigation/elements/index.md

@@ -1 +0,0 @@
-# Elements

src/data/roadmaps/android/content/104-interface-and-navigation/layouts/100-frame.md

@@ -1,3 +0,0 @@
-# Frame
-
-The `FrameLayout` in Android is a layout manager that pinpoints its children to the top left corner of the layout. This means that all children will be piled up on each other at the same top left corner, which might not be visually appealing. However, it can be useful in some specific designs, where you desire to overlay one view on top of another. Additionally, `FrameLayout` allows you to control the positioning of items in the frame by configuring the `gravity` property. However, bear in mind that this layout does not provide any visual structure – you may need to use `padding` or `margin` to create spaces between the elements in the frame.

src/data/roadmaps/android/content/104-interface-and-navigation/layouts/101-linear.md

@@ -1,3 +0,0 @@
-# Linear
-
-`Linear Layout` in Android is a layout where all elements are aligned in a linear fashion - either horizontally or vertically. Each element inside a `LinearLayout` takes up space according to its size. In a vertical layout, elements can occupy the full width and a certain height, whereas in a horizontal layout, elements can occupy the full height and a certain width. This is extremely useful if you want to align elements in a single direction. You provide the orientation of a `LinearLayout` using the `android:orientation` attribute.

src/data/roadmaps/android/content/104-interface-and-navigation/layouts/102-relative.md

@@ -1,3 +0,0 @@
-# Relative
-
-`RelativeLayout` in Android is a layout that positions views based on their relationship to each other or the parent. This means that you can set your views related to the position of siblings (other child views) or the parent. For example, you can place a button right to an ImageView, or at the bottom of a parent view. Android systems determine this order dynamically by examining each of the RelativeLayout parameters, such as `android:layout_below` or `android:layout_toRightOf`, and applying them according to the rules defined. This layout is useful when you're building a UI that needs to maintain relative positioning of elements, even as screen size or orientation changes.

src/data/roadmaps/android/content/104-interface-and-navigation/layouts/103-constraint.md

@@ -1,3 +0,0 @@
-# Constraint
-
-ConstraintLayout is a ViewGroup that allows you to position and size widgets in a flexible way. It was added to Android Studio 2.2 in 2016. It's similar to RelativeLayout in that all views are laid out according to relationships between sibling views and the parent layout, but it's more flexible than RelativeLayout and easier to use with Android Studio's Layout Editor. All direct children of a ConstraintLayout have a set of constraints that define their position. These constraints are used to position the child's left or top edge relative to other views or the parent layout. The position and size for each view can be specified using a number of methods including baseline alignment, margins, and bias. ConstraintLayout works best with Android Studio's Layout Editor where you can drag-and-drop views and then add constraints to fine-tune view positions.

src/data/roadmaps/android/content/104-interface-and-navigation/layouts/104-recycle-view.md

@@ -1,3 +0,0 @@
-# RecyclerView
-
-The `RecyclerView` is an enhanced version of the `ListView` and the `GridView`. It is a more advanced and flexible version of `ListView`. In `RecyclerView`, there are several different components that work together to display your data. The `RecyclerView.Adapter` is similar to the `BaseAdapter`; it takes data and turns it into views that can be inserted in the `RecyclerView` layout. On the other hand, the `RecyclerView.LayoutManager` helps positioning items inside the `RecyclerView` and determining the behavior when scrolling. A third significant component is `RecyclerView.ViewHolder`. It provides references to the views for each data item which help to reduce unnecessary calls to `findViewById()`. It's also important to mention that the `RecyclerView` class supports not only lists but also a custom implementation of horizontal or vertical lists, grids, or staggered grids while offering more opportunities for fantastic custom animations.

src/data/roadmaps/android/content/104-interface-and-navigation/layouts/index.md

@@ -1 +0,0 @@
-# Layouts

src/data/roadmaps/android/content/105-design-architecture/architectural-patterns/100-mvi.md

@@ -1,3 +0,0 @@
-# MVI
-
-"MVI" stands for Model-View-Intent, and is an architectural pattern used in Android development. This pattern introduces a unidirectional data flow which makes it easier to understand an app's state at any given point in time. In the MVI pattern, the `Intent` represents an intention or desire to perform an action, often triggered by user inputs. The `View` is responsible for rendering the UI and emitting intents. The `Model`, on the other hand, represents the state of the app and reacts to intents by changing its state. It's the Model's responsibility to respond to each Intent with a resulting new state. Once a new state is created, it is published back to the `View`. This clear separation and single direction of data and event flow can help in managing side-effects and handling asynchronous actions.

src/data/roadmaps/android/content/105-design-architecture/architectural-patterns/101-mvvm.md

@@ -1,3 +0,0 @@
-# MVVM
-
-"**MVVM**" stands for "Model View ViewModel" and it is an architectural pattern that aims to separate the development of Graphical User Interface from the business logic. In MVVM, the **Model** represents the data and the business logic of the app. The **View** is responsible for the display of the data and interacts with the user. The **ViewModel** acts as a link between the Model and the View. It handles all the UI logic and preserves the state of the data when the configuration changes or when the app is stopped and then started again.

src/data/roadmaps/android/content/105-design-architecture/architectural-patterns/102-mvp.md

@@ -1,3 +0,0 @@
-# MVP
-
-MVP stands for Model-View-Presenter. It is an architectural pattern often used in Android development. In MVP, the architect separates the application's responsibilities into three main layers. The 'Model' refers to the data and business logic of the application. The 'View', typically implemented by an Activity or Fragment in Android, is responsible for displaying the data to the user and collecting user inputs. Lastly, the 'Presenter' works as a bridge between the Model and the View. It listens to user interactions from the View and updates the Model accordingly, and also updates the View based on changes in the Model. This separation of responsibilities allows for better code organization, easier testing, and greater flexibility.

src/data/roadmaps/android/content/105-design-architecture/architectural-patterns/103-mvc.md

@@ -1,3 +0,0 @@
-# MVC
-
-MVC stands for Model-View-Controller. It is a widely used design pattern for designing software's architecture. According to this, an application is divided into three core components. The 'Model' is responsible for handling the data and business logic. The 'View' is responsible for rendering the model's data and generating the user interface. The 'Controller' acts as an interface between the Model and View. It processes all the user's interactions and updates the View and Model accordingly. It's crucial to note that in MVC, the View can have multiple representations of the Model.

src/data/roadmaps/android/content/105-design-architecture/architectural-patterns/index.md

@@ -1 +0,0 @@
-# Architectural patterns

src/data/roadmaps/android/content/109-common-services/100-firebase/index.md

@@ -1,3 +0,0 @@
-# Firebase
-
-`Firebase` is a Backend-as-a-Service (BaaS) app development platform that provides hosted backend services such as a real-time database, cloud storage, authentication, crash reporting, machine learning, remote configuration, and hosting for your static files. It provides an API that allows developers to store and sync data across multiple clients. Firebase includes a responsive client library to bind application data to your user interface and backend services for authentication systems, analytics, database management, etc. Firebase simplifies application development all while ensuring server-side effectiveness.

src/data/roadmaps/android/content/index.md

@@ -1 +0,0 @@
-#