Foundations: Coding with Generative AI — CAIL Workshop #1

CAIL Spotlight Workshop #1

Foundations: Coding with Generative AI

Spring 2026

CUNY AI Lab Developed by Stefano Morello, Zach Muhlbauer, Parisa Setayesh, and Stephen Zweibel
Workshop

Agenda

Part 1 — Concepts & Context 30m
Icebreaker Vibe Coding in Action What is a Large Language Model (LLM)? How Do LLMs Generate Code? Strengths & Limitations
Part 2 — Development Environment 30m
What is VS Code? Setting up an IDE The Command Line Initializing a Git Repository Getting Started with GitHub
Part 3 — Installation & Setup 30m
Installing Gemini CLI Login Step Upcoming Workshop Links & Resources
Part 1

Concepts & Context

Icebreaker · 10 min

Where does coding live in your imagination?

Turn to your neighbor and discuss.

A
Name a technical difficulty from your everyday life, work, or research.
B
How might you address that challenge if coding came easier to you?
Demo

Vibe Coding in Action

Live walkthrough: building something from scratch with an AI coding agent
Observe how a set of prompts via Gemini CLI turns a plain-language idea into working code, step by step, inside VS Code.
Concept

What is a Large Language Model (LLM)?

A probabilistic pattern engine for text.
  • It learns statistical relationships between tokens (not “facts”)
  • It predicts the most likely next token, step by step
  • It generates output by repeating that prediction process
Tokens
→
Vectors
→
Attention
→
Probabilities
→
Output
Concept

How Does an LLM Actually Produce an Answer?

1
Tokenize — break your prompt into tokens
2
Embed — turn tokens into vectors
3
Transform — attention mixes information across tokens
4
Predict + decode — choose the next token; repeat
↓
Your prompt shapes the probability space. The response is a probabilistic approximation of what you like to see. Wording changes can dramatically shift output.
Concept

How Do LLMs Generate Code?

Code is just another language pattern.
  • The model was trained on large amounts of code + documentation
  • It learned patterns in syntax, structure, and common problem solutions
  • When you ask for code, it predicts the most likely next tokens in a programming language
  • It does not run or test the code unless connected to tools
Concept

What’s Good / What’s Bad

✓
What Works
They autocomplete entire functions, not just words

They infer intent from partial instructions

They generalize from patterns they have seen before
✗
Where Things Go Wrong
Silent logical errors

Hallucinated functions or libraries

Outdated APIs

Confident but wrong assumptions
Part 2

Development Environment

Concept

What is VS Code?

A free code editor that works like a smart writing desk for programmers
It highlights your code, catches errors, and connects to tools like Git and AI assistants — all in one window.
Why VS Code?
  • Free, open-source, and runs on Mac, Windows, and Linux
  • Built-in terminal, Git support, and thousands of extensions
  • Where AI coding agents (like Gemini CLI) do their work
Setup

Setting up an Interactive Development Environment

1
Download VS Code from code.visualstudio.com
2
Install and open VS Code on your machine
3
Open the integrated terminal: Terminal → New Terminal in the top menu bar (or Ctrl+`)
4
Confirm it works — you should see a command prompt at the bottom
Concept

What is the Command Line?

A text-based interface for controlling your computer
Instead of clicking buttons and icons, you type commands.
Why use it?
  • More powerful and precise control
  • Essential for development work
  • How AI coding agents interact with your machine
Outside VS Code

Opening a Standalone Terminal

(You won't need this today)

It's the same terminal. VS Code just puts one inside the editor so you don't have to switch windows.
macOS
Terminal
1. Press Cmd + Space
2. Type "Terminal"
3. Press Return
Windows
PowerShell
1. Press the Windows key
2. Type "PowerShell"
3. Press Enter
Tool

Command Line Basics

Navigating

pwd Print your current location
~ / my-project
mkdir my-project Make a new folder
my-project
cd my-project Move into a folder
→
my-project
cd .. Go up one level
← ~/
Tool

Command Line Basics

Working with Files

touch index.html Create a new file
index.html
ls List what's in the folder
index.html
style.css
img/
mv index.html my-project Move a file into a folder
index.html
→
my-project
cd my-project Move into a folder (again)
→
my-project
Concept

What is Git? What is GitHub?

Local
Git
A version control system that runs on your computer.

Tracks every change to your files so you can go back in time, undo mistakes, and work in parallel.
Cloud
GitHub
A website that stores your Git repositories online.

Share code, collaborate with others, and host websites from your browser or terminal.
Tool

Git Basics

Setting Up

git init Initialize a repo
.git
git add . Stage your changes
index.html
style.css
→
staged
git commit -m "first commit" Save a snapshot
a1b2c3d
Tool

Git Basics

Syncing & Inspecting

git status Check what changed
index.html
style.css
git log --oneline View history
a1b2c3d
e4f5g6h
i7j8k9l
git push origin main Push to GitHub
a1b2c3d
→
Setup

Logging into GitHub

1
Install the GitHub CLI — download the installer at cli.github.com or run:brew install gh # macOS winget install GitHub.cli # Windows
2
Start login from your terminal:gh auth login
3
Choose GitHub.com → HTTPS → Login with a web browser
4
Copy the one-time code, press Enter, and approve in the browser window that opens
5
Back in your terminal you'll see: ✓ Logged in as your-username
Setup

Staging, Committing, and Pushing to GitHub

1
Create a README file:touch README.md
2
Stage your files:git add README.md
3
Commit your changes:git commit -m "first commit"
4
Create a GitHub repo:gh repo create my-project --public --source=.
5
Push your code to GitHub:git push -u origin main
6
Visit github.com/your-username/my-project to see it live
Part 3

Installation & Setup

Getting Gemini CLI running on your machine

Setup

Installing Gemini CLI

Windows
PowerShell
1. Install Node.js LTS from nodejs.org
2. Reopen PowerShell
3. Install Gemini CLI: npm install -g @google/gemini-cli
macOS
Terminal
1. Install Homebrew from brew.sh
2. Add Homebrew to PATH: echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' \ >> ~/.zprofile eval "$(/opt/homebrew/bin/brew shellenv)" 3. Install Gemini CLI: brew install gemini-cli
Setup

Login Step

1
Run gemini in your terminal to start authentication
2
Choose "Login with Google" and follow the browser prompt
3
Free tier: 60 requests/min · 1,000 requests/day
?
Having technical issues? Just ask!
Check-in

Troubleshooting

Having trouble installing or logging in?
VS Code, GitHub CLI, Git, Gemini CLI — if anything didn't work, now's the time to fix it together.
  • Raise your hand — we'll come to you
  • Help a neighbor if you're all set
  • No issue too small to ask about
What's Next

Upcoming Workshop

Vibe-Coding Prototypes · Tuesday, March 10 · 4:00–5:30 pm

1
Use AI from the command line to build a small prototype. We'll model prompting, project design, and troubleshooting, then you'll customize a feature of your own.
2
Register for the next workshop
Prerequisite: this workshop, or prior familiarity with the command line and Git/GitHub
3
In the meantime: experiment with Gemini CLI on your own!
Try building a small page, asking it to explain code, or exploring a new idea from your terminal.
Resources

Links & References

CAIL
GC Community
Workshops
Tools & Docs