DOM Manipulation and Events

Lectures 14 • 40 slides

Narration

Session 14 Slide 1: Welcome to the Basics of Asynchronous Processing

Today's Theme

Basics of Asynchronous Processing (Fetch API and JSON)

Review of Last Time

  • Basic DOM manipulation
  • Event handling
  • Dynamic screen updates

What You Will Learn Today

  1. What is Asynchronous Processing?
  2. How to Use the Fetch API
  3. How to Handle JSON Data
  4. Basics of Promises
  5. Basics of async/await

Why is Asynchronous Processing Necessary?

  • Communication with the server
  • Reading files
  • Time-consuming processes

You can process without freezing the screen!

flowchart TD A[User Operation] --> B[Asynchronous Processing Start] B --> C[Screen is Operable] B --> D[Server Communication] D --> E[Data Acquisition] E --> F[Screen Update] C --> G[Other Operations are Possible] H[In the Case of Synchronous Processing] --> I[Screen Freezes] I --> J[Wait Until Processing is Complete] J --> K[Screen Operable]

Today's Goal

Be able to retrieve data from an external API and display it on the screen.

1/40

Apps - Try Now

SaaS web services and mobile apps from Yamashin Research Lab.

View Apps