Post

Project Laravel 11, Filament, React Js, TypeScript: Web Food Recipes

Project Laravel 11, Filament, React Js, TypeScript: Web Food Recipes

🚀 Mengembangkan Keterampilan Web Development dengan Proyek Nyata

Saya telah menyelesaikan proyek Web Food Recipes, yang merupakan bagian dari kelas pengembangan web untuk menguasai teknologi terbaru seperti PHP, JavaScript, Laravel, React JS, dan FilamentPHP.

🔧 Teknologi yang Digunakan

  • Backend: PHP 8, Laravel 11
  • Frontend: React JS 18, TypeScript
  • Database: MySQL
  • CMS: FilamentPHP
  • Tools: Visual Studio Code, Composer, XAMPP/MAMP, Terminal/Command Prompt

🎯 Proyek Utama

Proyek ini bertujuan untuk membangun website penyedia buku resep makanan dengan fitur utama seperti:

  • 🔍 Kategori & Pencarian
  • 📖 Detail Resep & Unduhan PDF
  • 📊 Dashboard CMS Super Admin dengan FilamentPHP
  • 🔗 Manajemen Data dengan API dan MySQL

🔨 Langkah Pengembangan

1️⃣ Membangun Backend:

  • 🔐 Mengembangkan API yang dilindungi CORS dan custom API key.
  • 🔗 Menggunakan API resource untuk integrasi dengan frontend React.

2️⃣ Mengembangkan Frontend:

  • 🎨 Menggunakan React JS dan TypeScript untuk kode yang lebih rapi dan mudah dipelihara.
  • 🏗️ Menerapkan reusable component, props, useState, useEffect, dan hooks lainnya.
  • 🔄 Menggunakan Axios untuk fetching API dan mapping data ke tampilan pengguna.

3️⃣ Quality Assurance:

  • Menggunakan Postman untuk menguji API dan CMS.
  • 📱 Memastikan fitur berjalan dengan baik dan responsif di berbagai perangkat.

🌟 Keunggulan Proyek

  • Super Admin CMS dengan Filament untuk pengelolaan data lebih cepat.
  • API resource yang dapat digunakan oleh frontend React.
  • Testing dengan Postman untuk memastikan endpoint API berjalan dengan baik.
  • Menggunakan TypeScript agar kode lebih terstruktur dan mudah dipelihara.
  • Desain UI/UX responsif dengan pendekatan mobile-first.

📸 Tampilan Website

🔗 Repository GitHub: Lihat Repository Proyek di GitHub 🚀

🚀 Kesimpulan & Harapan

🎉 Itulah perjalanan saya dalam membangun Web Food Recipes dengan Laravel, React, dan Filament! 🍽️💻 Proyek ini bukan hanya sekadar pengembangan teknis, tetapi juga pengalaman berharga dalam membangun solusi yang nyata dan bermanfaat.

💬 Jika kamu punya pertanyaan, kritik, atau saran, jangan ragu untuk berdiskusi di kolom komentar atau menghubungi saya! 📩 Saya selalu senang belajar dari sesama developer dan berbagi wawasan bersama. 🔥

Terima kasih sudah membaca, dan sampai jumpa di proyek berikutnya! 🚀🎯

This post is licensed under CC BY 4.0 by the author.