PPR
- Overview
- Guideline 1: The Program Uses a List
- Guideline 2: List being used in the Program
- Guideline 3: Having a Function
- Guideline 4: Calling a Function
- CPT Requirements
- MC Review and Improvements
  - 1. Identifying and Correcting Errors (29%)
  - 2. Algorithmic Efficiency (50%)
  - 3. Developing Algorithms (50%)
  - 4. Fault Tolerance (50%)
  - 5. Crowdsourcing (50%)
- Study Plan
  - 1. Prioritize Weak Areas First
  - 2. Use AP-Style Practice Questions
  - 3. Active Learning
  - 4. Timed Practice Tests

# My Markdown File

Some content here...

<!-- Utterances Comment Section -->
<div id="utterances"></div>
<script src="https://utteranc.es/client.js"
        repo="your-username/your-repo"
        issue-term="pathname"
        theme="github-light"
        crossorigin="anonymous"
        async>
</script>

PPR

Overview

In my Profile Setup Project, users enter their top 5 favorite artists, which is processed and stored as a list. This satisfies AP CSP Create Task requirements by:

Creating a list from user input
Processing the list before storing and using it
Creating a Function
Calling to the Function

Guideline 1: The Program Uses a List

Requirement: The program must create a list to manage multiple elements.

How My Code Meets This:

The user inputs a comma-separated list of their Top 5 Favorite Artists into an input field.
This string is then converted into a list in JavaScript using .split(",").

<label for="artists">Top 5 Favorite Artists:</label>
<input type="text" id="artists" name="artists" placeholder="Comma-separated list" required>
const artists = document.getElementById('artists').value;

Guideline 2: List being used in the Program

Requirement: The program must create a list to manage multiple elements.

How My Code Meets This:

The input string is procesed into a array using .split(",").
This converst the text string to a list of artists
The list is stored in favorite_artists and sent to an API

const createProfile = async (name, artists, bio, profilePicture) => {
    const url = `${pythonURI}/api/profile`;

    const data = {
        name: name,
        uid: name,
        pfp: profilePicture,
        bio: bio,
        favorite_artist: artists.split(",")
    };

Guideline 3: Having a Function

Requirement: Define a function that serves a specific purpose.

What the Function Does

Takes user input (edited bio and favorite artists)
Processes and formats the input into a structured JSON object
Sends a PUT request to update the database
Calls another function to refresh the displayed profile

function editProfile() {
    const updatedProfile = {
        uid: uid,
        bio: document.getElementById('editBio').value,
        favorite_artist: document.getElementById('editArtists').value
    };

    const requestOptions = {
        method: "PUT",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify(updatedProfile),
        redirect: "follow"
    };

    fetch(`${pythonURI}/api/profile`, requestOptions)
        .then((response) => response.text())
        .then((result) => {
            console.log(result);
            alert("Profile updated successfully!");
            fetchProfile();
        })
        .catch((error) => console.error("Error updating profile:", error));
}

Guideline 4: Calling a Function

Requirement: A function must be called in response to a user event.

How My Code Meets This:

The editProfile function is executed when the user clicks the Save Changes button:

<button type="button" onclick="editProfile()">Save Changes</button>

Additionally, the fetchProfile function is called when the page loads to automatically display the user’s profile:

window.onload = fetchProfile;

CPT Requirements

Instructions for Input

User Input:
- The user provides input through an HTML form that collects their name, bio, top five favorite artists, and profile picture URL.
- This triggers the handleFormSubmission event when the user submits the form.
- Example:
```
<form id="profileForm" onsubmit="handleFormSubmission(event); return false;">
    <label for="name">Your Name:</label>
    <input type="text" id="name" name="name" required>
</form>
```

Use of a Collection Type

List:
- The artists input is stored as a comma-separated list and then converted into an array.
- Storing this data in a list makes it easier to manipulate and display users’ favorite artists dynamically.
- The list simplifies the process of iterating over artists to display them later.
- Example:
```
const artists = document.getElementById('artists').value.split(',');
```

Contributing Procedure

Procedure: createProfile

Purpose: Handles sending user input to the backend API for profile creation.
Parameters:
- name (string)
- artists (list)
- bio (string)
- profilePicture (string)
Return Type: None (performs an API request and handles response asynchronously)

Implementation:

const createProfile = async (name, artists, bio, profilePicture) => {
    const url = `${pythonURI}/api/profile`;
    const data = {
        name: name,
        uid: name,
        pfp: profilePicture,
        bio: bio,
        favorite_artist: artists
    };
    try {
        const response = await fetch(url, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(data)
        });
        if (!response.ok) {
            const errorData = await response.json();
            console.error("Error:", errorData.message);
        }
    } catch (error) {
        console.error("Network error:", error);
    }
};

Algorithm with Sequencing, Selection, and Iteration

Sequencing: - The function handleFormSubmission is the first user-driven event. The onsubmit event is used to trigger the profile creation process when the user submits the form, ensuring that the input is correctly captured. - The form is then validated using the wordCount and bioError checks. Before any data is processed or sent to the server, the bio field is validated to ensure that it contains between 1-25 words. This ensures that the form data is correct before proceeding. Otherwise, an error message is displayed. This process also demonstrates iteration as I make use of an if else statement to ensure that the bio does not exceed the 25 word limit.

  const bio = document.getElementById('bio').value.trim();
  const wordCount = bio.split(/\s+/).filter(word => word).length;
  if (wordCount < 1 || wordCount > 25) {
    errorDiv.textContent = "Bio must be between 1 and 25 words.";
    return false;
}    

The data from the form is then extracted into variables.

const name = document.getElementById('name').value;
const artists = document.getElementById('artists').value;
const profilePicture = document.getElementById('profilePicture').value;   

After the data is collected and validated, the createProfile function is called. This function sends the form data as a JSON object to the backend via a POST request to create the user profile.
After profile creation, the script authenticates the user by sending the profile’s username (uid) and a password (here hardcoded as “password”).
Once the profile is successfully created, a button is dynamically added to the page to allow the user to navigate to their newly created profile page.

Calling the Student-Developed Procedure

The createProfile function is called inside handleFormSubmission after validating the input:

async function runProcess() {
    await createProfile(name, artists, bio, profilePicture);
    showProfileLinkButton();
}
runProcess();

Output Mechanism

Visual Output:

A success message is displayed in an alert box when the profile is successfully created.

Example:

alert("Profile created successfully!");

A dynamically created button allows users to navigate to their newly created profile.

Example:

function showProfileLinkButton() {
    const button = document.createElement('button');
    button.textContent = "Go to Profile";
    button.addEventListener('click', function () {
        window.location.href = "/gaheera_2025/melodymates/created_profile.html/";
    });
    document.getElementById('formContainer').appendChild(button);
}

MCQ Reflection

Score: 51/67

Strongest Skills:

Program Design and Development: 100%
Data Compression: 100%
Variables and Assignments: 100%
Strings: 100%
Boolean Expressions: 100%
Conditionals: 100%
Nested Conditionals: 100%
Iteration: 100%
Binary Search: 100%
Calling Procedures: 100%
Developing Procedures: 100%
Random Values: 100%
Simulations: 100%
Undecidable Problems: 100%
The Internet: 100%
Digital Divide: 100%
Legal and Ethical Concerns: 100%
Safe Computing: 100%

Weakest Skills:

Identifying and Correcting Errors: 29%
🔹 Correction: Index should be decremented after checking each list element to ensure all elements are checked.
Algorithmic Efficiency: 50%
🔹 Correction: An algorithm must take a number of steps less than or equal to a polynomial function. Accessing 10 elements is a reasonable time.
Developing Algorithms: 50%
🔹 Correction: The flowchart sets available to true whenever weekday is true and miles is less than 20, and sets false otherwise.
Fault Tolerance: 50%
🔹 Correction: It is possible to have redundant routing in both configurations. Possible routes include Q-P-V, Q-T-V in 1, and Q-S-V and Q-T-T-V in 2.
Crowdsourcing: 50%
🔹 Correction: Using an application to enlist a large number of people to help find a lost pet is an example of crowdsourcing, which obtains input into a task by leveraging many individuals via the internet.

Anlysis:

Identifying and Correcting Errors: 29%
🔹 Correction: Index should be decremented after checking each list element to ensure all elements are checked.
Algorithmic Efficiency: 50%
🔹 Correction: An algorithm must take a number of steps less than or equal to a polynomial function. Accessing 10 elements is a reasonable time.
Developing Algorithms: 50%
🔹 Correction: The flowchart sets available to true whenever weekday is true and miles is less than 20, and sets false otherwise.
Fault Tolerance: 50%
🔹 Correction: It is possible to have redundant routing in both configurations. Possible routes include Q-P-V, Q-T-V in 1, and Q-S-V and Q-T-T-V in 2.
Topics I need to be spending more time on: 4.B Evaluate and test algorithims and programs, 3.C Develop programs that incorporate abstractions, 1.D Design and evaluate computational solutions for a purpose, 2.B Develop and Implement Algorithms, 1.C Design and Evaluate computational solutions for a purpose, 4.C Evaluate and test alogirhtims and programs
🔹 The above are topics that I got questions icorrect in and spent less than a minute on.

MC Review and Improvements

1. Identifying and Correcting Errors (29%)

Analysis:
- Debugging skills need improvement, particularly in finding and fixing logical errors.
- Debugging is crucial for both multiple-choice and Free Response Questions (FRQs).
What to Work On:
- Practice tracing code by hand and writing down variable values at each step.
- Use debugging tools (Python/JavaScript debuggers) to step through programs line by line.
- Study common logic errors like off-by-one errors, incorrect variable updates, and infinite loops.

2. Algorithmic Efficiency (50%)

Analysis:
- Difficulty evaluating algorithm efficiency and runtime complexity.
- Understanding Big-O notation in an informal way is key.
What to Work On:
- Compare algorithms with O(n), O(log n), O(n²), O(2ⁿ) complexity.
- Recognize when an algorithm is inefficient and how it could be optimized.

3. Developing Algorithms (50%)

Analysis:
- Difficulty designing correct algorithms from descriptions.
What to Work On:
- Study flowcharts and pseudocode to interpret algorithms better.
- Practice writing step-by-step algorithms before coding.
Practice:
- Use AP Classroom’s practice questions on algorithm development.
- Solve problems like finding the largest number in a list, checking palindromes, etc.

4. Fault Tolerance (50%)

Analysis:
- Weak understanding of network redundancy and reliability.
What to Work On:
- Study real-world examples of fault tolerance in networking.
- Review network topology diagrams and analyze redundancy effects.
Practice:
- Solve problems identifying alternative network routes.
- Answer AP-style questions on system reliability and fault tolerance.

5. Crowdsourcing (50%)

Analysis:
- Misunderstanding of what qualifies as crowdsourcing.
What to Work On:
- Study real-world crowdsourcing examples like Wikipedia, Waze, and Kickstarter.
Practice:
- Solve AP-style questions where you determine whether a scenario involves crowdsourcing.

Study Plan

1. Prioritize Weak Areas First

Start with debugging practice, since error identification is your biggest challenge.
Move on to algorithmic efficiency and development, as they are core AP topics.

2. Use AP-Style Practice Questions

AP Classroom & College Board Questions
Practice FRQs that require writing algorithms.

3. Active Learning

Try coding exercises related to your weak topics.
Use flashcards for conceptual topics like fault tolerance & crowdsourcing.

4. Timed Practice Tests

Simulate the AP CSP multiple-choice section under timed conditions.
Focus on identifying errors quickly and eliminating incorrect answer choices efficiently.

Gaheera Babbar Tri 2 Final Redo

Redo and Corrections of Tri 2 CPT requirements and MCQ reflection

Gaheera Babbar Tri 2 Final Redo

PPR

Overview

Guideline 1: The Program Uses a List

Guideline 2: List being used in the Program

Guideline 3: Having a Function

Guideline 4: Calling a Function

CPT Requirements

Instructions for Input

Use of a Collection Type

Contributing Procedure

Algorithm with Sequencing, Selection, and Iteration

Calling the Student-Developed Procedure

Output Mechanism

MC Review and Improvements

1. Identifying and Correcting Errors (29%)

2. Algorithmic Efficiency (50%)

3. Developing Algorithms (50%)

4. Fault Tolerance (50%)

5. Crowdsourcing (50%)

Study Plan

1. Prioritize Weak Areas First

2. Use AP-Style Practice Questions

3. Active Learning

4. Timed Practice Tests