Skip to content

Commit f735d37

Browse files
PyMite6941claude
andcommitted
Add Day 22-24, fix filter system, and fix broken links
- Day22: scaffold bash script — added React branch, fixed Rust (cargo new handles dir+git), fixed go mod init, added Next Day link - Day23: completed page from raw code — gq quick-commit bash alias - Day24: new page — React language learning flashcard app (link TBD) - 30DaysOfAIProgrammingPrompts.html: added Day 23 and Day 24 cards - filter-mechanics.js: fixed NodeList.map() bug, renamed to filterProjects() - projects.html: wired up filter (script tag, id, data-tags on all cards), fixed broken link to 30DaysOfAIProgrammingPrompts.html Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
1 parent bf692fe commit f735d37

6 files changed

Lines changed: 382 additions & 18 deletions

File tree

assets/js/filter-mechanics.js

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
1-
function filterMechanics() {
1+
function filterProjects() {
22
const active = Array.from(
3-
document
4-
.querySelectorAll('#filter-panel .checkbox:checked')
5-
.map((cb) => cb.dataset.filter),
6-
);
3+
document.querySelectorAll('#filter-panel .checkbox:checked'),
4+
).map((cb) => cb.dataset.filter);
75
document.querySelectorAll('.card-container[data-tags]').forEach((card) => {
86
if (active.length === 0) {
97
card.style.display = '';
Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
<!doctype html>
2+
<html
3+
lang="en"
4+
data-depth="2">
5+
<head>
6+
<meta charset="utf-8" />
7+
<meta
8+
name="viewport"
9+
content="width=device-width, initial-scale=1" />
10+
<meta
11+
name="description"
12+
content="Day 22 of the 30 Days of AI-Generated Programming Prompts — a Bash project setup tool that scaffolds new projects." />
13+
<link
14+
rel="stylesheet"
15+
type="text/css"
16+
href="../../index.css" />
17+
18+
<title>Day 22 | 30 Days of AI Prompts | Matt G</title>
19+
<script
20+
src="../../assets/js/site-style.js"
21+
defer></script>
22+
</head>
23+
<body>
24+
<div id="site-nav"></div>
25+
<header class="hero-section">
26+
<h1>Day 22</h1>
27+
<h3>A Bash Project Setup Tool</h3>
28+
</header>
29+
<main>
30+
<h2 style="text-align: center; font-size: 30px"
31+
>Unfortunately, you can't run this in the browser here</h2
32+
>
33+
<p
34+
>This is a shell script and must be run locally on a Unix-based system —
35+
it cannot run in the browser.</p
36+
>
37+
<p
38+
>Run <code>chmod +x setup.sh && ./setup.sh</code> in your terminal to
39+
use it.</p
40+
>
41+
<br />
42+
<h2 style="text-align: center">Description</h2>
43+
<br />
44+
<article
45+
>A Bash script that scaffolds a new project directory. It prompts for a
46+
project name and language (Python, Go, React, or Rust), then creates the
47+
appropriate folder structure, starter files, a <code>.gitignore</code>,
48+
and initializes a git repository.</article
49+
>
50+
<br />
51+
<h3 style="text-align: center; font-size: 30px">View the source code</h3>
52+
<br />
53+
<div class="code-segment">
54+
<pre style="margin: 0; overflow-x: auto"><code>#!/bin/bash
55+
56+
echo "Setup Project Directories Program"
57+
echo
58+
echo "What is the name of your project?"
59+
read -p "&gt; " name
60+
echo "What is the project language?"
61+
read -p "&gt; " language
62+
63+
if [ "$language" = "python" ]; then
64+
mkdir "$name"
65+
cd "$name" || exit
66+
git init
67+
cat &gt; main.py &lt;&lt; 'EOF'
68+
print('Hello, World!')
69+
EOF
70+
python main.py
71+
elif [ "$language" = "go" ]; then
72+
mkdir "$name"
73+
cd "$name" || exit
74+
git init
75+
go mod init "$name"
76+
touch main.go
77+
code main.go
78+
elif [ "$language" = "react" ]; then
79+
npx create-react-app "$name"
80+
cd "$name" || exit
81+
code .
82+
elif [ "$language" = "rust" ]; then
83+
cargo new "$name"
84+
cd "$name/src" || exit
85+
code main.rs
86+
else
87+
echo "Language not supported"
88+
fi</code></pre>
89+
</div>
90+
<br />
91+
<a
92+
class="text-link"
93+
href="Day21.html"
94+
>Previous Day</a
95+
>
96+
&nbsp;|&nbsp;
97+
<a
98+
class="text-link"
99+
href="Day23.html"
100+
>Next Day</a
101+
>
102+
<br />
103+
</main>
104+
<div id="site-footer"></div>
105+
</body>
106+
</html>
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<!doctype html>
2+
<html
3+
lang="en"
4+
data-depth="2">
5+
<head>
6+
<meta charset="utf-8" />
7+
<meta
8+
name="viewport"
9+
content="width=device-width, initial-scale=1" />
10+
<meta
11+
name="description"
12+
content="Day 23 of the 30 Days of AI-Generated Programming Prompts — a Bash quick-commit alias called gq." />
13+
<link
14+
rel="stylesheet"
15+
type="text/css"
16+
href="../../index.css" />
17+
18+
<title>Day 23 | 30 Days of AI Prompts | Matt G</title>
19+
<script
20+
src="../../assets/js/site-style.js"
21+
defer></script>
22+
</head>
23+
<body>
24+
<div id="site-nav"></div>
25+
<header class="hero-section">
26+
<h1>Day 23</h1>
27+
<h3>A Bash Quick-Commit Alias</h3>
28+
</header>
29+
<main>
30+
<h2 style="text-align: center; font-size: 30px"
31+
>Unfortunately, you can't run this in the browser here</h2
32+
>
33+
<p
34+
>This is a shell script and must be run locally on a Unix-based system —
35+
it cannot run in the browser.</p
36+
>
37+
<p
38+
>Save it as <code>gq</code> somewhere on your <code>$PATH</code>, run
39+
<code>chmod +x gq</code>, then use it as
40+
<code>gq 'your commit message'</code>.</p
41+
>
42+
<br />
43+
<h2 style="text-align: center">Description</h2>
44+
<br />
45+
<article
46+
>A Bash script that wraps the three most common git steps — stage all,
47+
commit, and confirm — into a single command. Pass the commit message as
48+
the first argument and <code>gq</code> handles the rest. If no message is
49+
provided it prints usage and exits cleanly.</article
50+
>
51+
<br />
52+
<h3 style="text-align: center; font-size: 30px">View the source code</h3>
53+
<br />
54+
<div class="code-segment">
55+
<pre style="margin: 0; overflow-x: auto"><code>#!/bin/bash
56+
57+
message=$1
58+
59+
if [ -z "$message" ]; then
60+
echo "Usage: gq 'commit message here'"
61+
exit 1
62+
else
63+
git add .
64+
git commit -m "$message"
65+
echo "Committing: $message"
66+
fi</code></pre>
67+
</div>
68+
<br />
69+
<a
70+
class="text-link"
71+
href="Day22.html"
72+
>Previous Day</a
73+
>
74+
&nbsp;|&nbsp;
75+
<a
76+
class="text-link"
77+
href="Day24.html"
78+
>Next Day</a
79+
>
80+
<br />
81+
</main>
82+
<div id="site-footer"></div>
83+
</body>
84+
</html>
Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
<!doctype html>
2+
<html
3+
lang="en"
4+
data-depth="2">
5+
<head>
6+
<meta charset="utf-8" />
7+
<meta
8+
name="viewport"
9+
content="width=device-width, initial-scale=1" />
10+
<meta
11+
name="description"
12+
content="Day 24 of the 30 Days of AI-Generated Programming Prompts — a React language learning app with flashcard-style vocabulary drills." />
13+
<link
14+
rel="stylesheet"
15+
type="text/css"
16+
href="../../index.css" />
17+
18+
<title>Day 24 | 30 Days of AI Prompts | Matt G</title>
19+
<script
20+
src="../../assets/js/site-style.js"
21+
defer></script>
22+
</head>
23+
<body>
24+
<div id="site-nav"></div>
25+
<header class="hero-section">
26+
<h1>Day 24</h1>
27+
<h3>A React Language Learning App</h3>
28+
</header>
29+
<main>
30+
<div id="top"></div>
31+
<h2 style="text-align: center; font-size: 30px">Try it!</h2>
32+
<p>The app is linked below — runs fully in the browser.</p>
33+
<br />
34+
<a
35+
class="text-link"
36+
href=""
37+
>Open in full page</a
38+
>
39+
<br />
40+
<br />
41+
<a
42+
class="text-link"
43+
href="https://github.com/PyMite6941"
44+
>Visit my GitHub</a
45+
>
46+
<br />
47+
<h2 style="text-align: center">Description</h2>
48+
<br />
49+
<article
50+
>A React flashcard app for learning vocabulary in a foreign language. Cards
51+
show a word or phrase in the target language and flip to reveal the
52+
translation. You can mark cards as known or unknown to track your progress,
53+
and the deck reshuffles so you keep drilling the ones you missed. Built
54+
with React and Vite, deployed on Vercel.</article
55+
>
56+
<br />
57+
<a
58+
class="text-link"
59+
href="#top"
60+
>Back to top</a
61+
>
62+
<br />
63+
<br />
64+
<a
65+
class="text-link"
66+
href="Day23.html"
67+
>Previous Day</a
68+
>
69+
<br />
70+
</main>
71+
<div id="site-footer"></div>
72+
</body>
73+
</html>

0 commit comments

Comments
 (0)