welcome top courses view using database

app/Http/Controllers/welcomeController.php

@@ -1,10 +1,20 @@
 <?php
 
 namespace App\Http\Controllers;
-
+use App\Models\courses;
 use Illuminate\Http\Request;
 
 class welcomeController extends Controller
 {
-    //
+    
+    public function index()
+    {
+       
+        $courses = courses::where('status', 'active')
+                         ->latest() 
+                         ->take(3)
+                         ->get();
+
+        return view('welcome', compact('courses'));
+    }
 }

resources/views/welcome.blade.php

@@ -827,8 +827,72 @@ body {
     </div>
 </section>
 
+
 {{-- ===================== COURSES SECTION ===================== --}}
 <section class="section courses-section" aria-labelledby="courses-heading">
+    <div class="container">
+        <div class="text-center mb-5 animate-on-scroll fade-up-init">
+            <span class="section-eyebrow"><i class="fa-solid fa-graduation-cap"></i> Academic Programs</span>
+            <h2 id="courses-heading" class="display-5 mb-2" style="font-weight: 700; color:#2D355B;">Our Top Courses</h2>
+            <p class="text-muted fs-5">Explore our professional, industry-recognized automotive engineering curriculums.</p>
+        </div>
+
+        <div class="row g-4 mb-5">
+            @foreach($courses as $key => $course)
+                <div class="col-lg-4 col-md-6 d-flex align-items-stretch animate-on-scroll fade-up-init" style="transition-delay: {{ $key * 100 }}ms;">
+                    <div class="card course-card w-100 d-flex flex-column">
+                        <a href="/courses" style="text-decoration:none;">
+                            <div class="course-image-wrapper">
+                                @if($course->badge)
+                                    <span class="badge-floating"><i class="fa-solid fa-bolt"></i> {{ $course->badge }}</span>
+                                @endif
+                                
+                                <img src="{{ $course->image }}" alt="{{ $course->title }}" loading="lazy">
+                            </div>
+                        
+                            <div class="card-body">
+                                <h4 class="course-title">{{ $course->title }}</h4>
+                                <div class="course-author">
+                                    <i class="fa-solid fa-graduation-cap"></i> {{ $course->author ?? 'Automotive Dept.' }}
+                                </div>
+                                <p class="course-short-desc">{{ Str::limit($course->desc, 120) }}</p>
+                                
+                                <div class="course-features-container">
+                                    <span class="feature-pill"><i class="fas fa-tools"></i> Practical Labs</span>
+                                    <span class="feature-pill"><i class="fas fa-certificate"></i> Accredited</span>
+                                </div>
+
+                                <div class="course-footer">
+                                    <div class="course-meta-row">
+                                        <span class="rating-star">
+                                            <span class="star-rating" style="--rating: {{ $course->rating ?? 5 }};">
+                                                <span class="star-rating-bg">★★★★★</span>
+                                                <span class="star-rating-fill">★★★★★</span>
+                                            </span>
+                                            {{ $course->rating ?? '5.0' }}
+                                            <span class="rating-count">({{ $course->student ?? '0' }} students)</span>
+                                        </span>
+                                        @if($course->status)
+                                            <span class="small fw-bold status-chip" style="color: #2ecc71;"><i class="fa-solid fa-circle-check"></i> {{ ucfirst($course->status) }}</span>
+                                        @endif
+                                    </div>
+                                    <a href="/courses" class="read-btn">View Details <i class="fa-solid fa-arrow-right read-btn-arrow"></i></a>
+                                </div>
+                            </div>
+                        </a>
+                    </div>
+                </div>
+            @endforeach
+        </div>
+
+        <div class="text-center animate-on-scroll fade-up-init">
+            <a href="/courses" class="btn btn-theme" style="background:#822424;">
+                View All Courses <i class="fa-solid fa-arrow-right ms-2"></i>
+            </a>
+        </div>
+    </div>
+</section>
+<!-- <section class="section courses-section" aria-labelledby="courses-heading">
     <div class="container">
         <div class="text-center mb-5 animate-on-scroll fade-up-init">
             <span class="section-eyebrow"><i class="fa-solid fa-graduation-cap"></i> Academic Programs</span>
@@ -926,7 +990,7 @@ body {
             </a>
         </div>
     </div>
-</section>
+</section> -->
 
 {{-- ===================== WHY CHOOSE US ===================== --}}
 <section class="section why-section text-white position-relative overflow-hidden" aria-labelledby="why-us-heading" style="background-attachment: fixed;">
@@ -1005,6 +1069,7 @@ body {
     </div>
 </section>
 
+
 {{-- ===================== COURSE FINDER MODAL ===================== --}}
 
 <div class="modal fade" id="courseFinderModal" tabindex="-1" aria-labelledby="courseFinderModalLabel" aria-hidden="true">
@@ -1072,60 +1137,7 @@ body {
 </div>
 
 
-<!-- <div class="modal fade" id="courseFinderModal" tabindex="-1" aria-labelledby="courseFinderModalLabel" aria-hidden="true">
-    <div class="modal-dialog modal-dialog-centered modal-lg">
-        <div class="modal-content" style="width:60%;">
-            <div class="modal-header custom-modal-header">
-                <h5 class="modal-title fw-bold" id="courseFinderModalLabel">
-                    <i class="fa-solid fa-compass me-2"></i>Find Your Course
-                </h5>
-                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
-            </div>
-            <div class="modal-body p-4">
-                <form id="courseFinderForm">
-                    <div class="mb-3">
-                        <label for="educationLevel" class="form-label fw-semibold text-dark">
-                            <i class="fa-solid fa-user-degree me-1 text-primary"></i> What is your highest educational qualification?
-                        </label>
-                        <select class="form-select border-2" id="educationLevel" required style="  padding: .375rem 2.25rem 2.375rem .75rem;height: 89px;">
-                            <option value="" selected disabled>Select Educational Qualification</option>
-                            <option value="ol">Completed Ordinary Level (O/L)</option>
-                            <option value="al">Completed Advanced Level (A/L)</option>
-                            <option value="diploma">Diploma / Vocational Qualification</option>
-                        </select>
-                    </div>
  
-                    <div class="mb-4">
-                        <label for="interestArea" class="form-label fw-semibold text-dark">
-                             Which area of Automotive Engineering interests you most?
-                        </label>
-                        <select class="form-select border-2" id="interestArea" required style="  padding: .375rem 2.25rem 2.375rem .75rem;height: 89px;">
-                            <option value="" selected disabled>Select Field of Interest</option>
-                            <option value="mechanical">Automotive Mechanical & Diagnostics</option>
-                            <option value="ev">Electric Vehicles (EV) & Battery Technology</option>
-                            <option value="all">General Automotive Engineering (All Areas)</option>
-                        </select>
-                    </div>
-
-                    <button type="submit" class="btn btn-theme w-100" style="background:#822424;">
-                        <i class="fa-solid fa-magnifying-glass me-2"></i>Find Recommended Courses
-                    </button>
-                </form> -->
-
-                {{-- Result Area --}}
-                <!-- <div id="recommendedResults" class="mt-4" style="display: none;">
-                    <hr class="my-4">
-                    <h5 class="fw-bold text-success mb-3">
-                        <i class="fa-solid fa-circle-check me-2"></i>Recommended Courses for You:
-                    </h5>
-                    <div id="resultsContainer" class="row g-3">
-                        
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div> -->
 
 <script>
     document.addEventListener('DOMContentLoaded', function () {
@@ -1161,7 +1173,7 @@ body {
             startSlideTimer();
         }
 
-        // 0b. Stat Counters (count up when scrolled into view)
+        // 0b. Stat Counters 
         const counters = document.querySelectorAll('.count-up');
         if (counters.length) {
             const animateCounter = (el) => {

routes/web.php

@@ -18,6 +18,7 @@ use App\Http\Controllers\AdminResultsController;
 use App\Http\Controllers\AdminProfileController;
 use App\Http\Controllers\AdminTimetableController;
 use App\Http\Controllers\AdminDashboardController;
+use App\Http\Controllers\welcomeController;
 
 /*
 |--------------------------------------------------------------------------
@@ -29,6 +30,12 @@ Route::get('/', function () {
     return view('welcome');
 });
 
+
+ 
+ 
+ 
+Route::get('/', [welcomeController::class, 'index'])->name('welcome');
+
 Route::get('/courses', [coursesController::class, 'index'])->name('courses.index');
 Route::view('/students', 'students')->name('students');
 Route::view('/abouts', 'abouts')->name('abouts');