<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="static/chat.css"></link>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>
<script src="static/chatbot.js"></script>
<script src="https://platform.linkedin.com/badges/js/profile.js" async defer type="text/javascript"></script>
<title>Mark Bochner - Projects</title>
<style>
#close-browser {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
}
.white {
color: white;
}
body {
line-height: 1.6;
margin: 0;
padding: 0;
color: #333;
font-family: "Geist Mono Variable", sans-serif;
background-color: #c4e1e7;
}
.page-container {
margin: 0 auto;
padding: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
display: flex;
flex-direction: row;
}
.page-container div {
}
h1 {
text-align: center;
color: #333;
font-size: 2.5em;
margin-bottom: 30px;
}
.section {
margin-bottom: 20px;
padding: 15px;
background-color: #f9f9f9;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
border: 1px solid #e0e0e0;
max-width: 800px;
}
.s{
margin-bottom: 20px;
background-color: #F0F0F0;
cursor: pointer;
transition: background-color 0.3s;
border: 2px solid #000000;
max-width: 588px;
font-weight: bold;
color: #000000;
font-size: 18px;
}
.chatbot-sidebar {
max-width: 400px;
height: 100vh;
position: fixed;
right: 0;
top: 0;
background-color: #0F68B6;
padding: 20px;
box-sizing: border-box;
display: flex;
flex-direction: column;
}
.section:hover {
background-color: #e9e9e9;
}
.section h2 {
margin-top: 0;
color: #2c3e50;
font-size: 1.5em;
}
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.4);
}
.modal-content {
background-color: #c4e1e7;
margin: 5% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
max-width: 900px;
border-radius: 5px;
height: 80%;
overflow-y: auto;
}
.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
cursor: pointer;
}
.close:hover,
.close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
.modal-content h2 {
color: #2c3e50;
border-bottom: 2px solid #2c3e50;
padding-bottom: 10px;
}
.modal-content h3 {
color: #34495e;
}
.modal-content ul {
padding-left: 20px;
}
.modal-content li {
margin-bottom: 10px;
}
.links-container {
align-items: center;
position: relative;
width: 100%;
}
.links-container div {
margin: 8px;
width: auto;
}
.chat-messages {
flex: 1;
overflow-y: auto;
border: 1px solid #ccc;
padding: 1rem;
margin-bottom: 1rem;
color: white;
width: auto;
}
.buttons-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.button{
display: inline-flex;
padding: 10px 20px;
font-size: 16px;
font-weight: bold;
text-align: center;
text-decoration: none;
border-radius: 5px;
transition: all 0.3s ease;
cursor: pointer;
}
.b{
display: inline-flex;
border-radius: 5px;
margin-left: 16px;
transition: all 0.3s ease;
cursor: pointer;
height: 100%
}
</style>
</head>
<body>
<div class="page-container">
<div class="links-container">
<h1>Projects</h1>
<div class="section" onclick="openModal('MovieReadme')">
<h2>Movie Script Analysis</h2>
<div class="buttons-container">
<button class='button' onclick="openModal('BechdelTest');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Initial Data Collection</button>
<button class='button' onclick="openModal('NaiveBayes');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Genre Classification with Naive Bayes</button>
<button class='button' onclick="openModal('PredictiveModeling');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Predictive Modeling</button>
<button class='button' onclick="openModal('DistilBERT');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Building a Classifier with DistilBERT</button>
<button class='button' onclick="openModal('DataCard');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/huggingface-logo.svg">
Data Card
</button>
</div>
</div>
<div class="section" onclick="openModal('WebsiteReadme')">
<h2>View the Code Behind this Website</h2>
<div class="buttons-container">
<button class='button' onclick="openModal('AppPy');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/python-logo.svg">
Server-Side Scripts</button>
<button class='button' onclick="openModal('ThisPage');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/html-logo.svg">
This Page</button>
<button class='button' onclick="openModal('ChatBot');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/js-logo.svg">
Chatbot Script</button>
<button class='button' onclick="openModal('ChatCSS');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/css-3-logo.svg">
Chatbot Style</button>
<button class='button' onclick="openModal('LangchainNB');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Custom Implementation of the LangChain Embeddings Class</button>
<button class='button' onclick="openModal('TDBR');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/python-logo.svg">
TinyDBRetriever - A Custom Retriever for TinyDB and LangChain</button>
<button class='button' onclick="openModal('TDBR_NB');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Building a Local Database for RAG with TinyDB</button>
</div>
</div>
<div class="section" onclick="openModal('QuantStudyReadme')">
<h2>Quantitative Analysis Replication</h2>
<div class="buttons-container">
<button class='button' onclick="openModal('DataPython');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/jupyter-logo.svg">
Data Cleaning and Exploration in Python</button>
<button class='button' onclick="openModal('DataR');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/R-logo.svg">
Modeling in R</button>
</div>
</div>
<div class="section" onclick="openModal('TikTok')">
<h2>TikTok Comment Analysis</h2>
<div class="buttons-container">
<button class='button' onclick="openModal('TikTokData');event.stopPropagation()">
<img style="height:16px;width:16px;margin-right:16px;" src="../static/datalore-logo.svg">
Data Sample</button>
</div>
</div>
<div class="section" onclick="openModal('ConsoleReporter')">
<h2>ConsoleReporter</h2>
<p>A short script that uses generative AI to turn a pycharm console session into an annotated Jupyter notebook. Most of the time, it works every time.</p>
</div>
</div>
<div class="chatbot-container">
<div id="calendly">
<div id="calendly-embed" class="calendly" style="min-width:1px;min-height:1px;display:inline-flex;"></div>
<button id="close-browser" onclick="closeCalendly()">Close</button>
</div>
<div class="chatbot-sidebar">
<div style="display:flex;flex-direction:row;">
<a href="./Resume"><button>Resume</button></a>
<a href="./"><button>Home</button></a>
</div>
<h3 class="white">Mark Botner, Office Manager</h3>
<div class="chat-messages" id="chatMessages"></div>
<div class="chat-input">
<input type="text" id="userInput" placeholder="Type your message...">
<button onclick="sendMessage()">Send</button>
</div>
</div>
</div>
</div>
<div id="BechdelTestModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('BechdelTest')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FMovie-Script-Data-Analysis%2Fblob%2Fmaster%2FBechdel%2520Test.ipynb&style=default&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="DataCardModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('DataCard')">×</span>
<iframe src="https://huggingface.co/datasets/mocboch/movie_scripts/embed/viewer/default/train"
frameborder="2"
width="100%"
height="560px"></iframe>
</div>
</div>
<div id="NaiveBayesModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('NaiveBayes')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FMovie-Script-Data-Analysis%2Fblob%2Fmaster%2FNaive%2520Bayes%2520for%2520Genre%2520Identification.ipynb&style=default&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="DistilBERTModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('DistilBERT')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FMovie-Script-Data-Analysis%2Fblob%2Fmaster%2FBuilding%2520a%2520Classifier%2520with%2520DistilBert.ipynb&style=routeros&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="PredictiveModelingModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('PredictiveModeling')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FMovie-Script-Data-Analysis%2Fblob%2Fmaster%2FData%2520Exploration.ipynb&style=routeros&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="AppPyModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('AppPy')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2Fapp.py&style=intellij-light&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="ChatBotModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('ChatBot')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2Fstatic%2Fchatbot.js&style=intellij-light&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="ThisPageModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('ThisPage')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2Ftemplates%2Fprojects.html&style=intellij-light&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="ChatCSSModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('ChatCSS')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2Fstatic%2Fchat.css&style=intellij-light&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="ConsoleReporterModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('ConsoleReporter')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FConsole-Reporter%2Fblob%2Fmaster%2FConsoleReporter.py&style=intellij-light&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="DataPythonModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('DataPython')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FStudy-Replication%2Fblob%2Fmain%2FQuantitative%2520Study%2520Replication.ipynb&style=intellij-light&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="DataRModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('DataR')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2FStudy-Replication%2Fblob%2Fmain%2FQuantitative%2520Study%2520Replication.rmd&style=intellij-light&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="TikTokDataModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('TikTokData')">×</span>
<iframe style="width:100%;height:100%;overflow:scroll"src="https://datalore.jetbrains.com/report/embed/vuaFxFrLZ4lQPRqnFZ8JlN/SP2PYD4RKXnuuh5wkeWv4a/f3XiYK62JKF1bIb1nyAqF9?height=517" frameborder="0"></iframe>
</div>
</div>
<div id="LangchainPyModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('LangchainPy')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2FGoogleEmbeddings.py&style=default&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="LangchainNBModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('LangchainNB')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2FBuilding%2520a%2520Custom%2520Implementation%2520of%2520the%2520LangChain%2520Embeddings%2520Class.ipynb&style=default&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="TDBRModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('TDBR')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2FTinyDBRetriever.py&style=default&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="TDBR_NBModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('TDBR_NB')">×</span>
<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fmocboch%2Fwebsite%2Fblob%2Fmaster%2FSetting%2520Up%2520a%2520Local%2520Database%2520in%2520TinyDB.ipynb&style=default&type=ipynb&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
</div>
</div>
<div id="WebsiteReadmeModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('WebsiteReadme')">×</span>
<h2>Created a Website Controlled by Natural Language</h2>
<ul>
<li>Created a website controlled by natural language prompts using Flask</li>
<li>Integrated Google Gemini for function calling to control navigation and other UX elements</li>
<li>Built a NoSQL database with MongoDB Atlas including a vector search index with Hugging Face embeddings</li>
<li>Used Langchain for retrieval augmented generation to provide context for certain responses</li>
<li>Integrated Calendly and Sendgrid to establish communication with users</li>
<li>Deployed to Amazon Web Services using Elastic Beanstalk</li>
</ul>
</div>
</div>
<div id="TikTokModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('TikTok')">×</span>
<h2>Collecting and Analyzing a set of TikTok Comments</h2>
<ul>
<li>Scraping a set of millions of TikTok comments from political accounts such as @kamalaharris and @realdonaldtrump</li>
<li>Using polling data from 538 as targets, will analyze comments' sentiments and try to predict changes in polling results</li>
<li>Ongoing project- check back for more soon!</li>
</ul>
</div>
</div>
<div id="MovieReadmeModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('MovieReadme')">×</span>
<h2>Collecting and Analyzing Unstructured Movie Script Data</h2>
<ul>
<li>Integrated data from various sources into a PostgreSQL database using web scraping and APIs</li>
<li>Created visualizations in matplotlib and seaborn</li>
<li>Cleaned and analyzed a large volume of structured and unstructured data, applying a variety of ML and NLP techniques</li>
</ul>
</div>
</div>
<div id="QuantStudyReadmeModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('QuantStudyReadme')">×</span>
<h2>Replicated the Analytical Process of a Published Paper</h2>
<ul>
<li>Applied the same and modified processes to new data</li>
<li>Cleaned and transformed data according to established procedures</li>
</ul>
</div>
</div>
<div id="LangchainReadmeModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('LangchainReadme')">×</span>
<h2>Built a Custom Implementation of the LangChain Embeddings Class</h2>
<ul>
<li>Custom class is very lightweight and will run on a small AWS server</li>
<li>Vector search using only 64-dimensional vectors will power RAG for Mr. Botner</li>
<li>More to come!</li>
</ul>
</div>
</div>
<div id="contact">
<div id="contact-embed" class="contact" style="min-width:320px;height:500px;display:inline-flex;">
<img src="https://genqrcode.com/embedded?style=7&inner_eye_style=3&outer_eye_style=5&logo=de7388f4e7d5c492aebc315844138144&color=%230f68b6FF&background_color=%23c4e1e7FF&inner_eye_color=%230f68b6&outer_eye_color=%23000000&imageformat=svg&language=en&frame_style=0&frame_text=SCAN%20ME&frame_color=%23000000&invert_colors=false&gradient_style=0&gradient_color_start=%230057B8&gradient_color_end=%23FFD700&gradient_start_offset=50&gradient_end_offset=50&stl_type=1&logo_remove_background=false&stl_size=100&stl_qr_height=1.5&stl_base_height=2&stl_qr_magnet_type=3&stl_qr_magnet_count=0&type=0&text=https%3A%2F%2Fqri.lu%2FN9HzcOI&width=500&height=500&bordersize=2" alt="qr code" />
<div class="contact-details">
<div class="github-card" data-github="mocboch" data-width="400" data-height="150" data-theme="default"></div>
<script src="//cdn.jsdelivr.net/github-cards/latest/widget.js"></script>
<br><span>(908) 403-1660</span><br>
<span>markbochner1@gmail.com</span><br>
<script src="https://platform.linkedin.com/badges/js/profile.js" async defer type="text/javascript"></script>
<div class="badge-base LI-profile-badge" data-locale="en_US" data-size="large" data-theme="light" data-type="HORIZONTAL" data-vanity="mark-bochner-618071263" data-version="v1"><a class="badge-base__link LI-simple-link" href="https://www.linkedin.com/in/mark-bochner-618071263?trk=profile-badge">LinkedIn</a></div>
</div>
</div>
<button id="close-browser" onclick="closeContact()">Close</button>
</div>
<script>
function openModal(id) {
document.getElementById(id + 'Modal').style.display = 'block';
}
function closeModal(id) {
document.getElementById(id + 'Modal').style.display = 'none';
}
window.onclick = function(event) {
if (event.target.className === 'modal') {
event.target.style.display = 'none';
}
}
</script>
</body>
</html>