Skip to content

Instantly share code, notes, and snippets.

JavaScript Problem Sets for Learning Problem Solving and Software Development

Welcome to your JavaScript problem sets! These exercises are designed to help you practice real-world coding skills that you'll use as a software developer. Each problem focuses on a specific skill, like validating user input or handling API data, and is solvable in about 20 minutes. You'll get a clear explanation, starter code, and test cases to check your work. Let's dive in and start building!

Problem Set 1: User Input Validation

Why This Matters

When users fill out forms on a website (like signing up for an account), their input can be messy—extra spaces, weird characters, or even malicious code like <script> tags. As a developer, you need to clean and validate this input to keep your app safe and functional.

Your Task

Write a function sanitizeUserInput that cleans up a user input string for a registration form. Your function should:

🚀 Application Development Prompt for AI Chat

You are a software planning and architecture expert tasked with helping a user transform their application idea into a fully planned software product with clear, actionable deliverables, including visual diagrams. Your goal is to guide the user from concept to implementation-ready tasks through a concise, focused, and high-quality conversation. Ask targeted questions to clarify:

  • App type (web, mobile, desktop, or other)
  • App concept (general idea and purpose)
  • Target personas (primary user types)
  • Tech stack (with sane defaults, customized if needed)
  • Core features (prioritized for MVP)

🚀 Application Development Prompt for AI Chat

You are a software planning and architecture expert tasked with helping a user transform their application idea into a fully planned software product with clear, actionable deliverables. Your goal is to guide the user from concept to implementation-ready tasks through a concise, focused, and high-quality conversation. Ask targeted questions to clarify:

  • App type (web, mobile, desktop, or other)
  • App concept (general idea and purpose)
  • Target personas (primary user types)
  • Tech stack (with sane defaults, customized if needed)
  • Core features (prioritized for MVP)

🚀 Application Development Prompt for AI Chat

You're an AI product development assistant. The user has an idea for an application and needs help turning it into a full software product, starting with planning and ending with a full breakdown of implementation tasks. Use this prompt to initiate a high-quality, fast-paced conversation that helps the user move from concept to concrete deliverables. Ask questions to identify:

  • App type (web/mobile/desktop)
  • App concept / general idea
  • Target personas
  • Tech stack (with sane defaults)
  • Core features

Sprint 3: Machine Learning Model Guide for Data Scientists

Overview

This guide covers the third ticket of the BandersnatchStarter project, titled "Machine Learning Model," as outlined in BandersnatchStarter/tickets/thirdTicket.md. The objective of Sprint 3 is to explore machine learning models in a Jupyter Notebook, develop a Machine class in app/machine.py using Scikit-learn to predict monster attributes (e.g., Rarity) from data generated in Sprint 1, serialize the model with joblib, and integrate it into the Flask web application. This guide is designed for someone with a beginner data science background, familiar with Python, pandas, and Jupyter Notebooks, but new to Flask and Git. You’ll learn to use Scikit-learn (like in your course), serialize models (like saving notebook outputs), and integrate predictions with Flask (like sharing results online), while managing code with Git (like notebook checkpoints

Sprint 2: Dynamic Visualizations Guide for Data Scientists

Overview

This guide covers the second ticket of the BandersnatchStarter project, titled "Dynamic Visualizations," as outlined in BandersnatchStarter/tickets/secondTicket.md. The objective of Sprint 2 is to create interactive visualizations of the monster data (generated in Sprint 1 using MonsterLab) by exploring visualizations in a Jupyter Notebook, implementing a chart() function in app/graph.py using Altair, and integrating the chart into the Flask web application. This guide is designed for someone with a beginner data science background, familiar with Python, pandas, and Jupyter Notebooks, but new to Flask and Git. You’ll learn to use Altair (like matplotlib or seaborn but for web charts), integrate visualizations with Flask (like sharing notebook plots online), and manage code with Git (like notebook checkpoints). The guide relates tasks to your

Sprint 1: Database Operations Guide for Data Scientists

Overview

This guide covers the first ticket of the BandersnatchStarter project, titled "Database Operations," as outlined in BandersnatchStarter/tickets/firstTicket.md. The objective of Sprint 1 is to develop a database interface class in app/data.py that connects to a MongoDB database, generates at least 1,000 monster records using the Monster class from the MonsterLab library, and provides methods to seed, reset, count, and represent the data as a pandas DataFrame or HTML table. This guide is designed for someone with a beginner data science background, familiar with Python, pandas, and Jupyter Notebooks, but new to Flask and Git. You’ll learn to work with MongoDB (like a dynamic CSV file), use MonsterLab to generate data (like synthetic data in a notebook), and manage code with Git (like notebook checkpoints). The guide relates tasks to your noteboo

BandersnatchStarter Project Overview Guide

Introduction

Welcome to the BandersnatchStarter project, hosted at GitHub - BloomTech-Labs/BandersnatchStarter. This project is a fantastic opportunity for someone with a beginner data science background (using pandas and Jupyter Notebooks) to expand into web development with Flask and version control with Git. The project involves working with "monster data" to build a web application that includes a database, visualizations, and a machine learning model. It’s structured into three sprints, each building on your data science skills while introducing new tools. This guide is designed to help you navigate the project, understand Flask and Git, and relate them to your pandas and Jupyter experience.

As a data scientist, you’re used to analyzing data in Jupyter Notebooks with pandas. Think of this project as taking your notebook analyses (e.g., loading data, creating plots, building models) and turning them

Sprint 3: Machine Learning Model Guide

Overview

This guide covers the third ticket of the BandersnatchStarter project, focused on building and integrating a machine learning model using Scikit-learn, as outlined in BandersnatchStarter/tickets/thirdTicket.md. The objective of Sprint 3 is to create a machine learning model that analyzes monster data from MongoDB (set up in Sprint 1) and integrates it into the Flask web application for user interaction, such as predicting monster attributes. This guide is tailored for a junior JavaScript/TypeScript developer familiar with web development and possibly TensorFlow.js, but new to Python and Scikit-learn. By relating Python and Scikit-learn to JavaScript concepts, this guide will help you build a machine learning model while learning new tools.

Ticket Objectives

The third ticket focuses on:

  1. Preparing Monster Data: Query and preprocess monster data from MongoDB f

Sprint 2: Dynamic Visualizations Guide

Overview

This guide covers the second ticket of the BandersnatchStarter project, focused on creating interactive visualizations using the Altair library, as outlined in BandersnatchStarter/tickets/secondTicket.md. The objective of Sprint 2 is to query the monster data stored in MongoDB (from Sprint 1) and create dynamic visualizations (e.g., bar charts, scatter plots) to display in a Flask-based web application. This guide is tailored for a junior JavaScript/TypeScript developer familiar with web development and visualization libraries like Chart.js or D3.js but new to Python and Altair. By relating Python and Altair to JavaScript concepts, this guide will help you build visualizations while learning new tools.

Ticket Objectives

The second ticket focuses on:

  1. Querying Monster Data: Retrieve monster data from MongoDB to use for visualizations.
  2. **Creating Visualiza