Slides: How LLMs work for Web Devs: GPT in 600 lines of Vanilla JS - Ishan Anand

Source Video

How LLMs work for Web Devs: GPT in 600 lines of Vanilla JS - Ishan Anand

Relationship To World's Fair 2026

These slides are extracted from a public AI Engineer YouTube video connected to World's Fair 2026. Speaker-matched clips are supporting context unless later confirmed as exact session recordings; official livestream recordings are day-level/event-level source material.

Related Scheduled Sessions

Extracted Slides

slide-001.jpg

OCR text:

aWS

ee)

@®Graphite W Windsurf MongobB

Mdaily £3 augment code WorkOS

slide-002.jpg

OCR text:

“er e 1. Vist anteacishests.are-al-you-naed.i in Chrome

Worldl's Fair ere eet sei-2008 room

4. Download GPT2 model in the pinned message

HOW LLMS WORK FOR

WEB DEVS

GPT in 600 lines of Vanilla JavaScript

Ishan Anand

Spreadsheets-are-all-you-need.ai

f aws

“ 7

! |

slide-003.jpg

OCR text:

Yaseen coisa)

This basic recipe, and the building blocks used in it, have not fundamentally changed since the

Transformer was introduced by Goog!e Brain tn 2017, and slightly tweaked to today's left-to-right

language made!s by OpenAl in GPT-1 and GPT-2.

For example, the neural network architecture of Meta‘s Llama 2 model series only adopts a few

changes that differentiate it from the original Transformer in 2017, or the Transformer as used in

GPT-2 or GPT-3. These are the following:

4)

RUC aes MCLs eleliCte

slide-004.jpg

OCR text:

+ = Thread ao

fo) .

5 Rey 6 ° on

3 igsaad ete

a “I don't even see the R's. All! soe 15302, ‘618, 19777. 198, 3504, 1134,

‘ , 19772. 198, 1018.30, 198, 138322. 198, 1100, 302. 1658, 19772, 256-44,

1100, 3504, 1134, 19772, 13007

[eo] pi

< 7 s strawberry -

ai f Strawberry JY

atrenbderry,

a — Strenaber: .

. “strawbel

oe ; "Stramberry” BY

ma '

at . o

a

: % NDUR AW Gerla P0e4d WPM vss

[e} A

eR mal ate fs oS rere no ate a ea ea re

eres PU eo FE ee Xa)

Perec CU aie oc ORL eked

ia ‘

i a Mi ft emo

slide-005.jpg

OCR text:

Laurning Troasberoble Views! Models From Notaral Language Seperinion Contrastive Language-Image Pretraining (CLIP)

he att” ing a ham hen iy Gane Rem Cobra Set tere

Crebtcay ‘(unas ste Pana teu’ ev There temas Lreagee suuarer

smerwt il in 8 nga id

wee ” acumen EE em oe

a Soot rete ete cae rope tose o

x Ss SSS Ss J aotrhanl ape mapt mercies Mid'maed XA

2 SS SS

= seer eee DLT in eaeranae

< LSrcar emer yp alechay chrapelienr ey

& SSI

—_ Gped ey thc veunetea cin 1)) Conarastre pre-purwg ‘UP Create autanel Cameo: Pen thet wes

- Resim.

: STS

% tet

2 Senne arr pera. wa a 2

fio eed ates raed ted en wD ole te | t=

ean eeoes =< > ——

5 encore

So meatertes emt owen Reply. .

a oe he eg ee [us * =

2 wooo

= Se eR ee

= Ty wots sat ws a en 1 Une ter pore chet prvecton tite ,

Sake teereepnere oak ote ss eae Om safe] [s

2 mx rs | Me

ry ee ae i

5 See | rem ee Be

- lS os eos 3

Ree ee

es hearer canted pe peed mee Sp © * .

ee Ge pee eR A ke et

1 batons yal Matibeaiing Push

Aeanuny wreve wach von ames ana eg] Fagare | Seemmmary of cut approach, Wile visndard image moet jeuatly timn an wnage featnoe extractor ad a haat cLansitier bo predict

Se | scene Label. CLIP penntly anne an wenage coooder and 1 tex encoter to predoc the carrect peunmge of 4 batch of (euage. tent) tateang

TUE TA] enamples Attest uae the learaed lent encoder symtheuacs 4 sero-shot lnarat <lassaiier by embedding the anaes of descreptions of the

eenn cen tet ecin flanged dataset’s clanes.

See:

a aT

slide-006.jpg

OCR text:

SoYgaop ce

SOURNL I Tn a re eee eee cree So

ei

, v

. 8

' 6

eo . s

° @

°

‘¢ ATTENTION .

fl aWws

oe ~~ |

slide-007.jpg

OCR text:

Multi-head Attention

j

Multilayer Perceptron

fl a Microsoft ary?

slide-008.jpg

OCR text:

Similar Architecture, Different Training

[aie] GPT Assistant training pipeline

iW) + © °

° o.. oO eo. 0 (> eran +

https:/www. youtube.com/watch?v=bZQun8Y4l2A

| -] ees Oly

slide-009.jpg

OCR text:

Sy 2 ar EES =: See ERE OEP Sexmtmceee Me RAE GL ne ‘So

a :

a= ae chitecture, Different Training :

®

a

"Te GPT Assistant training pipeline a

: Crone tiate] Supervsed Finetuning Leer RY ett fea eae rant e

a a ee s bet gen a ee J *:

Les a mt : : we

. e

Se

cs) ease dey a eee co eT @

| ; © ©. © 0. ©) @O27°0 ~

Woes te ae ae Ok ChatGPT =

| a Microsoft ary?

slide-010.jpg

OCR text:

Similar Architecture, Different Training

| GPT eer training pipeline

ry) ) ° s)

i - - eee)

| ; a Microsoft ary?

slide-011.jpg

OCR text:

Spread the word on spreadsheets-are-all-you-need

Visit Spreadsheets-are-all-you-need.ai sc peceenates one

3 « Mailing list & YouTube

SPREADSHEETS ARE ALL

* Members/Patrons YOU NEED.AI

* Discount on full class, office hours, ae

etc.

Available for Al consulting

AS SEEN ON

* Training, Strategy & Implementation Drie econ - ~enotormmertean

a a Microsoft = expat)

Slide-Derived Subjects To Review

Subject extraction uses video title, related session titles/descriptions, transcript context, and OCR text when available. OCR is best-effort and should be reviewed against the embedded slide images.