Did Claude 3.7 Sonnet win it?
Key Takeaways
Tests Claude 3.7 Sonnet's coding capabilities with HTML traffic light simulation prompts
Original Description
I tested the latest Claude 3.7 sonnet with games and simulations to test how good it can code!
What do you think of the result?! Let me know!
Prompts:
Create a single HTML file that simulates a traffic light system. The traffic light should display three states—red, yellow, and green—each with distinct animations (e.g., glowing effect for red, pulsing for yellow, steady shine for green). Show all three lights side by side, styled with a dark background. Use CSS for styling and animations, and JavaScript to include a button or function to cycle through the states, demonstrating the animations for each.
Create a single HTML file containing CSS and JavaScript to generate an animated weather card. The card should visually represent the following weather conditions with distinct animations: Wind: (e.g., moving clouds, swaying trees, or wind lines) Rain: (e.g., falling raindrops, puddles forming) Sun: (e.g., shining rays, bright background) Snow: (e.g., falling snowflakes, snow accumulating) Show all the weather card side by side The card should have a dark background. Provide all the HTML, CSS, and JavaScript code within this single file. The JavaScript should include a way to switch between the different weather conditions (e.g., a function or a set of buttons) to demonstrate the animations for each.
Prompt Credit - https://x.com/AGI_FromWalmart/status/1894144392145113508
Develop a single HTML file that displays an analog clock showing time. Help me manually turn the ticks by dragging them with mouse interactively and play with time. Make sure to add a dark model and a light mode
❤️ If you want to support the channel ❤️
Support here:
Patreon - https://www.patreon.com/1littlecoder/
Ko-Fi - https://ko-fi.com/1littlecoder
🧭 Follow me on 🧭
Twitter - https://twitter.com/1littlecoder
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from 1littlecoder · 1littlecoder · 0 of 60
← Previous
Next →
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
How to create your Free Data Science Blog on Github with Fastpages from Fastai
1littlecoder
Making Interactive Matplotlib Plots for Data Science Visualizations on Jupyter (Python)
1littlecoder
Create your first Data Science Web App using R Shiny
1littlecoder
How to create a Reproducible Example in R using reprex
1littlecoder
No Code Visualization using esquisse with Tableau-like Drag and Drop GUI in R
1littlecoder
Scrape HTML Table using rvest and Process them for insights using tidyverse in R
1littlecoder
Google Teachable Machine Learning Build No Code AI solution
1littlecoder
Create meaningful fake tidy datasets in R using fakir [#rstats Package]
1littlecoder
How to enable using R Programming with Visual Studio VS Code
1littlecoder
Python, Community, Books - with Abhiram R - Bangpypers Co-organizers | 1littlecoder podcast
1littlecoder
Growing a Tech Community across India - Anubha Maneshwar, Founder Girlscript | 1littlecoder Podcast
1littlecoder
Intro to Google Colab - How to use Colab
1littlecoder
Intro to Plotly Express - Complex Interactive Charts with One-Line of Python Code
1littlecoder
Indic NLP Python Toolkit Open Source Development - iNLTK Creator Gaurav Arora | 1littlecoder Podcast
1littlecoder
Do you want a career in Data Science - Tamil Webinar
1littlecoder
Android Smartphone Analysis in R [Live Coding Screencast]
1littlecoder
Programmatically create Images, Memes, Watermarks using Python with imgmaker
1littlecoder
Kaggle Walkthrough to get you started with Data Science - Webinar
1littlecoder
Community, Corporate Job, Coding - Gnana Lakshmi T C aka Gyan, WomenWhoCode Leadership Fellow
1littlecoder
Easy ggplot2 Theme Customization with {ggeasy} | Data Visualization in R
1littlecoder
Excel to R - Pivot + Bar Chart in Excel & R using tidyverse [Live Coding]
1littlecoder
Excel to R #2 - VLOOKUP in Excel to LEFT_JOIN, MERGE in R
1littlecoder
5 websites to get Free Real-World Datasets for Data Science/ML Projects
1littlecoder
Excel to R #3 - APPROXIMATE VLOOKUP in Excel to FUZZY LEFT_JOIN in R
1littlecoder
Correlation-alternative PPS (Predictive Power Score) Python Package Demo
1littlecoder
Automated Website Screenshots in R using {webshot}
1littlecoder
Installing Custom RStudio Theme (Synthwave85)
1littlecoder
Analyse Google Trends Search Data in R using {gtrendsR}
1littlecoder
3 Tips to ask question on Stack Overflow the right way to get answers
1littlecoder
Learn Data Science with R - Mini Projects - Web Scraping Zomato
1littlecoder
Easily make Dumbbell Chart using {ggcharts} | Data Visualization in R
1littlecoder
GET Hackernews Front Page Results using REST API in R
1littlecoder
Quickly deploy ML WebApps from Google Colab using ngrok
1littlecoder
Use Jupyter Notebooks within VSCode (Visual Studio Code) in 2020
1littlecoder
Plotly Interactive Plots as Pandas Plotting Backend df.plot()
1littlecoder
Stack Overflow Developer Survey 2020 Highlights for New Programmers
1littlecoder
Matplotlib Animation Charts in Python using Celluloid
1littlecoder
Coding, Postwoman, Passion Project Book - Liyas Thomas Open Source Developer - 1littlecoder podcast
1littlecoder
Aspiring Data Scientist, Tips on How to learn Business Domain Knowledge
1littlecoder
Bokeh Interactive Charts as Pandas Plotting Backend df.plot_bokeh()
1littlecoder
Easy Fast Python Pandas Summary with Sidetable | Pandas Tips & Tricks
1littlecoder
Inception, Content Ideas, Consistency - Srivatsan Srinivasan AIEngineering YouTube Content Creator
1littlecoder
ggplot2 Text Customization with ggtext | Data Visualization in R
1littlecoder
Penguins Dataset Overview - iris alternative | EDA Data Visualization in R
1littlecoder
YouTube Growth Tips, Content Creation - Bhavesh Bhatt, YouTuber (Data Science & Machine Learning) #7
1littlecoder
Matplotlib Animated Bar Chart Race in Python | Data Visualization
1littlecoder
Simple Python GUI Development using {guietta}
1littlecoder
#8 Niche, Growth, Monetization - David Langer - YouTuber Dave on Data
1littlecoder
Simple Fast 3-step Python OCR using Deep Learning 40+ Languages
1littlecoder
Github New Feature Profile Summary/Mini-Resume - Profile Views
1littlecoder
Otto ML Assistant, GPT-3 on Philosophers, Nvidia-ARM - 3 ML Tech News
1littlecoder
What is OpenAI GPT-3 - Hype, Examples, Worries
1littlecoder
Julia 1.5, Datamuse API, Live HDR+ Pixel 4a - Machine Learning Tech News
1littlecoder
Self-driving Car Engineer sentenced, arXiv Dataset, AI/ML Startup Idea - Machine Learning Tech News
1littlecoder
GPT-3 Explorer, Ciphey (Automated Decryption), Py-Sudoku - ML Tech News
1littlecoder
How to use Advanced Google Search to extract Email Ids from Linkedin
1littlecoder
Cartoonizer Toon-IT (AI Web App), GPT-3 Advice, Android Earthquake Detection - ML Tech News
1littlecoder
Flow - R Package to visualize code logic, functions as a Flow Diagram
1littlecoder
Build GPT-3-like Language Model on Google Colab with minGPT [PyTorch]
1littlecoder
Create a Pencil Sketch Portrait with Python OpenCV
1littlecoder
More on: LLM Foundations
View skill →Related Reads
📰
📰
📰
📰
Next.js vs Remix vs SvelteKit: Which Framework Should You Learn?
Dev.to · Etrit Neziri
Had my Frontend Developer interview with Capgemini (Application Developer) today, and I wanted to…
Medium · JavaScript
10 Frontend Developer Tools to Boost Productivity in 2026
Medium · Programming
10 Frontend Developer Tools to Boost Productivity in 2026
Medium · JavaScript
🎓
Tutor Explanation
DeepCamp AI