Aviation Web Learning Lab
EN / ID
Theme

Module 2 - Day 5 of 5

Gemini CLI

Day 5: Polish and Test

Welcome to Day 5 -- the final day of the Laravel Build module! Your app has full CRUD functionality after Day 4. Today is about polishing and testing -- like the final walkaround inspection before signing off an aircraft as airworthy. You will add summary counts to the index page, improve navigation between all pages, create a shared layout so all pages look consistent, add simple CSS styling with color-coded status badges, and test all CRUD flows end-to-end with realistic aviation data. By the end of today, you will have a clean, working application that matches your PRD scope. This is a learning project only -- do not deploy it for real aviation use.

Step 1

Add summary counts to the index page

Concept

A dashboard in a hangar shows how many aircraft are in each maintenance status -- 3 pending, 2 in progress, 5 completed. This gives the team an instant overview. You will add the same kind of summary to your index page: counts of how many maintenance logs are in each status (pending, in-progress, completed). This helps the technician see the overall picture at a glance.

Apply

Modify the index() method in your controller to calculate status counts and pass them to the view. Then update index.blade.php to display the counts above the table.

Prompt

I want to add status summary counts to my maintenance logs index page. Please help me: 1. Update the index() method in MaintenanceLogController to count logs by status: - $pendingCount = MaintenanceLog::where('status', 'pending')->count() - $inProgressCount = MaintenanceLog::where('status', 'in-progress')->count() - $completedCount = MaintenanceLog::where('status', 'completed')->count() Pass all 4 variables ($logs, $pendingCount, $inProgressCount, $completedCount) to the view. 2. Show me the HTML to add at the top of index.blade.php that displays three summary cards: "X Pending", "Y In Progress", "Z Completed" Show me the updated controller method and the HTML summary cards.

Expected Result

The index page should show three summary cards at the top: "X Pending" (with a number), "Y In Progress" (with a number), and "Z Completed" (with a number). These counts should update automatically when you create, update, or delete log entries.

Troubleshooting

  • • If the counts all show 0, make sure you have log entries in the database. Also check that the status values match exactly: "pending", "in-progress", "completed" (not "In Progress" or "in_progress").
  • • If you see "Undefined variable: pendingCount", make sure the index() method is passing the count variables to the view using compact() or the with() method.
Step 2

Improve navigation links across all views

Concept

A well-organized hangar has clear signage so technicians always know where to go and how to get back. Your web application needs the same: consistent navigation links on every page so the user never feels lost. Every page should have a link back to the main list, and pages that lead to each other should have clear connecting links.

Apply

Update all 4 Blade views (index, create, show, edit) to include consistent navigation links. Make sure no page is a dead end -- every page has a way to navigate elsewhere.

Prompt

I need to add consistent navigation links to all my Blade views. Please tell me what navigation links each page should have: 1. index.blade.php: "Add New Log Entry" link (already have this) 2. create.blade.php: "Back to List" link 3. show.blade.php: "Back to List" link and "Edit" link (should already have these) 4. edit.blade.php: "Back to List" link and "Back to View" link Show me the HTML for each navigation link using Laravel's route() helper function. I want simple text links, no CSS yet.

Expected Result

Every page has at least one navigation link. No page is a dead end. You can navigate between all pages: index -> create -> (after submit) index, index -> show -> edit -> (after submit) show, show -> delete -> index. Test every path.

Troubleshooting

  • • If a link shows "Route not defined", check that you are using the correct route name. Run "php artisan route:list --name=maintenance-logs" to see all available route names.
  • • Test every navigation path by clicking through the entire application. If you find a page with no way to navigate back, add a "Back to List" link to that page.
Step 3

Create a shared Blade layout for consistent look

Concept

Every page in an aircraft maintenance logbook has a standard header with the organization name, date, and page number. A shared Blade layout does the same thing for your web app: it provides a common HTML skeleton (head, header, footer) that all pages share. Instead of duplicating the HTML structure in every view, each view extends the layout and only provides its unique content.

Apply

Create a shared layout file at resources/views/layouts/app.blade.php with an HTML skeleton. Then update all 4 views to extend this layout using @extends and @section/@yield.

Prompt

I want to create a shared layout for my Laravel application. Please provide: 1. A complete layout file at resources/views/layouts/app.blade.php that includes: - HTML5 doctype, html, head, body tags - A title that says "Aircraft Maintenance Log" - A simple header with the app name "Aircraft Maintenance Log" and a link to the home page - @yield("content") where page content goes - A simple footer saying "Learning Project -- Not for Real Aviation Use" 2. Show me how to convert my index.blade.php to use @extends("layouts.app") and @section("content") ... @endsection Show me the complete layout file and the updated index.blade.php as an example.

Expected Result

The layout file resources/views/layouts/app.blade.php exists with a complete HTML skeleton and @yield("content"). All 4 views (index, create, show, edit) now use @extends("layouts.app") and wrap their content in @section("content"). Every page has the same header and footer.

Troubleshooting

  • • If you see "View [layouts.app] not found", make sure the layouts folder and app.blade.php file exist at resources/views/layouts/app.blade.php (note: Laravel uses dots instead of slashes for folder paths).
  • • Make sure to remove the old HTML structure from each view when converting to use @extends. Each view should start with @extends, then @section. Remove any stray <html>, <head>, or <body> tags from the individual views.
Step 4

Add simple CSS styling to make the app look clean

Concept

A freshly painted hangar with proper labeling is easier and safer to work in than a cluttered, unlabeled one. Adding CSS styling is like that fresh coat of paint: it makes your application easier to use and more professional-looking. You will add simple CSS for clean table styling, form styling, button colors, and color-coded status badges -- green for completed, yellow for in-progress, and red for pending.

Apply

Add CSS styles to your layout file (layouts/app.blade.php) for tables, forms, buttons, status badges, and overall page styling. Keep it simple -- a single <style> block in the layout head.

Prompt

I want to add simple CSS styling to my Aircraft Maintenance Log application. Please write CSS that goes in a <style> tag in my layout file (layouts/app.blade.php). I need styles for: 1. Body: clean font (sans-serif), light gray background, centered content with max-width 900px 2. Tables: borders, alternating row colors, padding in cells, header row with dark background 3. Forms: labels above inputs, input fields with borders and padding, submit button with blue background and white text 4. Status badges: inline colored badges -- green background for "completed", yellow for "in-progress", red for "pending" 5. Navigation links: simple blue links with hover effect 6. Flash messages: green background for success messages 7. Error messages: red text for validation errors Keep the CSS simple and clean. Show me the complete <style> block.

Expected Result

The application looks clean and professional with a consistent style across all pages. Tables have borders and alternating row colors. Forms have properly spaced inputs. Status values show as colored badges: green for "completed", yellow for "in-progress", red for "pending". Buttons are blue with white text.

Troubleshooting

  • • If styles do not appear, make sure the <style> block is inside the <head> section of your layout file. Also try clearing the view cache: "php artisan view:clear".
  • • For status badges, you may need to add a CSS class to the status text in your Blade template. Use a <span> with a class like "badge badge-completed" around the status text, and define those classes in your CSS.
Step 5

Test all CRUD flows end-to-end with sample data

Concept

Before an aircraft is signed off as airworthy, mechanics perform a full ground test -- every system is tested from start to finish to make sure everything works together. You will do the same with your application: test every CRUD operation with realistic aviation data to make sure the whole system works correctly. This is your full ground test before the final sign-off.

Apply

Test all CRUD operations using your browser. Create 3 sample maintenance log entries with realistic aviation data, view each one, edit one, change its status, and delete one.

Prompt

I need to test my Aircraft Maintenance Log application end-to-end. Please give me a test plan with exactly these test cases: 1. CREATE: Add a new log entry with: aircraft_id "PK-GTA", maintenance_type "routine", description "Routine engine inspection and oil change", technician_name "Budi Santoso", status "completed" 2. CREATE: Add a new log entry with: aircraft_id "PK-ABC", maintenance_type "corrective", description "Replaced left main landing gear tire due to wear", technician_name "Sari Dewi", status "pending" 3. CREATE: Add a new log entry with: aircraft_id "PK-XYZ", maintenance_type "inspection", description "Annual structural inspection of fuselage and wings", technician_name "Ahmad Rahman", status "in-progress" 4. READ: View the detail page for PK-GTA entry 5. UPDATE: Edit the PK-ABC entry, change status from "pending" to "completed" 6. DELETE: Delete the PK-ABC entry (confirm the deletion) For each test case, tell me what page to visit, what to do, and what I should see after. List the steps clearly.

Expected Result

All 6 test cases pass without errors. You successfully created 3 entries (PK-GTA routine, PK-ABC corrective, PK-XYZ inspection), viewed the PK-GTA detail page, updated PK-ABC status to completed, and deleted PK-ABC. The index page shows 2 remaining entries with correct summary counts.

Troubleshooting

  • • If any CRUD operation fails, check the browser's developer console (F12) for JavaScript errors and check the Laravel log file at storage/logs/laravel.log for PHP errors.
  • • If the summary counts are wrong after creating or deleting entries, refresh the page. The counts are calculated on every page load, so they should update automatically.
Step 6

Final review and cleanup

Concept

The final walkaround inspection before a maintenance release -- the last check to make sure nothing was missed. You will review all your files for any TODO comments, unused code, or issues. Make sure the app matches your PRD scope: exactly 1 table (maintenance_logs), CRUD only, no extra features. If everything looks good, your Laravel build is complete!

Apply

Review your entire project for cleanup. Check that all files are correct, there are no TODO comments or unused code, and the app runs without errors.

Prompt

I am doing a final review of my Laravel Aircraft Maintenance Log project. Please help me create a checklist of things to verify: 1. App runs: "php artisan serve" starts without errors 2. All pages load: index, create, show, edit 3. CRUD works: Create, Read, Update, Delete all function correctly 4. Validation works: empty forms are rejected 5. No TODO or FIXME comments in my code files 6. No unused files or leftover code 7. App matches PRD scope: 1 table (maintenance_logs), CRUD only, no extra features What else should I check? Give me a simple list of final verification steps.

Expected Result

Your application runs without errors. All CRUD operations work. Validation prevents bad data. No leftover TODO comments. The app matches your PRD scope exactly: one table (maintenance_logs), CRUD operations only, no extra features. Your Laravel build is complete!

Troubleshooting

  • • If you find any TODO comments or unused code, remove them. A clean codebase is like a clean hangar -- easier to work in and safer.
  • • If the app has features beyond CRUD (like search, login, or multiple tables), remove them. Your scope is strictly one table with four CRUD operations as defined in your PRD.

Safety Warning

This is a learning project -- do not deploy it to a production server or use it for real aircraft maintenance record-keeping. Test all CRUD flows thoroughly before finishing. If you find bugs during final testing, fix them and commit. Back up your work with a final git commit before considering the project complete.

Git Checkpoint

Run these commands to save your completed Day 5 work: git add . git commit -m "Day 5: Polish, validation, and final testing complete" Congratulations! Your Aircraft Maintenance Log application is complete. You built a working Laravel CRUD app in 5 days using 30 prompts. Your work is saved in git at every step.

Self-Check

Quiz