WIP: Add gradio chapter by dawoodkhan82 · Pull Request #14 · huggingface/course

dawoodkhan82 · 2022-02-23T16:26:58Z

No description provided.

lewtun

Thanks for adding this great chapter @dawoodkhan82 - it's looking good!

The main suggestion I have is to use use the py annotation in your code snippets so that we can convert everything into notebooks that run on Colab.

The other question I have is whether we're lacking a bit of motivation for each of the sections, i.e. with a preamble like "Imagine that you're trying to do X .... here's how we can solve this with gradio"

I'm also wondering whether the early sections offer something qualitatively different from reading the Gradio doc, and this is where having some "case studies" might be interesting - I suggest we discuss further offline :)

lewtun · 2022-02-24T08:16:29Z

+    title: Part 2 Release Event
+
+- local: chapter9
+  title: Making Machine Learning Demos


nit: we only capitalise the first word in the chapter / section titles

lewtun · 2022-02-24T08:18:19Z

@@ -0,0 +1,13 @@
+In this chapter we will be learning about the quickest and easiest way to build a demo for your machine learning model. Why build a demo in the first place? Demos allow:
+
+More precisely, in this chapter you will learn:


Should this sentence be moved below the list and followed by a list that explains what the reader will learn?

lewtun · 2022-02-24T08:23:49Z

+Let's get started with a simple “Hello World” example to get familiar with the gradio API:
+
+```
+!pip install gradio


If you'd like this section to have an "Open in Colab" button where people can run the code, I suggest having using the py annotation to export the code snippet like:

```py !pip install gradio ... ```

This way, when we run the generate_notebooks.py script, these snippets will be stripped out and wrapped as .ipynb files :)

lewtun · 2022-02-24T08:26:49Z

@@ -0,0 +1,25 @@
+Gradio is a python package and can run anywhere from your favorite IDE to Google Colab and Jupyter notebooks.
+Let's get started with a simple “Hello World” example to get familiar with the gradio API:


nit: should "gradio" be gradio to highlight it's a library? For the Hugging Face libraries we used "🤗 Transformers" etc, but only because of the emoji :)

lewtun · 2022-02-24T08:30:52Z

@@ -0,0 +1,24 @@
+### Understanding the `Interface` class:


As discussed internally, I personally feel this approach of spelling out all the bits of the API is too similar to what I'd find in the docs. If you agree, my suggestion would be to demonstrate some of these features with explicit examples - see chapter 5 for an idea on how we tackled this for the datasets library (which also has a detailed API)

lewtun · 2022-02-24T08:33:33Z

@@ -0,0 +1,27 @@
+### Load models from Hugging Face's Model Hub


nit:

Suggested change

### Load models from Hugging Face's Model Hub

### Load models from the Hugging Face Hub

lewtun · 2022-02-24T08:34:49Z

@@ -0,0 +1,52 @@
+### Image Input and Output Example:


In case you want to add "tip" or "question" boxes with helpful tips or calls to action, you can add the following to the top of your MDX files:

<script> import Question from "./Question.svelte"; import Tip from "./Tip.svelte"; import Youtube from "./Youtube.svelte"; export let fw: "pt" | "tf"; </script>

lewtun · 2022-02-24T08:37:28Z

@@ -0,0 +1,27 @@
+### Load models from Hugging Face's Model Hub
+  - Browse through the thousands of models Hugging Face has to offer [here](https://huggingface.co/models).


Maybe we can link back to Chapter 4 here? You can use the following syntax for that:

[Chapter 4](/course/chapter4/section2)

lewtun · 2022-02-24T08:38:07Z

@@ -0,0 +1,27 @@
+### Load models from Hugging Face's Model Hub
+  - Browse through the thousands of models Hugging Face has to offer [here](https://huggingface.co/models).
+  - It is especially easy to demo a `transformers` model from Hugging Face's Model Hub. Using the special `gr.Interface.load` method, you pass `model/` or `huggingface/` followed by the model name. For example, here is the code to build a demo for [GPT-J](https://huggingface.co/EleutherAI/gpt-j-6B), a large language model & add a couple of examples inputs:


turbo nit: we tend to use parentheses when referring to functions / methods:

Suggested change

- It is especially easy to demo a `transformers` model from Hugging Face's Model Hub. Using the special `gr.Interface.load` method, you pass `model/` or `huggingface/` followed by the model name. For example, here is the code to build a demo for [GPT-J](https://huggingface.co/EleutherAI/gpt-j-6B), a large language model & add a couple of examples inputs:

- It is especially easy to demo a `transformers` model from Hugging Face's Model Hub. Using the special `gr.Interface.load()` method, you pass `model/` or `huggingface/` followed by the model name. For example, here is the code to build a demo for [GPT-J](https://huggingface.co/EleutherAI/gpt-j-6B), a large language model & add a couple of examples inputs:

lewtun · 2022-02-24T08:39:18Z

+### The first model we'll walk through is AnimeGanV2. you can try the model [here](https://huggingface.co/spaces/akhaliq/AnimeGANv2).
+
+<p align="center">
+<img src="/course/static/chapter9/anime-gan.png" alt="An image showing the gradio interface for the anime gan model" width="80%"/>


Is it possible to embed Gradio spaces directly in the website? Would be super cool if we could do something similar to what was done with the inference widgets here

Added some embedded demos as <iframes> in Section 1. Will these show up fine in the course @lewtun?

Pinging @mishig25 on this since he's the frontend expert :)

osanseviero

This is very cool! I left a couple of minor nits.

One other thing: I see one gif is 8MB and some images are over 1MB. I think we need smaller assets

osanseviero · 2022-02-24T09:14:25Z

-    title: Part 2 Release Event
+    title: Part 2 Release Event
+
+- local: chapter9


I wonder if instead of this being chapter 9, we could put it as a special edition chapter since it does no rely heavily in all previous knowledge. We could even put it after chapter 1 or 4.

I like this idea a lot! I suppose we just need to rethink a bit how we present the course to newcomers on the landing page - originally it was envisioned as 3 parts, with each part having 4 chapters.

With your approach, we could either:

Restructure the course outline so that Gradio is listed as a section in Part 1 or 2

Inject it as a special chapter and use the free slot to add something new in Part 3

osanseviero · 2022-02-24T09:15:18Z

+- Increase reproducibility of machine learning research
+- Diverse users to more easily identify and debug failure points of models
+
+Check out the [Keras Org] (https://huggingface.co/keras-io) on Hugging Face for some examples of what a machine learning demo looks like.


Suggested change

Check out the [Keras Org] (https://huggingface.co/keras-io) on Hugging Face for some examples of what a machine learning demo looks like.

Check out the [Keras Organization](https://huggingface.co/keras-io) for some examples of what a machine learning demo looks like.

osanseviero · 2022-02-24T09:15:57Z

@@ -0,0 +1,25 @@
+Gradio is a python package and can run anywhere from your favorite IDE to Google Colab and Jupyter notebooks.


Suggested change

Gradio is a python package and can run anywhere from your favorite IDE to Google Colab and Jupyter notebooks.

Gradio is a Python package and can run anywhere from your favorite IDE to Google Colab and Jupyter notebooks.

abidlabs · 2022-02-28T15:26:25Z

The other question I have is whether we're lacking a bit of motivation for each of the sections, i.e. with a preamble like "Imagine that you're trying to do X .... here's how we can solve this with gradio"

I agree with this -- I think we need better transitions between the different sections. I also think adding some kind of outline in Section 1 would help readers understand how everything is organized

add gradio chapter

0976ed6

dawoodkhan82 requested review from abidlabs and lewtun February 23, 2022 16:27

remove python

3aa58d2

lewtun reviewed Feb 24, 2022

View reviewed changes

osanseviero reviewed Feb 24, 2022

View reviewed changes

added embedded demos to section 1

3f0097d

abidlabs closed this Mar 2, 2022

abidlabs deleted the dawood/gradio-chapter branch March 2, 2022 15:38

abidlabs mentioned this pull request Mar 2, 2022

Add Gradio Chapter #17

Merged

		@@ -0,0 +1,13 @@
		In this chapter we will be learning about the quickest and easiest way to build a demo for your machine learning model. Why build a demo in the first place? Demos allow:

		More precisely, in this chapter you will learn:

		@@ -0,0 +1,25 @@
		Gradio is a python package and can run anywhere from your favorite IDE to Google Colab and Jupyter notebooks.
		Let's get started with a simple “Hello World” example to get familiar with the gradio API:

		@@ -0,0 +1,27 @@
		### Load models from Hugging Face's Model Hub

	### Load models from Hugging Face's Model Hub
	### Load models from the Hugging Face Hub

		@@ -0,0 +1,27 @@
		### Load models from Hugging Face's Model Hub
		- Browse through the thousands of models Hugging Face has to offer [here](https://huggingface.co/models).

	Check out the [Keras Org] (https://huggingface.co/keras-io) on Hugging Face for some examples of what a machine learning demo looks like.
	Check out the [Keras Organization](https://huggingface.co/keras-io) for some examples of what a machine learning demo looks like.

Uh oh!

Conversation

dawoodkhan82 commented Feb 23, 2022

Uh oh!

lewtun left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

osanseviero left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

abidlabs commented Feb 28, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

abidlabs commented Feb 28, 2022 •

edited

Loading