english
chinese
介绍
Django 是一个构建应用程序后端的强大工具。你已经看到如何轻松设置数据库、路由 URL 和渲染模板。不过,在不使用 JavaScript 的情况下,当这些页面被渲染到浏览器时,它们是静态的,不提供任何交互形式。而通过使用 JavaScript,你的页面可以变成在浏览器中完全交互的应用程序。
本章将简要介绍 JavaScript 框架以及如何将它们与 Django 一起使用。虽然我们不会深入讲解如何从零开始构建整个 JavaScript 应用程序(那将会是一本单独的书),但我们会提供足够的入门知识,让你能够为自己的 Django 应用程序添加交互组件。在本章中,我们将主要使用 React 框架。即使你没有任何 JavaScript 经验,我们也会介绍足够的内容,让你在本章结束时能够自如地编写自己的 React 组件。在第 12 章《构建 REST API》中,你为 Bookr 构建了一个 REST API。我们将使用 JavaScript 与该 API 交互来检索数据。我们将通过动态加载并分页浏览主页上的一些评论预览来增强 Bookr。
注意
本章中练习和活动的代码可以在本书的 GitHub 仓库中找到,链接为:http://packt.live/3iasIMl。
JavaScript 框架
如今,实时交互是 Web 应用程序的基本组成部分。虽然可以在不使用框架的情况下添加简单的交互(这种开发方式通常称为 Vanilla JS),但随着 Web 应用程序规模的增长,使用框架可以让管理变得更加轻松。如果不使用框架,你需要自己完成以下任务:
手动定义数据库模式。
将 HTTP 请求中的数据转换为本地对象。
编写表单验证。
编写 SQL 查询来保存数据。
构建 HTML 来显示响应。
khmer
ការដំណើរការចូល
Django គឺជាឧបករណ៍ដ៏អស្ចារ្យសម្រាប់បង្កើតផ្នែកខាងក្រោយនៃកម្មវិធី។ អ្នកបានឃើញថា វាងាយស្រួលប៉ុនណាក្នុងការដំណើរការទិន្នន័យ ចុះបញ្ជី URL និងបង្ហាញតាមតម្លៃពុម្ព (templates)។ ទោះជាមិនប្រើ JavaScript ក៏ដោយ ពេលទំព័រទាំងនេះត្រូវបានបង្ហាញក្នុងកម្មវិធីរុករកពេលវេលា ពួកវាគឺជាទំព័រស្ទាតតិនិងគ្មានការចល័តប្រកបដោយអន្តរកម្ម។ តែប្រើ JavaScript វាធ្វើអោយទំព័រពុះដាច់ប្រសើរជាកម្មវិធីបង្ហោះងរោងបិត” browser(–run) pag+ filter JavaScript
burmese
မိတ်ဆက်
Django သည် အက်ပလီကေးရှင်း၏ နောက်ကွယ်ဘက်ကို တည်ဆောက်ရာတွင် အသုံးဝင်သော ကောင်းမွန်သည့် ကိရိယာတစ်ခုဖြစ်ပါသည်။ ဒေတာဘေ့စ်ကို ပြင်ဆင်ခြင်း၊ URL များကို လမ်းကြောင်းသတ်မှတ်ခြင်း၊ နှင့် အကြောင်းအရာပုံစံများကို ပြသခြင်းတို့ ပြုလုပ်ရတာ ဘယ်လောက်လွယ်ကူသလဲဆိုတာကို ကြည့်ရသွားပါပြီ။ သို့သော် JavaScript ကို အသုံးမပြုဘဲ ဖြစ်ပါက ထိုပင်မစာမျက်နှာများသည် ဘရောက်ဇာတွင် ပြသသောအခါ အStatic ဖြစ်နေပြီး အပြန်အလှန် ဆက်သွယ်နိုင်မှုမရှိပါ။ JavaScript ကို အသုံးပြုလျှင် သင့်စာမျက်နှာများကို ဘရောက်ဇာအတွင်း အပြည့်အဝ အပြန်အလှန် ဆက်သွယ်နိုင်သည့် အက်ပလီကေးရှင်းများအဖြစ် ပြောင်းလဲနိုင်ပါသည်။
ဤအခန်းတွင် JavaScript Framework များနှင့် Django တွင် အသုံးပြုနည်းအကြောင်း မိတ်ဆက်ပေးသွားပါမည်။ JavaScript အက်ပလီကေးရှင်းတစ်ခုကို အစမှ စပြီး တည်ဆောက်နည်းကို အကျယ်တဝင့် မရှင်းပြပေမည်ဖြစ်ပြီး (ထိုအကြောင်းအရာသည် တစ်အုပ်လုံးဖြစ်နိုင်သည့် အကြောင်းအရာဖြစ်သည်) သို့သော် သင့်ရဲ့ Django အက်ပလီကေးရှင်းတွင် အပြန်အလှန်ဆက်သွယ်နိုင်သည့် အစိတ်အပိုင်းများ ထည့်သွင်းနိုင်ရန် လုံလောက်သည့် အချက်အလက်များကို မိတ်ဆက်ပေးပါမည်။ ဒီအခန်းတွင် React Framework နှင့် အဓိက လုပ်ဆောင်သွားပါမည်။ သင့်တွင် JavaScript အတွေ့အကြုံ မရှိသည့် တောင် ဒီအခန်း၏အဆုံးတွင် သင့်ကိုယ်တိုင် React Component များရေးသားနိုင်ရန် လုံလောက်သည့် အကြောင်းအရာများကို မိတ်ဆက်ပေးပါမည်။
12 ရာထူး၊ REST API တည်ဆောက်ခြင်း (Building a REST API) တွင် Bookr အတွက် REST API တစ်ခု တည်ဆောက်ခဲ့ပါသည်။ JavaScript ဖြင့် API နှင့် အပြန်အလှန် ဆက်သွယ်ပြီး ဒေတာများ ရယူပါမည်။ Bookr ကို မြှင့်တင်ရန် စာမျက်နှာအဓိကတွင် စာသုံးသပ်ချက်များကို အကျဉ်းချုပ်ပြသပြီး စာမျက်နှာဖြတ်ပြောင်းနိုင်သည့် လုပ်ဆောင်ချက်များ ထည့်သွင်းပြသပါမည်။
မှတ်ချက်
ဤအခန်းရှိ လေ့ကျင့်ခန်းများနှင့် လှုပ်ရှားမှုများအတွက် ကုဒ်များကို ဤစာအုပ်၏ GitHub ရှိ ရေ့ပေါ်တွင် ရရှိနိုင်ပါသည်။ လင့်ခ်မှာ http://packt.live/3iasIMl ဖြစ်ပါသည်။
JavaScript Framework များ
ယနေ့ခေတ်တွင် အချိန်နှင့်တပြေးညီ အပြန်အလှန် ဆက်သွယ်နိုင်မှုသည် ဝဘ်အက်ပလီကေးရှင်းများ၏ အခြေခံအပိုင်းဖြစ်လာပါသည်။ ရိုးရှင်းသည့် အပြန်အလှန်ဆက်သွယ်မှုများကို Framework မလိုဘဲ (Vanilla JS ဟု ခေါ်သည်) ထည့်သွင်းနိုင်ပါသည်။ သို့သော် ဝဘ်အက်ပလီကေးရှင်း၏ အရွယ်အစား ကြီးလာသည်နှင့် အမျှ Framework မရှိဘဲ ဆောင်ရွက်ခြင်းမှာ ခက်ခဲနိုင်ပါသည်။ Framework မသုံးဘဲဖြစ်ပါက အောက်ပါအရာများကို ကိုယ်တိုင် ပြုလုပ်ရန် လိုအပ်ပါသည်-
ဒေတာဘေ့စ် အမျိုးအစားကို ကိုယ်တိုင် သတ်မှတ်ခြင်း။
HTTP တောင်းဆိုမှုမှ ဒေတာများကို ဒေသခံအရာများသို့ ပြောင်းလဲခြင်း။
ဖောင်များကို စစ်ဆေးရန် ကုဒ်ရေးခြင်း။
ဒေတာသိမ်းရန် SQL တောင်းဆိုချက်ရေးခြင်း။
တုံ့ပြန်မှုကို ပြသရန် HTML ဖန်တီးခြင်း။
vietnamese
Giới Thiệu
Django là một công cụ tuyệt vời để xây dựng phần backend của một ứng dụng.
công cụ = tool/framework
tuyệt vời = excellent/wonderful
để = to
xây dựng = build
phần = part
của = of
ứng dụng = application
Bạn đã thấy cách thiết lập cơ sở dữ liệu, định tuyến URL và
hiển thị template dễ dàng như thế nào.
Tuy nhiên, nếu không sử dụng JavaScript, khi các trang được hiển thị trong trình duyệt, chúng sẽ là các trang tĩnh và không có bất kỳ hình thức tương tác nào. Khi sử dụng JavaScript, các trang của bạn có thể được chuyển đổi thành những ứng dụng tương tác đầy đủ trong trình duyệt.
Chương này sẽ cung cấp một phần giới thiệu ngắn gọn về các framework JavaScript và cách sử dụng chúng với Django. Mặc dù chúng ta sẽ không đi sâu vào cách xây dựng một ứng dụng JavaScript hoàn chỉnh từ đầu (điều này sẽ cần một cuốn sách riêng), nhưng chúng ta sẽ cung cấp đủ thông tin để bạn có thể thêm các thành phần tương tác vào ứng dụng Django của mình. Trong chương này, chúng ta sẽ chủ yếu làm việc với framework React. Ngay cả khi bạn không có kinh nghiệm với JavaScript, chúng ta sẽ giới thiệu đủ để bạn có thể thoải mái viết các component React của riêng mình khi kết thúc chương này.
Trong Chương 12, Xây dựng REST API, bạn đã xây dựng một REST API cho Bookr. Chúng ta sẽ sử dụng JavaScript để tương tác với API đó và lấy dữ liệu. Chúng ta sẽ nâng cấp Bookr bằng cách hiển thị trước một số đánh giá trên trang chính, được tải động và có thể chuyển trang qua lại.
Lưu ý
Mã cho các bài tập và hoạt động trong chương này có thể tìm thấy trong kho GitHub của cuốn sách này tại: http://packt.live/3iasIMl.
Framework JavaScript
Ngày nay, tính tương tác thời gian thực là một phần không thể thiếu của các ứng dụng web. Mặc dù các tương tác đơn giản có thể được thêm mà không cần sử dụng framework (cách phát triển này thường được gọi là Vanilla JS), nhưng khi ứng dụng web của bạn phát triển lớn hơn, việc sử dụng một framework sẽ giúp bạn dễ dàng quản lý hơn nhiều. Nếu không có framework, bạn sẽ phải tự làm những việc sau:
Tự định nghĩa cấu trúc cơ sở dữ liệu.
Chuyển đổi dữ liệu từ yêu cầu HTTP thành các đối tượng gốc.
Viết code xác thực cho form.
Viết câu lệnh SQL để lưu dữ liệu.
Tạo HTML để hiển thị phản hồi.
indonesian
Pendahuluan
Django adalah alat yang hebat untuk membangun backend dari sebuah aplikasi. Anda telah melihat betapa mudahnya mengatur database, mengatur rute URL, dan merender template. Namun, tanpa menggunakan JavaScript, ketika halaman-halaman tersebut dirender ke browser, halaman tersebut bersifat statis dan tidak menyediakan bentuk interaksi apa pun. Dengan menggunakan JavaScript, halaman Anda dapat diubah menjadi aplikasi yang sepenuhnya interaktif di dalam browser.
Bab ini akan menjadi pengenalan singkat tentang framework JavaScript dan cara menggunakannya bersama Django. Meskipun ini bukan panduan mendalam tentang cara membangun aplikasi JavaScript lengkap dari awal (itu akan menjadi sebuah buku tersendiri), kami akan memberikan pengantar yang cukup agar Anda bisa menambahkan komponen interaktif ke aplikasi Django Anda. Dalam bab ini, kita akan bekerja terutama dengan framework React. Bahkan jika Anda tidak memiliki pengalaman dengan JavaScript, kami akan memperkenalkan hal-hal mendasar agar di akhir bab ini Anda merasa nyaman menulis komponen React Anda sendiri.
Pada Bab 12, Membangun REST API, Anda telah membuat REST API untuk Bookr. Kita akan berinteraksi dengan API tersebut menggunakan JavaScript untuk mengambil data. Kita akan meningkatkan Bookr dengan menampilkan pratinjau ulasan di halaman utama yang dimuat secara dinamis dan dapat dibolak-balik.
Catatan
Kode untuk latihan dan aktivitas dalam bab ini dapat ditemukan di repositori GitHub buku ini di: http://packt.live/3iasIMl.
Framework JavaScript
Saat ini, interaktivitas waktu nyata adalah bagian mendasar dari aplikasi web. Meskipun interaksi sederhana dapat ditambahkan tanpa framework (pendekatan ini sering disebut Vanilla JS), seiring pertumbuhan aplikasi web Anda, penggunaan framework akan mempermudah pengelolaannya. Tanpa framework, Anda perlu melakukan hal-hal berikut secara manual:
Menentukan skema database secara manual.
Mengonversi data dari permintaan HTTP menjadi objek asli.
Menulis kode validasi formulir.
Menulis kueri SQL untuk menyimpan data.
Membuat HTML untuk menampilkan respons.
russian
Введение
Django — это отличный инструмент для создания серверной части приложения.
это = is
отличный (otlichnyy) = excellent
инструмент (instrument) = tool
для (dlya) = for
создания (sozdaniya) = creating
серверной (servernoy) = server
части (chasti) = part
приложения (prilozheniya) = of application
Вы уже видели, насколько просто настроить базу данных,
Вы (Vy) = You
уже (uzhe) = already
видели (videli) = saw/have seen
насколько (naskol’ko) = how
просто (prosto) = simple/easy
настроить (nastroit’) = to set up/configure
базу (bazu) = database (accusative case)
данных (dannykh) = of data (genitive case)
маршрутизировать URL и отображать шаблоны.
Однако без использования JavaScript при отображении этих страниц в браузере они будут статичными и не будут предоставлять никакой формы взаимодействия. Используя JavaScript, вы сможете превратить свои страницы в полноценные интерактивные приложения в браузере.
Эта глава является кратким введением в JavaScript-фреймворки и способы их использования с Django. Хотя это не будет глубоким погружением в создание полноценного JavaScript-приложения с нуля (для этого потребовалась бы целая книга), мы предоставим достаточно информации для добавления интерактивных компонентов в ваше Django-приложение. В этой главе мы будем работать с фреймворком React. Даже если у вас нет опыта работы с JavaScript, мы представим достаточно материала, чтобы к концу этой главы вы смогли писать свои собственные React-компоненты.
В главе 12, Создание REST API, вы создавали REST API для Bookr. Мы будем взаимодействовать с этим API с помощью JavaScript для получения данных. Мы улучшим Bookr, добавив динамически загружаемые предпросмотры отзывов на главной странице с возможностью их перелистывания.
Примечание
Код для упражнений и практических заданий этой главы можно найти в репозитории книги на GitHub по ссылке: http://packt.live/3iasIMl.
JavaScript-фреймворки
Сегодня интерактивность в реальном времени является важной частью веб-приложений. Хотя простые взаимодействия можно добавить и без фреймворка (такой подход называется Vanilla JS), по мере роста веб-приложения управлять им становится намного проще с использованием фреймворка. Без фреймворка вам пришлось бы выполнять следующие задачи самостоятельно:
Вручную определять схему базы данных.
Конвертировать данные из HTTP-запросов в нативные объекты.
Писать код для валидации форм.
Создавать SQL-запросы для сохранения данных.
Формировать HTML для отображения ответа.
Japanese
はじめに
Djangoはアプリケーションのバックエンドを構築するための優れたツールです。
Django は (wa) = Django (topic marker)
アプリケーション (apurikēshon) = application
バックエンド (bakkuendo) = backend
を (wo) = object marker
構築 (kōchiku) = build/construction
する (suru) = to do
ための (tame no) = for the purpose of
優れた (sugureta) = excellent
ツール (tsūru) = tool
です (desu) = is (polite copula)
データベースの設定、URLのルーティング、
テンプレートのレンダリングがいかに簡単であるかを既にご覧になったことでしょう。
しかし、JavaScriptを使用しない場合、これらのページがブラウザに表示される際、
静的なものであり、インタラクティブな要素は提供されません。
JavaScriptを使用することで、
ページをブラウザ上で完全にインタラクティブなアプリケーションへと変えることができます。
この章では、JavaScriptフレームワークの概要と、それをDjangoと一緒に使う方法について説明します。JavaScriptアプリケーションをゼロから完全に構築する方法を深く掘り下げることはしませんが(それだけで一冊の本になるでしょう)、Djangoアプリケーションにインタラクティブなコンポーネントを追加するための十分な知識を提供します。この章では、主にReactフレームワークを使用します。JavaScriptの経験がない方でも、章の終わりにはReactコンポーネントを自分で書けるように必要な知識を紹介します。
第12章「REST APIの構築」では、BookrのためのREST APIを構築しました。JavaScriptを使用してそのAPIとやり取りし、データを取得します。Bookrを強化し、メインページに動的に読み込まれるレビューのプレビューを表示し、ページを切り替える機能を追加します。
注意
この章の演習やアクティビティのコードは、次のリンクにある本書のGitHubリポジトリで確認できます: http://packt.live/3iasIMl。
JavaScriptフレームワーク
今日、リアルタイムなインタラクティブ性はWebアプリケーションの基本要素です。シンプルなインタラクションはフレームワークを使わずに追加できます(この方法はVanilla JSと呼ばれます)。しかし、Webアプリケーションが大きくなるにつれて、フレームワークを使用すると管理がずっと簡単になります。フレームワークを使わない場合、以下のことを自分で行う必要があります:
データベーススキーマを手動で定義する。
HTTPリクエストからのデータをネイティブオブジェクトに変換する。
フォームのバリデーションを書く。
データを保存するためのSQLクエリを書く。
レスポンスを表示するためのHTMLを作成する。
korean
Arab
Hindi
Filipino
Cantonese ,
Italian
French
German
Spanish
Turkish
Portuguese
Bengali
Malay
Tamil
Telugu
Hebrew
Persian
Urdu
Pashto
Swedish
Swahili
Laos
Shan
Hausa
Marathi
Gujarati
Norwegian
Danish
Uzbekistan
Kazakhstan
Polish
Greek
Armenian
Amharic
Xhosa
Hungarian
Tamazight
Kurds
