Automatically translated.View original post

🔥 Why does the web retrieve air data, maps or payment systems? The answer is "API." 🌐

💡 EP.7 of Web App 201, we explain "What is an API" and how to connect it in a way that people can understand.

🎯 Understand basic system welding.

Know how API matters to Web App

Ready to connect real services

🧠 API = "intermediary transmits data between systems." 🔄

A simple advantage. 🍽️

Frontend = Client

API = Order Receiver Staff

Backend / Database = Kitchen

The user presses the button → API, sends the request → the data transmission system back.

Examples of APIs actually used:

🌦️ Weather API → Air Retrieval

💳 Payment API → Payment System

🗺️ Google Maps API → Maps

🤖 AI API → Use AI in the Web

💡 What I see often.

GET → Retrieve

POST → Send data

JSON → Popular data format

Like "Web, look at the price of krypto."

The web page does not contain the information itself.

But extract data from the Real-time API. 📈

👉 API = The Heart of the New Era Web App

🛠️ How to

Start welding simple APIs:

Find the API you want to use

Read Documentation

Use the Fetch API to call data.

Display on web page

Unloadable Error Case

🚀 Who has tried to connect the API? Let's share it! 🔥

# WebApp 201 # API # WebDevelopment # Frontend # Backend

5/12 Edited to

... Read moreจากประสบการณ์ส่วนตัวที่เคยลองเชื่อมต่อ API สำหรับโปรเจกต์เว็บแอปเล็กๆ ทำให้เข้าใจได้ดีว่า API เป็นเหมือนตัวกลางสำคัญที่ช่วยให้ระบบต่างๆ สื่อสารกันได้แบบเรียลไทม์ เช่น การดึงข้อมูลอุณหภูมิจาก Weather API มาแสดงบนหน้าเว็บโดยทันที หรือการระบุพิกัดสถานที่ผ่าน Google Maps API ซึ่งช่วยเพิ่มประสบการณ์ใช้งานให้กับผู้ใช้ได้มาก การใช้งาน API ไม่จำเป็นต้องมีความรู้ทางโปรแกรมขั้นสูง เพราะส่วนใหญ่จะมีเอกสาร (Documentation) อธิบายวิธีเรียกใช้งานอย่างละเอียด ทั้งรูปแบบข้อมูลที่ส่งไปและที่ได้รับกลับ รวมถึงวิธีจัดการกับข้อผิดพลาดที่จะช่วยให้เว็บตอบสนองได้ดีแม้ระบบภายนอกมีปัญหา อีกหนึ่งตัวอย่างที่เห็นได้ชัดคือระบบชำระเงินออนไลน์ที่ใช้ Payment API ช่วยให้เว็บไม่ต้องเก็บข้อมูลบัตรเครดิตเอง แต่สามารถส่งคำขอชำระเงินไปยังระบบธนาคารหรือผู้ให้บริการชำระเงินได้อย่างปลอดภัย ช่วยลดภาระการพัฒนาและเพิ่มความน่าเชื่อถือในระบบ ซึ่งสิ่งสำคัญคือการทำความเข้าใจวิธีเรียกใช้ API พื้นฐาน เช่น การใช้คำสั่ง GET เพื่อดึงข้อมูล และ POST เพื่อส่งข้อมูล พร้อมทั้งการจัดการกับ JSON ซึ่งเป็นรูปแบบข้อมูลที่ได้รับความนิยมมากในวงการเว็บแอปทุกวันนี้ ท้ายที่สุด API ไม่ได้เป็นแค่เทคโนโลยีสำหรับนักพัฒนาเท่านั้น แต่ยังเป็นประตูที่เปิดให้ข้อมูลและบริการต่างๆ สามารถผสานรวมกันได้อย่างลื่นไหล ช่วยสร้างนวัตกรรมใหม่ๆ และประสบการณ์ที่ดีให้กับผู้ใช้จริงๆ

Related posts

This image outlines 'Levels of care' (Preventative, Primary, Secondary, Tertiary, Restorative, Continuing) and 'Levels of prevention' (Primary, Secondary, Tertiary) in nursing, detailing their focus areas and examples like wellness clinics, urgent care, immunizations, and rehab.
This image details healthcare concepts including the Affordable Care Act (Obama Care), healthcare financing (fee-for-service, Medicare, Medicaid), Managed Care Organizations focusing on cost control and satisfaction, and HCAHPS surveys for patient satisfaction.
This image defines 'Ethics' in healthcare, covering Bioethics, Values, Morals, and key principles: Autonomy, Beneficence, Fidelity, Justice, Nonmaleficence, and Veracity, with brief explanations for each.
Nursing Fundamentals
Got lots to share! These are older notes from my first ever nursing exam! Blessed to say that I have one exam left of my first semester. Wish me luck! We all have it in us! #fundamentalsofnursing #nursing #nursingstudent #nursingschool #lemon8diarychallenge
Aveee💗🩺

Aveee💗🩺

1312 likes

A white tote bag filled with books, with a starburst overlay containing the text: "THE MOST EFFICIENT LANGUAGE APP I FOUND THAT HELPS!"
A collage of LingoDeer app interfaces showing language course selection (Japanese, French, etc.), different fluency levels, character drills, and a Japanese Gojuon alphabet chart.
LingoDeer app screenshots explaining the Japanese Gojuon chart, detailing its structure with Hiragana, Katakana, and Romaji, and comparing Hepburn and Kunrei-shiki romanization systems.
LingoDeer- one of the better language apps
This app called LingoDeer is full of many languages all with different levels of fluency and grammar, it is known for its detailed lessons and information that is compiled and used to better help the student get as close to fluent as possible. There are many levels all with grammar,reading,writin
Gianna

Gianna

73 likes

A young woman with long dark hair, wearing a pink satin shirt, smiles at the camera while sitting at a table. Overlay text reads: 'Tools and sites I use as a cybersecurity student to progress my skills and keep me interested in studying'.
A screenshot of 'The Hacker News' website, displaying various cybersecurity news articles from January 2025, including topics like vulnerabilities, malware, cyber espionage, and AI jailbreak methods. An ad for Zscaler and a banner for CIS Hardened Images are also visible.
A screenshot of the O'Reilly learning platform, showing various books and expert playlists related to AI, engineering, and data. Overlay text highlights the subscription cost ($50/month or $499/year) and its value for accessing books and live events.
Tools and sites I use as a cybersecurity student 🌸
#cybersecuritystudent #cybersecurity #techgirlie
LexiStudies

LexiStudies

110 likes

A woman takes a mirror selfie with the title "THINGS I WISHED I KNEW BEFORE I STARTED MY CREDIT REPAIR JOURNEY," introducing a guide to credit repair.
A woman poses next to text asking, "DID YOU KNOW? Experian, Equifax & TransUnion Are NOT The MAJOR Credit Bureaus?!" challenging common credit repair assumptions.
An infographic details primary credit bureaus (ChexSystems, Innovis, LexisNexis) and secondary bureaus (Experian, Equifax, TransUnion), advising to start with primary for stronger credit repair results.
I Wish Someone Had Told Me This BEFORE I Started Repairing My Credit 🤯
Important tip! FREEZE your LexisNexis and Innovis profiles while disputing and fixing your credit. ONLY freeze your ChexSystems profile if you are NOT opening new accounts. These will have to be unfreezed before you open new credit or loan accounts. Freezing gives only YOU access to your profiles.
ScoreRiseCreditSolutions

ScoreRiseCreditSolutions

13 likes

Controlling Your Emotions 𓆩♡𓆪
Learning to control your emotions is one of the most important things to do to improve the quality of your life in both the short-term and long-term. It allows you to understand and identify what triggers you, and makes managing stress much easier. Controlling your emotions does NOT mean suppres
angel factory🪽

angel factory🪽

2536 likes

A spiral notebook displays handwritten management notes in pink and black ink, covering recruitment and workforce management. Highlighters are visible beside the notebook, with 'Aesthetic Notes Inspo' overlaid on the image.
A spiral notebook shows handwritten management notes in pink and black ink for Chapter 9, dated 10/20/23. The notes detail strategic human resource management, including definitions, types of fit, and SHRM approaches.
A spiral notebook contains handwritten management notes in pink and black ink. The notes cover recruitment and selection processes, including types of recruiting, selection tools, and managing an effective workforce.
Aesthetic Notes Finals Edition 🩷
Hi everyone!! 🍋 Here’s some aesthetic notes inspo! This is from last year’s management class. I like to take notes from my textbook. I usually take notes on the main points and definitions from each chapter that I read. I just finished finals a week ago so I thought I’d share some of my cute notes!
Evette ♡

Evette ♡

1686 likes

A lecture hall scene with students, a lecturer, and a screen showing brain scans. Overlay text discusses the irony of studying psychology and memory while constantly forgetting information.
A lecture hall with students and a screen displaying brain scans. Overlay text advises against rereading and emphasizes retrieval practice for better memory retention through self-testing.
A lecture hall setting with students and a screen showing brain scans. Overlay text promotes automating study tasks using an AI tool to create flashcards and mind maps from lecture materials. An app store interface for a study tool is also visible.
Psychology students tips
#studentstips #study #studytips
Study Tips 📚✏️

Study Tips 📚✏️

28 likes

A visual guide outlining 9 steps to build AI agents from scratch. It details defining the agent's role, inputs/outputs, crafting prompts, adding reasoning and external tools, enabling multi-agent collaboration, handling memory, adding multimodal abilities, formatting outputs, and deploying with API or UI, listing tools for each step.
Build AI Agents Step-by-Step With Real Tools
How to Build AI Agents From Scratch With Real Tools and a Simple Step-by-Step Process Building AI agents from scratch doesn’t have to be confusing This post breaks it all down step by step No coding background needed Just clear instructions, real tools, and everyday examples If you’ve ever
fig3lvls

fig3lvls

96 likes

A hand holds a USbank cashier's check for $6,000.00, representing the down payment and escrow for the home. In the background, a house with a 'COMING SOON' real estate sign is visible, indicating the start of the homebuying process.
The front exterior of the 1950s home in St. Louis, featuring brick siding, light blue shutters, a white front door with the house number 2545, and a well-maintained green lawn.
The interior living room and entryway of the home, showcasing hardwood floors, light gray walls, a sofa, a desk, and a large window with blinds, creating a bright and functional space.
How I Bought My First Home BY MYSELF at 30
I pay $1,817/month for my mortgage (including insurance) for a 2,400 sq ft home in St. Louis, MO—and I did this completely alone as a single mom rebuilding after a toxic 5-year relationship. The Numbers: 💰 Mortgage with Insurance: $1,817 💰 Utilities: $200–500 depending on the season 💰 Total M
Chels ☀️

Chels ☀️

787 likes

STUDY METHODS AS A COLLEGE STUDENT ✨
Studying smarter, not harder has been a game-changer for me in college. Active recall, the Pomodoro method, spaced repetition, and switching up how I study have made all the difference. It’s all about finding what actually works for you and staying consistent. What works for someone else might not
Presleigh C

Presleigh C

120 likes

Fresh fall study tips! 🍂
Every year the way we study evolves with our classes, our technology, and our level of education. This year I’m utilizing some new features on my iPad, as well as some new study techniques that I have learned about. Slide through the pictures above to see exactly what I’m talking about! 😉 #
bea_studies_PA

bea_studies_PA

4 likes

Why I switched to taking notes on my iPad
I used to love writing in notebooks, but after switching to my iPad, I can confidently say I’m never going back! Here’s why: ✨ Cuter Notes – Let’s be real…aesthetic notes make studying more enjoyable! I can use custom colors, cute stickers, and different handwriting styles to make my notes visua
Rebecca R.

Rebecca R.

267 likes

Wanna feel like you’re studying at Hogwarts?
#studygram #studyingtips #studyhabits #studyingtips #anatomystudy
Selina 💻

Selina 💻

6 likes

A woman in a light pink dress stands on a grassy lawn at night, with the text 'OFFICE JOBS NO DEGREE REQUIRED' overlaid. The background shows an outdoor event with lights and people.
An office desk with a laptop and papers, featuring a text overlay detailing the 'Data Entry Clerk' role, including duties like entering and updating information, verifying accuracy, and organizing files, with an average salary of $30,000-$40,000 per year.
An office desk with a mug and a city view, displaying text about 'Administrative Assistant' duties (scheduling, correspondence, data entry, first contact) with an average salary of $40,000-$50,000, and 'Customer Service Representative' duties (inquiries, complaints, orders) with an average salary of $35,000-$45,000.
Office Jobs that DONT Require a College Degree⌨️✨
Hey Girlies🩷✨ Looking for an office job but don’t have a degree? No problem! Here are three rewarding roles you can pursue without a college diploma, along with what they involve and how much you can earn. 1. Administrative Assistant What They Do: Handle clerical tasks such as scheduling
Emilyyy

Emilyyy

393 likes

Business Words - Can you get 7/7?
#quiz #foryou
QuizKingsUSA

QuizKingsUSA

53 likes

Elon Musk has gained access
To your social security
Cjbaker

Cjbaker

187 likes

🆕 Remote Jobs!!! | Entry Level Friendly ‼️☺️
Hey girlies! Here are some recently posted entry level remote jobs! Please feel free to screenshot & apply! The benefits include your standard: 🩺: Health Dental Life Insurance, supplemental insurance 💰: 401k 📝: Generous PTO, Leave (Parental, Bereavement, etc) 🧠: EAP, Wellness i
Tei Renee 🤍☁️✨

Tei Renee 🤍☁️✨

1844 likes

Steps to Homeownership
Here is a basic guide for the steps to home ownership. All of them are important to the process and don’t forget to talk to a trusted and experienced Realtor when you are getting started. If you have questions I’m happy to help! Stacy Kartner RE/MAX 772-834-2238 #lovethetreasurecoast
Stacy Kartner

Stacy Kartner

16 likes

Cause these FREE apps making us money💰
To start earning money with digital products, you don’t need: 🔘a massive following 🔘a lot of money 🔘or extensive experience Digital marketing is a great way to make money online, and it’s only going to get bigger in the future.🔥 To run your digital business effectively, you need to
Mya Chanell

Mya Chanell

467 likes

WH Admin/LAMH & OWN Involved in Databreach
Long Post 🚨: DataBreach Details, Connecting the Dots. OWN Network possibly paying producer of Love & Marriage Huntsville to silence me. Picture 1 is the reason my Instagram account was suspended, I haven’t impersonated anyone. I’m being cyber bullied and my privacy is being consistently vio
staticzag

staticzag

0 likes

9 things to do if you are scraping by financially
Hey everyone! How are you doing? Thank you for clicking here and reading I appreciate it. As you know, I'm all about finance and helping you make better decisions for a healthier financial life. In this post, I’m sharing nine things you can do to improve your finances. Find the ones that fi
Financebabe

Financebabe

84 likes

7 Step Charge off removal
#credit #creditcardtips #creditcard #finance
Crystal | Credit Coach

Crystal | Credit Coach

271 likes

An infographic titled '40+ AI Tools for Social Media Marketing' categorizes various tools. It lists tools for SMM (e.g., Sprout Social, Buffer), Writing (e.g., Writesonic, Jasper.ai), and Design (e.g., Canva, Crello), aimed at social media managers.
40+ AI Tools for Social Media Marketing
Hey new and aspiring social media managers! As you start to gain new clients and build your business, you will need to develop systems and strategies that will help you: 1) Save time 2) Reach larger audiences Here are some ai tools to help you do that! #socialmediatips #socialme
Bria | Social, Design, & AI

Bria | Social, Design, & AI

549 likes

#news #royals #royalsfamilys
F News 68

F News 68

840 likes

A person's face is fragmented by shards reflecting past scenes, illustrating the concept of old memories replaying at night. The title "Why Your Brain Replays Old Memories at Night" is prominently displayed.
A beam of light cuts through darkness, symbolizing fewer distractions at night. The text explains how the brain processes less input, allowing the mind to focus inward and replay memories.
A person sleeps in a dark room with a full moon visible through a window, from which glowing memory fragments float. The text explains memory processing and consolidation during sleep.
#psychologyfacts #psychology #mindset #darkpsychology #mentalhealth
parallaxee

parallaxee

30 likes

A desktop monitor displays the "Surf" browser interface with multiple open windows, including images and text, illustrating enhanced web browsing capabilities. The text "Level Up Your Web browsing" is overlaid.
The "deta.surf" browser interface is shown with multiple open windows displaying images and text, highlighting its integration of browsing, file management, and AI assistance into a single platform.
The "deta.surf" browser displays various organized content, including documents and images, demonstrating its AI-powered management and efficient retrieval of saved screenshots, PDFs, and videos.
Cool new web browser to search and organize
Looking for a browser that's more than just a search tool?  Check out Surf! It's designed to make your digital life smoother. With Surf, you can save and organize screenshots, PDFs, YouTube videos, and files effortlessly.  Its AI assistant helps you find what you need quickly, even ac
Reverelia

Reverelia

38 likes

can I have a rest....NO
REST is a standard protocol for all IT systems to communicate and connect if your system doesn't REST it won't be able to communicate or connect to other systems please visit infotechmentor.com #informationtechnology #mentoring #itmentor
alt+control+start

alt+control+start

2 likes

This image displays the title "3 Step Plan to ace YOUR EXAMS" over a blurred laptop keyboard, introducing a study guide. A white arrow points right, and the Lemon8 logo is visible.
This image illustrates the first study step, "Break It Down," with text explaining to divide material into smaller sections and focus on one topic for better retention, set against a laptop and notebook.
This image details the second study step, "Use Active Recall," advising quizzing oneself or explaining concepts aloud to retrieve information, rather than passive reading, with a laptop and notebook background.
Here’s How You’re Going To Ace Your Exams!
Ace your exams with this 3-step study plan! ✨ First, Break It Down—split your material into smaller sections and focus on one topic at a time for better retention. Second, Use Active Recall by quizzing yourself or explaining concepts aloud to solidify your understanding. Lastly, Review Consist
CompSkyy

CompSkyy

15 likes

How I earn money 💰 daily $500+ passive
How I Earned Money Online While Chilling on Vacation 🌴💻” Body Text: Last week I was on vacation — sipping drinks by the beach while my phone kept sending me payment notifications. This isn’t luck or a scam. I decided to invest in my future by joining The Quantum Leap Program, and it completely
Tanisha financebabe

Tanisha financebabe

25 likes

Mani Jaan

Mani Jaan

1740 likes

You can delete anything from your credit report!
GiGi

GiGi

270 likes

An iPad displays the Notability app, showing "University" notes with "Cybersecurity" and "Programming" notebooks. A stylus rests beside the tablet, illustrating digital note-taking organization.
Four iPads showcase diverse Notability notes, including "Wireless Security Protocols" with diagrams, "Subnetting" with network visuals, "OSI model" concept mapping, and "TCP/IP model" with color-coded highlights, demonstrating visual learning and organization.
Three iPads display Notability notes on "Tools for Protecting Business Operations" for organized reading, "Introduction to Linux, SQL, and Python Programming" for key terms, and "Create a Cybersecurity Portfolio" for quick reference, showcasing effective study methods.
How I Stay Organized and Take Notes in Notability
Staying organized is key to my success, and Notability helps me keep everything on track! I organize all my notes by class into separate notebooks, making it easy to find exactly what I need when it’s time to study. Here’s how I make my notes clear and effective: 1. Draw Diagrams & Use Color
Rebecca R.

Rebecca R.

8 likes

Chapter 9The Journey
The Journey The Great Web- Outside Mortal Time The Great Weaver stood at the edge of the Duat, looking outward through the Web toward her destination. Helheim. The Norse underworld, cold and distant, separated from her not by space but by time. Nearly four thousand years of it. She could have s
Myria

Myria

4 likes

healthcare journey
hey hey besties 🤍 so sorry i’ve been mia. between working full time, school, and clinical your girl been tired. however im getting my notes together to drop an ebook for my medical assistant girlies 🫶🏾. what should be a good price range ? #lemon8diarychallenge #ebook #medicalworker #patie
Lexi 🫧

Lexi 🫧

105 likes

Study hacks for girls
#girlsstuff #studylife #studylife #StudyHacks #studysecrets
Shioppi

Shioppi

0 likes

Green Flags in a Lease
Leases should be clear, not confusing. Don’t be afraid to ask for clarity! #leaseagreement #apartmentessentials #movingchecklist #movingtips #greenflags
The Practical Home

The Practical Home

1 like

VOTE MAYOR 2026 🙏From modernizing 1099 home ownership to ensuring our veterans have a bridge to care—the 6 Pillars are the blueprint for a smarter, safer ATX. Tap the link to join the movement. 🔗✨ New Poll Question: "Which Austin 'First' do you need me to action on DAY 1? 🗳️" • 🔘 30-Day Survivor
Farrah Abraham

Farrah Abraham

16 likes

A list of 51 modules included in the SWC 2.0 Digital Marketing Course, covering topics like affiliate setup, content creation, social media mastery, selling strategies, and various online income streams, presented against a blurred background.
⭐️SWC 2.0 Digital Marketing Course⭐️
⭐️SWC 2.0 Digital Marketing Course⭐️ Learn how to generate 20+ streams of income online with the Selling with Confidence 2.0 course! Resell it for 90% commission and earn up to $10,728 with just 20 sales! Commission Breakdown: 💰 1 Sale = $536.40 💰 2 Sales = $1,072.80 💰 5 Sales = $2,682 💰
Lea Garcia 🖤💛

Lea Garcia 🖤💛

4 likes

Chinese web novels
#newtolemon8 #webnovels #chinesewebnovels
ilovewebnovels

ilovewebnovels

0 likes

https://orcid.org/0009-0002-7219-1363 ⚜️XP
hih_d.g._xp ⚜️

hih_d.g._xp ⚜️

0 likes

Finish strong this semester 📚🙏
#study #studytips #studylife #studyhacks #college
Study Lyfe

Study Lyfe

18 likes

See more