course/pr_1069/vi/chapter9/1.html

<meta charset="utf-8" /><meta name="hf:doc:metadata" content="{&quot;title&quot;:&quot;Giới thiệu&quot;,&quot;local&quot;:&quot;giới-thiệu&quot;,&quot;sections&quot;:[{&quot;title&quot;:&quot;Bữa tiệc Gradio&quot;,&quot;local&quot;:&quot;bữa-tiệc-gradio&quot;,&quot;sections&quot;:[],&quot;depth&quot;:2}],&quot;depth&quot;:1}">
		<link href="/docs/course/pr_1069/vi/_app/immutable/assets/0.e3b0c442.css" rel="modulepreload">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/entry/start.bcd19957.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/scheduler.37c15a92.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/singletons.20a6a839.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/index.18351ede.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/paths.c89f4ad2.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/entry/app.38d32b86.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/index.2bf4358c.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/nodes/0.cba642dc.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/each.e59479a4.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/nodes/70.c7f7e54b.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/Tip.363c041f.js">
		<link rel="modulepreload" href="/docs/course/pr_1069/vi/_app/immutable/chunks/getInferenceSnippets.24b50994.js"><!-- HEAD_svelte-u9bgzb_START --><meta name="hf:doc:metadata" content="{&quot;title&quot;:&quot;Giới thiệu&quot;,&quot;local&quot;:&quot;giới-thiệu&quot;,&quot;sections&quot;:[{&quot;title&quot;:&quot;Bữa tiệc Gradio&quot;,&quot;local&quot;:&quot;bữa-tiệc-gradio&quot;,&quot;sections&quot;:[],&quot;depth&quot;:2}],&quot;depth&quot;:1}"><!-- HEAD_svelte-u9bgzb_END -->      <p></p>  <h1 class="relative group"><a id="giới-thiệu" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#giới-thiệu"><span><svg class="" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg></span></a> <span>Giới thiệu</span></h1> <p data-svelte-h="svelte-1u16l7o">Trong chương này, chúng ta sẽ tìm hiểu về cách tạo <strong>demo tương tác</strong> cho các mô hình học máy của bạn.</p> <p data-svelte-h="svelte-n487l5">Tại sao ta nên xây dựng bản demo hoặc GUI cho mô hình học máy của bạn? Bản demo cho phép:</p> <ul data-svelte-h="svelte-goh1wr"><li><strong>Các nhà phát triển học máy</strong> dễ dàng trình bày công việc của họ cho nhiều đối tượng bao gồm cả các nhóm không chuyên về kỹ thuật hoặc khách hàng</li> <li><strong>Các nhà nghiên cứu</strong> dễ dàng tái tạo các mô hình và hành vi học máy hơn</li> <li><strong>Người kiểm tra chất lượng</strong> hoặc <strong>người dùng cuối</strong> dễ dàng xác định và gỡ lỗi các điểm hỏng hóc của mô hình</li> <li><strong>Người dùng đa dạng</strong> khám phá các sai lệch của ​​thuật toán trong các mô hình</li></ul> <p data-svelte-h="svelte-1o2euqa">Chúng ta sẽ sử dụng thư viện Gradio để xây dựng các bản demo cho các mô hình của mình. Gradio cho phép bạn xây dựng, tùy chỉnh và chia sẻ các bản demo trên web cho bất kỳ mô hình học máy nào, hoàn toàn bằng Python.</p> <p data-svelte-h="svelte-w2gp2x">Dưới đây là một số ví dụ về demo học máy được xây dựng với Gradio:</p> <ul data-svelte-h="svelte-xmqidf"><li>Một mô hình <strong>nhận dạng phác thảo</strong> nhận bản phác thảo và xuất ra các nhãn của những gì nó cho là đang được vẽ:</li></ul> <iframe src="https://course-demos-draw2.hf.space" frameborder="0" height="450" title="Gradio app" class="container p-0 flex-grow space-iframe" allow="accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"></iframe> <ul data-svelte-h="svelte-q4jdvk"><li>Mô hình <strong>hỏi đáp</strong> khai thác lấy trong một đoạn ngữ cảnh và một câu hỏi và đưa ra một câu trả lời và điểm xác suất (chúng ta đã thảo luận về loại mô hình này <a href="/course/chapter7/7">trong Chương 7</a>):</li></ul> <iframe src="https://course-demos-question-answering-simple.hf.space" frameborder="0" height="640" title="Gradio app" class="container p-0 flex-grow space-iframe" allow="accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"></iframe> <ul data-svelte-h="svelte-18lbibd"><li>Một mô hình <strong>xóa nền</strong> nhận vào một hình ảnh và xuất ra hình ảnh với nền đã bị xóa:</li></ul> <iframe src="https://course-demos-remove-bg-original.hf.space" frameborder="0" height="640" title="Gradio app" class="container p-0 flex-grow space-iframe" allow="accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"></iframe> <p data-svelte-h="svelte-s30ya1">Chương này được chia thành các phần bao gồm cả <em>khái niệm</em> và <em>ứng dụng</em>. Sau khi bạn tìm hiểu khái niệm trong mỗi phần, bạn sẽ áp dụng nó để xây dựng một loại bản demo cụ thể, từ phân loại hình ảnh đến nhận dạng giọng nói. Vào thời điểm bạn hoàn thành chương này, bạn sẽ có thể xây dựng các bản demo này (và nhiều hơn nữa!) Chỉ trong một vài dòng mã Python.</p>  <div class="course-tip  bg-gradient-to-br dark:bg-gradient-to-r before:border-green-500 dark:before:border-green-800 from-green-50 dark:from-gray-900 to-white dark:to-gray-950 border border-green-50 text-green-700 dark:text-gray-400">👀 Hãy ngó thử <a href="https://huggingface.co/spaces" target="_blank" data-svelte-h="svelte-z9a0gx">Hugging Face Spaces</a> để xem nhiều ví dụ gần đây về các bản demo học máy do cộng đồng học máy xây dựng!</div>  <h2 class="relative group"><a id="bữa-tiệc-gradio" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#bữa-tiệc-gradio"><span><svg class="" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg></span></a> <span>Bữa tiệc Gradio</span></h2> <p data-svelte-h="svelte-73nurm">Nếu bạn muốn vận dụng tốt kiến thức từ chương này, hãy tham gia bữa tiệc Gradio! Đây là sự kiện cộng đồng do Hugging Face tổ chức vào ngày <strong>16-31 tháng 5</strong>. Trong sự kiện này, bạn sẽ xây dựng các bản demo học máy thú vị với Gradio và đang chạy để giành chiến thắng và giải thưởng Hugging Face swag!</p> <p data-svelte-h="svelte-1s6fyr0">Xem <a href="https://github.com/AK391/community-events/blob/main/gradio-blocks/README.md" rel="nofollow">mô tả sự kiện</a> để biết chi tiết về cách tham gia - chúng tôi rất nóng lòng được biết các bản demo bạn sẽ xây dựng 🤗!</p> <a class="!text-gray-400 !no-underline text-sm flex items-center not-prose mt-4" href="https://github.com/huggingface/course/blob/main/chapters/vi/chapter9/1.mdx" target="_blank"><span data-svelte-h="svelte-1kd6by1">&lt;</span> <span data-svelte-h="svelte-x0xyl0">&gt;</span> <span data-svelte-h="svelte-1dajgef"><span class="underline ml-1.5">Update</span> on GitHub</span></a>  <p></p> 
			
			<script>
				{
					__sveltekit_rdxbtd = {
						assets: "/docs/course/pr_1069/vi",
						base: "/docs/course/pr_1069/vi",
						env: {}
					};

					const element = document.currentScript.parentElement;

					const data = [null,null];

					Promise.all([
						import("/docs/course/pr_1069/vi/_app/immutable/entry/start.bcd19957.js"),
						import("/docs/course/pr_1069/vi/_app/immutable/entry/app.38d32b86.js")
					]).then(([kit, app]) => {
						kit.start(app, element, {
							node_ids: [0, 70],
							data,
							form: null,
							error: null
						});
					});
				}
			</script>