🚀 Portal Berita adalah aplikasi berbasis web yang menampilkan berita terbaru menggunakan React dan Vite. Aplikasi ini mengambil data berita dari Mediastack API dan memungkinkan pengguna mencari berita berdasarkan kata kunci.
Proyek ini merupakan portal berita sederhana yang dibangun menggunakan React, React Router, dan Bootstrap (melalui React-Bootstrap) untuk styling. Aplikasi memungkinkan pengguna melihat daftar berita dan detail masing-masing berita melalui navigasi dinamis yang diatur oleh react-router-dom. Pengambilan data dilakukan secara real-time dari API menggunakan fetch di dalam hook useEffect, sementara state dikelola secara lokal dengan useState untuk kebutuhan seperti pencarian dan penyimpanan data berita. Struktur proyek pun dibangun secara modular dengan memisahkan komponen-komponen utama seperti Navigation dan halaman-halaman untuk daftar serta detail berita.
Dalam hal state management, proyek ini memilih pendekatan sederhana menggunakan useState dan useEffect karena kebutuhan data masih terbatas dan hanya digunakan di dalam komponen-komponen tertentu. Pendekatan ini sudah sesuai untuk skala aplikasi saat ini, sehingga belum memerlukan implementasi global state seperti Context API, useReducer, atau Redux Toolkit.
- 🔍 Pencarian berita berdasarkan kata kunci
- 📰 Menampilkan berita terbaru dalam format kartu
- 🎨 Antarmuka responsif menggunakan Bootstrap
- React.js (UI Library)
- Vite (Bundler untuk React)
- React Bootstrap (UI Components)
- Mediastack API (Sumber berita)
- Vercel (Hosting aplikasi)
- Clone repositori ini
git clone https://github.com/ceceyeolie/uts_pemrograman_web_122140086.git
- Masuk ke direktori proyek
cd uts_pemrograman_web_122140086 - Install dependencies
npm install
- Buat file
.env.localdan tambahkan API key:VITE_MEDIASTACK_API_KEY=your_api_key_here - Jalankan aplikasi
npm run dev
- Buka di browser:
http://localhost:5173
Link Demo: https://portal-berita-terbaru.vercel.app/