Merge branch 'main' into image_compression

girliemac · Nov 5, 2022 · e7fcc8c · e7fcc8c
2 parents 47f288b + 5c314e1
commit e7fcc8c
Show file tree

Hide file tree

Showing 15 changed files with 123 additions and 42 deletions.
diff --git a/README.md b/README.md
@@ -9,9 +9,9 @@
 
 I have been posting my tech doodles on [Twitter](https://twitter.com/girlie_mac) and [Microsoft open-source projects](https://github.com/microsoft/) and I am repeatedly asked where to get the original images, especially from people who saw some of my works out of context on some social media, so I decided to put all together on one GitHub repo.
 
-Here are some of the latest giditally created handdrawn doodles, as well as photos of analog ones.
+Here are some of the latest digitally created handdrawn doodles, as well as photos of analog ones.
 
-All my doodles are under Creative Commons license. So please share with attributions. And I definitely don't want you to NFT them without my permission (and I won't permit you because you don't own them. They are open-sourced to be freely available for educational purpose only!)
+All my doodles are under Creative Commons license, so please share with attributions. And I definitely don't want you to NFT them without my permission (and I won't permit you because you don't own them. They are open-sourced to be freely available for educational purpose only!)
 
 Enjoy 🌺
 
@@ -164,7 +164,7 @@ All images (except a few) are originally created by me a decade ago! Read the st
 
 ```
 
-These are something I did while working at Slack. I created the zine (as physical printed books) to be distribute at Slack-sponcered events and conferences, but never get fully approved. Well, the global pandemic forced us to give up all in-person events anyway.
+These are something I did while working at Slack. I created the zine (as physical printed books) to be distribute at Slack-sponsored events and conferences, but never get fully approved. Well, the global pandemic forced us to give up all in-person events anyway.
 
 The content is outdated as of 2022 so view them with cautions.
 

diff --git a/ai/README.md b/ai/README.md
@@ -0,0 +1,26 @@
+![Microsoft](https://upload.wikimedia.org/wikipedia/commons/thumb/9/96/Microsoft_logo_%282012%29.svg/150px-Microsoft_logo_%282012%29.svg.png)
+# Artificial Intelligence for Beginners - A Curriculum
+
+These images are created for another project at Microsoft I was in, [Artificial Intelligence for Beginners](https://github.com/microsoft/AI-For-Beginners)
+curriculum. Please go to the [repo](https://github.com/microsoft/AI-For-Beginners) to see how each image with the context!
+
+
+
+## Course Overview
+![AI Curriculum overview](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ai/ai-overview.png?raw=true)
+
+## Intro AI
+![Intro AI](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ai/ai-intro.png?raw=true)
+
+## Symbolic AI
+![Symbolic AI](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ai/ai-symbolic.png?raw=true)
+
+## Neural Networks
+![Neural Networks](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ai/ai-neuralnetworks.png?raw=true)
+
+## NLP
+![NLP](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ai/ai-nlp.png?raw=true)
+
+## Computer Vision
+![Computer Vision](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ai/ai-computervision.png?raw=true)
+
diff --git a/ai/ai-computervision.png b/ai/ai-computervision.png
diff --git a/ai/ai-intro.png b/ai/ai-intro.png
diff --git a/ai/ai-neuralnetworks.png b/ai/ai-neuralnetworks.png
diff --git a/ai/ai-nlp.png b/ai/ai-nlp.png
diff --git a/ai/ai-overview.png b/ai/ai-overview.png
diff --git a/ai/ai-symbolic.png b/ai/ai-symbolic.png
diff --git a/git-purr/README.md b/git-purr/README.md
@@ -1,7 +1,7 @@
 # Git Purr - Git Explained with Cats!
 
 
-This series is my ealier work and everything is drawn in very analog way, except cherry-pick
+This series is my ealier work and everything is drawn in a very analog way, except cherry-pick
 
 ## git purr (git pull)
 

diff --git a/ml/README.md b/ml/README.md
@@ -1,21 +1,18 @@
-# Machine Learning for Beginners
+![Microsoft](https://upload.wikimedia.org/wikipedia/commons/thumb/9/96/Microsoft_logo_%282012%29.svg/150px-Microsoft_logo_%282012%29.svg.png)
+# Machine Learning for Beginners - A Curriculum
 
 These images are created for another project at Microsoft I was in, [Machine Learning for Beginners](https://github.com/microsoft/ML-For-Beginners)
-curriculum. 
+curriculum. Please go to the [repo](https://github.com/microsoft/ML-For-Beginners) to see how each image with the context!
 
-Please go to the [repo](https://github.com/microsoft/ML-For-Beginners) to see how each image with the context!
-
-<svg xmlns="http://www.w3.org/2000/svg" width="108" height="23" viewBox="72 72 337 74" preserveAspectRatio="xMidYMin slice">
-			<g data-name="MS-symbol">
-				<clipPath>
-					<path transform="matrix(1 0 0 -1 0 216)" d="M0 216h482V0H0z"></path>
-				</clipPath>
-				<g clip-path="url(#a)">
-					<path class="fill-current-color color-text-subtle" d="M394.942 104.59h-10.858v25.003h-7.38V104.59h-5.182v-5.965h5.182v-4.308c0-3.254 1.06-5.92 3.178-7.998 2.12-2.079 4.835-3.118 8.15-3.118.882 0 1.666.045 2.35.135a9.37 9.37 0 011.806.407v6.296c-.24-.14-.663-.31-1.265-.512-.603-.2-1.296-.3-2.078-.3-1.528 0-2.702.476-3.526 1.43-.824.954-1.235 2.365-1.235 4.232v3.736h10.858v-6.959l7.321-2.229v9.188h7.381v5.965h-7.38v14.49c0 1.91.345 3.254 1.038 4.037.693.783 1.782 1.175 3.27 1.175.42 0 .927-.1 1.52-.3a7.178 7.178 0 001.552-.724v6.025c-.463.261-1.23.502-2.305.723a15.742 15.742 0 01-3.178.331c-3.073 0-5.378-.817-6.914-2.455-1.537-1.637-2.305-4.102-2.305-7.396zm-48.407 9.73c0 3.233.733 5.703 2.2 7.411 1.465 1.707 3.564 2.56 6.295 2.56 2.652 0 4.67-.853 6.055-2.56 1.386-1.708 2.08-4.238 2.08-7.592 0-3.334-.719-5.849-2.155-7.547-1.436-1.697-3.45-2.545-6.04-2.545-2.67 0-4.745.888-6.22 2.666-1.477 1.777-2.215 4.313-2.215 7.607m-7.592.24c0-5.12 1.446-9.177 4.338-12.17 2.892-2.993 6.91-4.489 12.05-4.489 4.841 0 8.621 1.441 11.343 4.323 2.721 2.883 4.082 6.774 4.082 11.674 0 5.021-1.447 9.018-4.338 11.99-2.892 2.973-6.829 4.458-11.81 4.458-4.8 0-8.61-1.41-11.432-4.232-2.822-2.82-4.233-6.673-4.233-11.554m-16.417-7.802c0 1.045.331 1.863.994 2.456.662.592 2.128 1.34 4.398 2.243 2.912 1.166 4.956 2.476 6.131 3.932 1.175 1.456 1.762 3.22 1.762 5.287 0 2.912-1.12 5.252-3.359 7.02-2.24 1.767-5.267 2.65-9.083 2.65-1.285 0-2.706-.155-4.263-.467-1.556-.31-2.877-.707-3.96-1.19v-7.169a17.945 17.945 0 004.277 2.198c1.526.543 2.911.814 4.157.814 1.647 0 2.862-.23 3.645-.693.784-.46 1.175-1.235 1.175-2.319 0-1.005-.406-1.853-1.22-2.546-.813-.693-2.355-1.492-4.624-2.395-2.69-1.125-4.599-2.39-5.724-3.796-1.125-1.406-1.687-3.193-1.687-5.362 0-2.792 1.11-5.086 3.33-6.884 2.217-1.797 5.095-2.696 8.63-2.696 1.084 0 2.3.12 3.645.361 1.346.242 2.47.553 3.374.934v6.93c-.964-.644-2.089-1.195-3.374-1.658-1.286-.462-2.56-.693-3.826-.693-1.386 0-2.465.271-3.238.813-.774.543-1.16 1.286-1.16 2.23m-35.066 7.562c0 3.233.733 5.703 2.2 7.411 1.465 1.707 3.564 2.56 6.295 2.56 2.652 0 4.67-.853 6.055-2.56 1.386-1.708 2.08-4.238 2.08-7.592 0-3.334-.719-5.849-2.155-7.547-1.436-1.697-3.449-2.545-6.039-2.545-2.672 0-4.745.888-6.222 2.666-1.476 1.777-2.214 4.313-2.214 7.607m-7.592.24c0-5.12 1.446-9.177 4.338-12.17 2.893-2.993 6.91-4.489 12.051-4.489 4.84 0 8.621 1.441 11.342 4.323 2.721 2.883 4.082 6.774 4.082 11.674 0 5.021-1.446 9.018-4.338 11.99-2.892 2.973-6.828 4.458-11.809 4.458-4.8 0-8.61-1.41-11.433-4.232-2.822-2.82-4.233-6.673-4.233-11.554m-3.136-16.448c.582 0 1.105.041 1.567.121.462.08.853.18 1.175.301v7.38c-.382-.28-.939-.546-1.672-.798-.733-.25-1.622-.376-2.666-.376-1.788 0-3.299.753-4.534 2.26-1.235 1.505-1.853 3.825-1.853 6.958v15.635h-7.29V98.624h7.29v4.88h.12c.663-1.687 1.667-3.007 3.013-3.96 1.346-.954 2.962-1.432 4.85-1.432m-27.956 26.18c1.084 0 2.28-.25 3.585-.754a15.06 15.06 0 003.615-1.988v6.778c-1.165.663-2.485 1.165-3.962 1.506-1.475.342-3.098.512-4.865.512-4.559 0-8.265-1.44-11.116-4.323-2.852-2.88-4.278-6.562-4.278-11.04 0-4.98 1.456-9.083 4.37-12.307 2.91-3.224 7.037-4.835 12.38-4.835 1.366 0 2.746.176 4.143.527 1.395.352 2.504.758 3.328 1.22v6.99c-1.125-.824-2.274-1.462-3.45-1.914a9.966 9.966 0 00-3.599-.678c-2.872 0-5.192.934-6.959 2.802-1.768 1.868-2.652 4.388-2.652 7.562 0 3.132.85 5.573 2.546 7.32 1.697 1.748 4.002 2.621 6.914 2.621m-22.112 5.302h-7.29V98.624h7.29zm-8.044-39.916c0-1.205.437-2.214 1.311-3.028.874-.813 1.913-1.22 3.118-1.22 1.285 0 2.35.417 3.193 1.25.844.834 1.266 1.833 1.266 2.998 0 1.185-.432 2.18-1.296 2.982-.864.804-1.918 1.205-3.163 1.205-1.246 0-2.295-.406-3.148-1.219-.854-.815-1.28-1.803-1.28-2.968m-6.274-3.284v43.2h-7.5v-33.86h-.12l-13.408 33.86h-4.97l-13.738-33.86h-.09v33.86h-6.929v-43.2h10.755l12.412 32.024h.18l13.105-32.024z"></path>
-					<path d="M106.214 106.214H71.996V71.996h34.218z" fill="#f25022"></path>
-					<path d="M143.993 106.214h-34.218V71.996h34.218z" fill="#7fba00"></path>
-					<path d="M106.214 143.993H71.996v-34.218h34.218z" fill="#00a4ef"></path>
-					<path d="M143.993 143.993h-34.218v-34.218h34.218z" fill="#ffb900"></path>
-				</g>
-			</g>
-		</svg>
+## Machine Learning History
+![ML History](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ml/png/ml-history.png?raw=true)
+## Machine Learning Regression
+![ML regression](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ml/png/ml-regression.png?raw=true)
+## Machine Learning Reinforcement
+![ML reinforcement](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ml/png/ml-reinforcement.png?raw=true)
+## Machine Learning Time Series
+![ML time series](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ml/png/ml-timeseries.png?raw=true)
+## Machine Learning in Real World
+![ML real world](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ml/png/ml-realworld.png?raw=true)
+## Machine Learning Fairness
+![ML fairness](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/ml/png/ml-fairness.png?raw=true)
diff --git a/sketchnotes/README.md b/sketchnotes/README.md
@@ -54,4 +54,3 @@ Sketchnotes from Presenting Data & Information course by Edward Tufte about fund
 
 ![sketchnote](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/sketchnotes/data-and-info-02.webp?raw=true)
 
-
diff --git a/slack/README.md b/slack/README.md
@@ -0,0 +1,30 @@
+# Slack API Zine
+
+I initially created the "zine" when I was working at Slack Technologies (pre-Salesforce time), to be printed out as physical books to distribute at events and conference, but it never happened. 
+Then the pandemic hit so there was no in-person conferences anyway. 
+It is such a waste not to published this, so I just keep them as an open-source / Creative Commons content.
+
+> **Warning**
+> The content was created in 2019 and maybe outdated.
+
+## Covers
+| cover | back cover |
+| --- |  --- |
+| ![cover](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_Cover.png?raw=true) | ![back cover](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/Zine_Back_Cover.png?raw=true) |
+
+## Content
+
+| Page Left | Page Right |
+| --- |  --- |
+| 1 | 2 |
+| ![page 1](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P01.png?raw=true) | ![page 2](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P02.png?raw=true) |
+| 3 | 4 |
+| ![page 1](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P03.png?raw=true) | ![page 2](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P04.png?raw=true) |
+| 5 | 6 |
+| ![page 1](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P05.png?raw=true) | ![page 2](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P06.png?raw=true) |
+| 7 | 8 |
+| ![page 1](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P07.png?raw=true) | ![page 2](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P08.png?raw=true) |
+| 9 | 10 |
+| ![page 1](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P09.png?raw=true) | ![page 2](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P10.png?raw=true) |
+| 11 | 12 |
+| ![page 1](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P11.png?raw=true) | ![page 2](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/slack/A5_Zine_P12.png?raw=true) |
diff --git a/teams/README.md b/teams/README.md
@@ -0,0 +1,15 @@
+# Microsoft Teams Developer Platform
+
+See the blog posts with the doodles for more content! (Order: Chronological, newest content on top)
+
+## Teams Toolkit v4 GA Release 
+![Teams Toolkit GA](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/teams/teams-toolkit-ga.png?raw=true)
+
+Blog: [Microsoft Teams Toolkit for VS Code is now GA 🎉](https://dev.to/azure/microsoft-teams-toolkit-for-vs-code-is-now-ga-4830)
+
+## Teams Toolkit v3
+![Teams Toolkit v3](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/teams/teams-toolkit-v3-doodle.png?raw=true)
+
+Blog:
+* [Developing Enterprise-Ready Microsoft Teams Apps with Teams Toolkit v3.0](https://dev.to/azure/developing-enterprise-ready-microsoft-teams-apps-with-teams-toolkit-v30-o87)
+* [Debugging Teams App Locally with Teams Toolkit](https://dev.to/azure/debugging-teams-app-locally-with-teams-toolkit-2b67)
diff --git a/teams/teams-toolkit-ga.png b/teams/teams-toolkit-ga.png
diff --git a/webdev/README.md b/webdev/README.md
@@ -1,21 +1,35 @@
-# Web Development for Beginners
+![Microsoft](https://upload.wikimedia.org/wikipedia/commons/thumb/9/96/Microsoft_logo_%282012%29.svg/150px-Microsoft_logo_%282012%29.svg.png)
+# Web Development for Beginners - A Curriculum
 
 These doodles are created for the project at Microsoft I was in, [Web Dev for Beginners](https://github.com/microsoft/Web-Dev-For-Beginners)
-curriculum. 
-
-Please go to the [repo](https://github.com/microsoft/Web-Dev-For-Beginners) to see each image with the context!
-
-<svg xmlns="http://www.w3.org/2000/svg" width="108" height="23" viewBox="72 72 337 74" preserveAspectRatio="xMidYMin slice">
-			<g data-name="MS-symbol">
-				<clipPath>
-					<path transform="matrix(1 0 0 -1 0 216)" d="M0 216h482V0H0z"></path>
-				</clipPath>
-				<g clip-path="url(#a)">
-					<path class="fill-current-color color-text-subtle" d="M394.942 104.59h-10.858v25.003h-7.38V104.59h-5.182v-5.965h5.182v-4.308c0-3.254 1.06-5.92 3.178-7.998 2.12-2.079 4.835-3.118 8.15-3.118.882 0 1.666.045 2.35.135a9.37 9.37 0 011.806.407v6.296c-.24-.14-.663-.31-1.265-.512-.603-.2-1.296-.3-2.078-.3-1.528 0-2.702.476-3.526 1.43-.824.954-1.235 2.365-1.235 4.232v3.736h10.858v-6.959l7.321-2.229v9.188h7.381v5.965h-7.38v14.49c0 1.91.345 3.254 1.038 4.037.693.783 1.782 1.175 3.27 1.175.42 0 .927-.1 1.52-.3a7.178 7.178 0 001.552-.724v6.025c-.463.261-1.23.502-2.305.723a15.742 15.742 0 01-3.178.331c-3.073 0-5.378-.817-6.914-2.455-1.537-1.637-2.305-4.102-2.305-7.396zm-48.407 9.73c0 3.233.733 5.703 2.2 7.411 1.465 1.707 3.564 2.56 6.295 2.56 2.652 0 4.67-.853 6.055-2.56 1.386-1.708 2.08-4.238 2.08-7.592 0-3.334-.719-5.849-2.155-7.547-1.436-1.697-3.45-2.545-6.04-2.545-2.67 0-4.745.888-6.22 2.666-1.477 1.777-2.215 4.313-2.215 7.607m-7.592.24c0-5.12 1.446-9.177 4.338-12.17 2.892-2.993 6.91-4.489 12.05-4.489 4.841 0 8.621 1.441 11.343 4.323 2.721 2.883 4.082 6.774 4.082 11.674 0 5.021-1.447 9.018-4.338 11.99-2.892 2.973-6.829 4.458-11.81 4.458-4.8 0-8.61-1.41-11.432-4.232-2.822-2.82-4.233-6.673-4.233-11.554m-16.417-7.802c0 1.045.331 1.863.994 2.456.662.592 2.128 1.34 4.398 2.243 2.912 1.166 4.956 2.476 6.131 3.932 1.175 1.456 1.762 3.22 1.762 5.287 0 2.912-1.12 5.252-3.359 7.02-2.24 1.767-5.267 2.65-9.083 2.65-1.285 0-2.706-.155-4.263-.467-1.556-.31-2.877-.707-3.96-1.19v-7.169a17.945 17.945 0 004.277 2.198c1.526.543 2.911.814 4.157.814 1.647 0 2.862-.23 3.645-.693.784-.46 1.175-1.235 1.175-2.319 0-1.005-.406-1.853-1.22-2.546-.813-.693-2.355-1.492-4.624-2.395-2.69-1.125-4.599-2.39-5.724-3.796-1.125-1.406-1.687-3.193-1.687-5.362 0-2.792 1.11-5.086 3.33-6.884 2.217-1.797 5.095-2.696 8.63-2.696 1.084 0 2.3.12 3.645.361 1.346.242 2.47.553 3.374.934v6.93c-.964-.644-2.089-1.195-3.374-1.658-1.286-.462-2.56-.693-3.826-.693-1.386 0-2.465.271-3.238.813-.774.543-1.16 1.286-1.16 2.23m-35.066 7.562c0 3.233.733 5.703 2.2 7.411 1.465 1.707 3.564 2.56 6.295 2.56 2.652 0 4.67-.853 6.055-2.56 1.386-1.708 2.08-4.238 2.08-7.592 0-3.334-.719-5.849-2.155-7.547-1.436-1.697-3.449-2.545-6.039-2.545-2.672 0-4.745.888-6.222 2.666-1.476 1.777-2.214 4.313-2.214 7.607m-7.592.24c0-5.12 1.446-9.177 4.338-12.17 2.893-2.993 6.91-4.489 12.051-4.489 4.84 0 8.621 1.441 11.342 4.323 2.721 2.883 4.082 6.774 4.082 11.674 0 5.021-1.446 9.018-4.338 11.99-2.892 2.973-6.828 4.458-11.809 4.458-4.8 0-8.61-1.41-11.433-4.232-2.822-2.82-4.233-6.673-4.233-11.554m-3.136-16.448c.582 0 1.105.041 1.567.121.462.08.853.18 1.175.301v7.38c-.382-.28-.939-.546-1.672-.798-.733-.25-1.622-.376-2.666-.376-1.788 0-3.299.753-4.534 2.26-1.235 1.505-1.853 3.825-1.853 6.958v15.635h-7.29V98.624h7.29v4.88h.12c.663-1.687 1.667-3.007 3.013-3.96 1.346-.954 2.962-1.432 4.85-1.432m-27.956 26.18c1.084 0 2.28-.25 3.585-.754a15.06 15.06 0 003.615-1.988v6.778c-1.165.663-2.485 1.165-3.962 1.506-1.475.342-3.098.512-4.865.512-4.559 0-8.265-1.44-11.116-4.323-2.852-2.88-4.278-6.562-4.278-11.04 0-4.98 1.456-9.083 4.37-12.307 2.91-3.224 7.037-4.835 12.38-4.835 1.366 0 2.746.176 4.143.527 1.395.352 2.504.758 3.328 1.22v6.99c-1.125-.824-2.274-1.462-3.45-1.914a9.966 9.966 0 00-3.599-.678c-2.872 0-5.192.934-6.959 2.802-1.768 1.868-2.652 4.388-2.652 7.562 0 3.132.85 5.573 2.546 7.32 1.697 1.748 4.002 2.621 6.914 2.621m-22.112 5.302h-7.29V98.624h7.29zm-8.044-39.916c0-1.205.437-2.214 1.311-3.028.874-.813 1.913-1.22 3.118-1.22 1.285 0 2.35.417 3.193 1.25.844.834 1.266 1.833 1.266 2.998 0 1.185-.432 2.18-1.296 2.982-.864.804-1.918 1.205-3.163 1.205-1.246 0-2.295-.406-3.148-1.219-.854-.815-1.28-1.803-1.28-2.968m-6.274-3.284v43.2h-7.5v-33.86h-.12l-13.408 33.86h-4.97l-13.738-33.86h-.09v33.86h-6.929v-43.2h10.755l12.412 32.024h.18l13.105-32.024z"></path>
-					<path d="M106.214 106.214H71.996V71.996h34.218z" fill="#f25022"></path>
-					<path d="M143.993 106.214h-34.218V71.996h34.218z" fill="#7fba00"></path>
-					<path d="M106.214 143.993H71.996v-34.218h34.218z" fill="#00a4ef"></path>
-					<path d="M143.993 143.993h-34.218v-34.218h34.218z" fill="#ffb900"></path>
-				</g>
-			</g>
-		</svg>
+curriculum. Please go to the [repo](https://github.com/microsoft/Web-Dev-For-Beginners) to see each image with the context!
+
+## Intro to Programming
+![Intro to Programming](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-programming.png?raw=true)
+
+## Intro to Accessibility
+![Intro to Accessibility](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-a11y.png?raw=true)
+
+## Intro to GitHub
+![Intro to GitHub](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-github.png?raw=true)
+
+## Intro to HTML
+![Intro to HTML](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-html.png?raw=true)
+
+## Intro to CSS
+![Intro to CSS](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-css.png?raw=true)
+
+## Intro to JavaScript / DOM
+![Intro to JavaScript](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-js.png?raw=true)
+
+## JavaScript Basics - Data Types
+![JavaScript Data types](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-js-datatypes.png?raw=true)
+
+## JavaScript Basics - Functions
+![JavaScript Functions](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-js-functions.png?raw=true)
+
+## JavaScript Basics - Arrays
+![JavaScript Arrays](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-js-arrays.png?raw=true)
+
+## JavaScript Basics - Decisions
+![JavaScript if else](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/webdev/png/webdev101-js-decisions.png?raw=true)
Original file line number	Diff line number	Diff line change
Expand Up		@@ -54,4 +54,3 @@ Sketchnotes from Presenting Data & Information course by Edward Tufte about fund

		![sketchnote](https://github.com/girliemac/a-picture-is-worth-a-1000-words/blob/main/sketchnotes/data-and-info-02.webp?raw=true)