Aplikasi Kantin/Jastip: Solusi Praktis untuk Pesan Makanan di Sekolah 📱
🌟 Pendahuluan
Di era digital, teknologi dapat membantu berbagai aktivitas menjadi lebih mudah dan praktis. Salah satunya adalah kegiatan membeli makanan dan minuman di lingkungan sekolah. 🏫✨
Untuk mengatasi antrean yang panjang saat jam istirahat, kita dapat membuat Aplikasi Kantin/Jastip. Aplikasi ini memungkinkan siswa melihat menu, memilih makanan, memasukkan ke keranjang, dan melakukan pemesanan melalui smartphone. 📱🍔
Aplikasi ini dapat dikembangkan menggunakan Flutter dengan bahasa pemrograman Dart.
📱 Apa Itu Aplikasi Kantin/Jastip?
Aplikasi Kantin/Jastip merupakan aplikasi pemesanan makanan dan minuman dari kantin sekolah secara digital.
Pengguna dapat memilih menu yang tersedia kemudian melakukan pemesanan. Pengguna juga dapat memilih layanan jastip (jasa titip) untuk mengambil dan mengantarkan pesanan. 🛵📦
🎯 Tujuan Aplikasi
Beberapa tujuan dari aplikasi ini adalah:
- ⏰ Menghemat waktu siswa.
- 🛒 Mempermudah pemesanan makanan.
- 🚶Mengurangi antrean di kantin.
- 👨🍳Membantu penjual mengelola pesanan.
- 📱 Penerapan teknologi digital di sekolah.
⭐ Fitur Aplikasi
Aplikasi Kantin/Jastip dapat memiliki beberapa fitur, yaitu:
- 🔐 Masuk dan Daftar
- 🏠 Halaman Beranda
- 🍔 Daftar Menu
- 🛒 Keranjang
- 💳 Checkout
- 🛵 Jasa Titip
- 📦 Status Pesanan
- 📜 Riwayat Pesanan
- 👤 Profil Pengguna
💻 Teknologi yang Digunakan
Teknologi yang dapat digunakan dalam pembuatan aplikasi ini:
- 📱 Flutter — kerangka kerja untuk membuat aplikasi.
- 💻 Dart — bahasa pemrograman Flutter.
- 🔥 Firebase — dapat digunakan untuk autentikasi dan database.
- 🖥️ Visual Studio Code / Android Studio — untuk menulis dan menjalankan program.
👨💻 Contoh Coding Flutter
Berikut contoh coding sederhana untuk membuat halaman utama aplikasi Kantin/Jastip.
impor 'paket:flutter/material.dart';
void main() {
jalankanApp(const KantinApp());
}
kelas KantinApp memperluas StatelessWidget {
const KantinApp({super.key});
@mengesampingkan
Widget build(BuildContext context) {
kembalikan MaterialApp(
debugShowCheckedModeBanner: salah,
judul: 'Kantin Jastip',
tema: ThemeData(
primarySwatch: Colors.blue,
),
beranda: const HomePage(),
);
}
}
kelas HomePage extends StatelessWidget {
const HomePage({super.key});
final List<Map<String, dynamic>> menu = const [
{
'nama': 'Seblak',
'harga': 10000,
'ikon': Ikon.ramen_dining,
},
{
'nama': 'Dimsum',
'harga': 12000,
'ikon': Icons.restaurant,
},
{
'nama': 'Es Teh',
'harga': 5000,
'ikon': Icons.local_drink,
},
];
@mengesampingkan
Widget build(BuildContext context) {
kembalikan Perancah(
appBar: AppBar(
title: const Teks('🍔 Kantin Jastip'),
centerTitle: benar,
),
isi: ListView(
padding: const EdgeInsets.all(16),
anak-anak: [
konstanta Teks(
'Selamat Datang 👋',
gaya: Gaya Teks(
Ukuran huruf: 24,
Ketebalan huruf: Ketebalan huruf.tebal,
),
),
const SizeBox(tinggi: 8),
konstanta Teks(
'Pilih makanan dan minuman favoritmu!',
gaya: Gaya Teks (ukuran font: 16),
),
const SizeBox(height: 20),
...menu.peta(
(item) => Kartu(
anak: ListTile(
terdepan: Ikon(
item['ikon'],
ukuran: 35,
),
judul: Teks(
item['nama'],
gaya: konstanta TextStyle(
Ketebalan huruf: Ketebalan huruf.tebal,
),
),
subjudul: Teks(
'Rp ${item['harga']}',
),
trailing:ElevatedButton(
onPressed: () {
ScaffoldMessenger.of(konteks).showSnackBar(
SnackBar(
konten: Teks(
'${item['nama']} ditambahkan ke keranjang 🛒',
),
),
);
},
anak: konstanta Teks('Tambah'),
),
),
),
),
const SizeBox(height: 20),
Tombol yang Ditinggikan.ikon(
onPressed: () {
ScaffoldMessenger.of(konteks).showSnackBar(
const SnackBar(
konten: Teks(
'Jastip berhasil dipilih 🛵📦',
),
),
);
},
ikon: konstanta Icon(Icons.delivery_dining),
label: const Text('Pesan dengan Jastip'),
),
],
),
);
}
}
🧩 Penjelasan Coding
1. Impor Flutter
impor 'paket:flutter/material.dart';
Kode tersebut digunakan untuk mengakses berbagai widget Material Design yang tersedia di Flutter. 🧩
2. Menjalankan Aplikasi
void main() {
jalankanApp(const KantinApp());
}
Bagian ini merupakan fungsi utama yang menjalankan aplikasi Flutter.
3. Membuat Daftar Menu
final List<Map<String, dynamic>> menu = const [
{
'nama': 'Seblak',
'harga': 10000,
},
];
Bagian tersebut digunakan untuk menyimpan data makanan dan harga yang akan ditampilkan pada aplikasi. 🍜💰
4. Tombol Tambah
Tombol Tinggi (
onPressed: () {
// proses tambah ke keranjang
},
anak: konstanta Teks('Tambah'),
)
Tombol Tambah digunakan untuk memasukkan menu yang dipilih ke dalam keranjang. 🛒
5. Tombol Jastip
Tombol yang Ditinggikan.ikon(
onPressed: () {
// proses jastip
},
ikon: konstanta Icon(Icons.delivery_dining),
label: const Text('Pesan dengan Jastip'),
)
Tombol ini digunakan untuk memilih layanan jasa titip. 🛵📦
🔄 Aplikasi Alur
Alur penggunaan aplikasi dapat dijelaskan seperti berikut:
🔐 Login → 🏠 Beranda → 🏪 Pilih Kantin → 🍔 Pilih Menu → 🛒 Keranjang → 💳 Checkout → 🛵 Pilih Jastip → 📦 Diproses → ✅ Selesai
🌈 Kesimpulan
Aplikasi Kantin/Jastip berbasis Flutter merupakan salah satu contoh pemanfaatan teknologi untuk mempermudah pemesanan makanan di lingkungan sekolah. 🍔📱
Dengan adanya aplikasi ini, siswa dapat melihat menu, memilih makanan, melakukan pemesanan, dan menggunakan layanan jastip dengan lebih praktis.
Flutter dan Dart juga dapat digunakan untuk membuat aplikasi dengan tampilan yang menarik dan mudah dikembangkan.
«“Dengan teknologi, pesan makanan jadi lebih mudah, cepat, dan praktis!” 🍔📱✨»
Comments
Post a Comment