Rumah  >  Artikel  >  hujung hadapan web  >  Cara membina aplikasi hujung belakang tanpa pelayan menggunakan React dan AWS Lambda

Cara membina aplikasi hujung belakang tanpa pelayan menggunakan React dan AWS Lambda

王林
王林asal
2023-09-26 13:07:411277semak imbas

如何利用React和AWS Lambda搭建无服务的后端应用

Cara menggunakan React dan AWS Lambda untuk membina aplikasi back-end tanpa pelayan

Pengenalan:
Dengan pengkomputeran awan tanpa pelayan Dengan perkembangan pesat seni bina, semakin ramai pembangun berhijrah ke model pembangunan aplikasi bahagian belakang tanpa perkhidmatan. Seni bina tanpa pelayan memberikan keanjalan yang lebih besar, skalabiliti mudah dan keberkesanan kos, dan AWS Lambda dan React telah menjadi salah satu pilihan paling popular untuk pembangunan tanpa pelayan. Artikel ini akan memperkenalkan cara menggunakan React dan AWS Lambda untuk membina aplikasi hujung belakang tanpa pelayan dan memberikan contoh kod khusus.

1 Mengapa memilih seni bina yang tidak berfungsi dengan ketara meningkatkan kebolehskalaan dan keanjalan sistem.

    Ketersediaan tinggi: AWS Lambda menggunakan seni bina yang diedarkan, tiada titik kegagalan tunggal, memastikan kebolehpercayaan yang tinggi dan ketersediaan yang tinggi.
  1. Keberkesanan kos: Seni bina tanpa perkhidmatan yang dibilkan mengikut penggunaan boleh mengurangkan kos dengan ketara. Anda hanya perlu membayar untuk setiap pelaksanaan fungsi, mengelakkan overhed mesin maya yang berterusan dalam seni bina tradisional.
  2. Kecekapan pembangunan: Pembangun di bawah seni bina tanpa perkhidmatan boleh menumpukan pada fungsi penulisan dan melaksanakan logik perniagaan, tanpa perlu risau tentang perkara rumit seperti pengurusan pelayan dan penyelenggaraan seni bina.
  3. 2. Langkah asas untuk membina aplikasi hujung belakang tanpa pelayan

Sediakan akaun AWS: Buka tapak web rasmi AWS (https://aws. amazon.com/) daftar dan log masuk ke akaun anda.

    Buat fungsi Lambda: Dalam konsol AWS, pilih perkhidmatan Lambda, klik Cipta Fungsi dan ikut arahan untuk mencipta fungsi Lambda baharu. Anda boleh memilih untuk menggunakan persekitaran masa jalan Node.js.
  1. Tulis kod fungsi: Dalam editor fungsi Lambda, tulis logik kod fungsi tersebut. Berikut ialah contoh mudah:
  2. exports.handler = async (event) => {
        // 处理请求
        const response = {
            statusCode: 200,
            body: JSON.stringify('Hello from Lambda!'),
        };
        return response;
    };
  3. Fungsi Deploy: Selepas selesai menulis kod fungsi, klik Simpan dan gunakan fungsi. Lambda secara automatik akan menetapkan ARN unik (Nama Sumber Amazon), yang akan digunakan dalam perkhidmatan lain.
    Buat Gerbang API: Dalam konsol AWS, pilih perkhidmatan Gerbang API, klik Cipta API dan ikut arahan untuk mencipta Gerbang API baharu.
  1. Konfigurasikan dan gunakan API: Dalam halaman konfigurasi Gerbang API, kaitkan fungsi Lambda baharu dengan Gerbang API dan buat konfigurasi yang diperlukan. Selepas melengkapkan konfigurasi, klik Deploy API.
  2. Test API: Dalam antara muka pengurusan API Gateway, cari API yang baru dibuat dan klik butang ujian. Masukkan parameter yang berkaitan dan klik Laksanakan untuk menguji sama ada fungsi API adalah normal.
  3. 3 Gunakan React untuk pembangunan bahagian hadapan bagi aplikasi bahagian belakang tanpa pelayan

Cipta aplikasi React: Masukkan arahan berikut dalam baris arahan untuk mencipta aplikasi React baharu.

    npx create-react-app my-app
    cd my-app
    npm start
  1. Pasang perpustakaan bergantung yang diperlukan: Untuk menggunakan API Gateway untuk menghantar permintaan, anda perlu memasang perpustakaan axios. Masukkan arahan berikut pada baris arahan.
    npm install axios
  1. Menulis kod bahagian hadapan: Dalam kod aplikasi React, anda boleh menggunakan perpustakaan axios untuk menghantar permintaan HTTP dan memanggil antara muka Gateway API.
    import React, { useState, useEffect } from 'react';
    import axios from 'axios';
    
    function App() {
      const [data, setData] = useState('');
    
      useEffect(() => {
        fetchData();
      }, []);
    
      const fetchData = async () => {
        try {
          const response = await axios.get('<API Gateway的URL>');
          setData(response.data);
        } catch (error) {
          console.error(error);
        }
      };
    
      return (
        <div>
          <h1>{data}</h1>
        </div>
      );
    }
    
    export default App;
  1. Jalankan aplikasi React: Masukkan arahan berikut pada baris arahan untuk memulakan aplikasi React.
    npm start
  1. Pada ketika ini, kami telah menyelesaikan proses membina aplikasi hujung belakang tanpa pelayan menggunakan React dan AWS Lambda. Dengan cara ini, kami boleh melaraskan peruntukan sumber aplikasi back-end secara dinamik mengikut keperluan sebenar, meningkatkan keanjalan dan kebolehskalaan aplikasi sambil mengurangkan kos.
Kesimpulan:

Seni bina tanpa perkhidmatan menyediakan model pembangunan aplikasi bahagian belakang yang lebih cekap, fleksibel dan boleh dipercayai. Dengan AWS Lambda dan React, kami boleh membina aplikasi bahagian belakang tanpa pelayan dengan mudah dan memanggil serta memaparkannya di bahagian hadapan. Saya harap artikel ini akan membantu semua orang memahami dan menggunakan model pembangunan ini.

Atas ialah kandungan terperinci Cara membina aplikasi hujung belakang tanpa pelayan menggunakan React dan AWS Lambda. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn