Rumah  >  Artikel  >  hujung hadapan web  >  Pembangunan aplikasi web untuk mencari tiket penerbangan menggunakan Angular 18

Pembangunan aplikasi web untuk mencari tiket penerbangan menggunakan Angular 18

DDD
DDDasal
2024-09-13 22:19:36965semak imbas

Versi ke-18 rangka kerja Angular yang popular telah dikeluarkan baru-baru ini. Pembangunan dinamik, serta minat masyarakat, membantu Angular menjadi salah satu pemimpin. Dalam satu siri artikel, saya akan bercakap tentang versi terkini menggunakan contoh aplikasi untuk mencari dan menempah tiket penerbangan.

Apa yang akan disertakan dalam kursus:

  • Mencipta aplikasi baharu menggunakan CLI Sudut tanpa menggunakan monorepositori Nx;
  • Pelaksanaan teras (Google Analitis, Yandex Metrika);
  • Persediaan projek (linters, penggaya, ssr);
  • Mencipta struktur asas aplikasi;
  • Pelaksanaan UI KIT;
  • Menggunakan keupayaan rangka kerja untuk mencipta halaman yang serupa;
  • Penyepaduan dengan API pihak ketiga.

Semua artikel menerangkan projek haiwan kesayangan yang saya laksanakan - Beli & terbang.

Saya menggunakan travel.alfabank.ru sebagai contoh.

Persoalan mungkin timbul mengapa saya tidak mengambil https://tinkoff.ru/travel. Sungguh menyakitkan saya melihat bekas Tinkoff Bank. Semua yang saya suka tentang dia mula bertakung dan pudar.

Apa yang istimewa tentang projek ini:

  • Isyarat - isyarat akan digunakan untuk input dan secara umum untuk pembolehubah, yang membolehkan anda menyingkirkan changeDetectionRef sepenuhnya.
  • @if, @for, @defer, @let - sintaks templat Sudut baharu.
  • NavigationPaths ialah salah satu penyelesaian untuk menyatukan laluan.
  • MetricService ialah perkhidmatan biasa untuk menghantar analitis ke pelbagai sistem.
  • Penggunaan semula maksimum semua yang mungkin.
  • Pembangunan UI KIT anda sendiri.

Apa yang tidak disertakan dalam siri artikel:

  • Pengoptimuman SSR;
  • Menyediakan SEO penuh (mengembalikan status 404 untuk halaman yang tidak wujud);
  • NgOptimizedImage. Walaupun saya menggunakan arahan imej, ia layak dijadikan bahan berasingan untuk menganalisis semua kehalusan.

Hasil kitaran akan menjadi tapak web dengan carian tiket penerbangan murah.

Разработка веб приложения для поиска авиабилетов на Angular 18

Разработка веб приложения для поиска авиабилетов на Angular 18

Dalam versi mudah alih:

Разработка веб приложения для поиска авиабилетов на Angular 18

Разработка веб приложения для поиска авиабилетов на Angular 18

Anda boleh menonton demo di sini - buy-and-fly.fafn.ru.

Aplikasi menggunakan API luaran - travelpayouts.com.

  • Aviasales - API untuk mencari tiket murah;
  • Hotellook - API untuk mencari hotel.

Sudah tentu, mesti ada pengiklanan daripada Aviasales, tetapi mereka tidak membayar saya?, walaupun saya tidak bertanya.

Cara menggunakan tutorial:

  • Anda boleh melakukan semuanya secara berurutan dan melihat semua artikel satu demi satu.
  • Atau menggunakan github, muat turun dan gunakan aplikasi (kunci daripada travelpayouts akan diperlukan untuk operasi yang betul). Dan semasa analisis, rujuk bahagian yang diperlukan.

Jika anda menghadapi masalah dengan kunci akses API, tulis kepada saya, mungkin saya boleh membantu dengan sesuatu, tetapi secara umum, pendaftaran di travelpayouts.com mengambil masa tidak lebih daripada satu minit.

Dalam artikel seterusnya kita akan melihat cara membuat aplikasi baharu.

Pautan

Semua sumber ada di github, dalam repositori - github.com/Fafnur/buy-and-fly

Anda boleh menonton demo di sini - buy-and-fly.fafn.ru/

Kumpulan saya: telegram, medium, vk, x.com, linkedin, tapak

Atas ialah kandungan terperinci Pembangunan aplikasi web untuk mencari tiket penerbangan menggunakan Angular 18. 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
Artikel sebelumnya:Ruang Nama Matematik & BigIntArtikel seterusnya:Ruang Nama Matematik & BigInt