# PROMPT.md — CMS Portfolio & Free Application Platform

## 1. ROLE

You are a senior full-stack engineer, UI/UX designer, system architect, security engineer, and DevOps engineer.

Build a production-ready personal portfolio website with an integrated CMS. The website owner can manage portfolio projects, free applications, blog posts, advertisements, donation information, profile information, links, and website settings from an admin dashboard.

The website will be hosted on normal web hosting/shared hosting, so the architecture must be practical to deploy, maintain, back up, and scale.

Do not create a static mockup only. Build a real application with a database, authentication, CRUD management, file uploads, validation, responsive UI, SEO support, security controls, and deployment documentation.

---

# 2. PRODUCT CONCEPT

Create a personal developer portfolio website under the branding:

**Ahalam Portfolio**

Primary tagline:

> Build Simple Solutions

The website represents a developer / IT professional who creates:

- Web applications
- Desktop applications
- Mobile applications
- Cinema/technical systems
- IT support solutions
- Automation tools
- Networking/system solutions
- Free applications and tools

The public website must feel like a professional technology portfolio rather than a generic template.

Visual direction:

- Modern
- Professional
- Clean
- Dark technology aesthetic
- Navy/black background
- Electric blue as primary accent
- Subtle gradients
- Rounded cards
- Soft shadows/glows
- Excellent typography
- Strong visual hierarchy
- Responsive on desktop, tablet, and mobile
- Fast loading
- Accessible

The design should be inspired by the supplied portfolio/application page references, but do not copy copyrighted templates or assets.

---

# 3. RECOMMENDED TECHNOLOGY

Preferred stack:

- Backend: Laravel
- Language: PHP 8.2+
- Database: MySQL/MariaDB
- Frontend: Blade + Tailwind CSS
- JavaScript: Alpine.js where appropriate
- Build tool: Vite
- Authentication: Laravel authentication
- Storage: Laravel filesystem
- Icons: Lucide or another lightweight icon library
- QR generation: server-side QR generation or a reliable package
- Web server: Apache/Nginx
- Deployment target: Shared hosting / VPS compatible

Keep dependencies reasonable.

The application must not depend on Node.js being permanently available in production if the hosting environment does not provide it. Production assets should be buildable locally and deployable as compiled assets.

If the existing project has already selected a different stack, preserve the existing stack unless there is a strong technical reason to migrate.

---

# 4. IMPORTANT DEVELOPMENT RULES

## 4.1 Production quality

Do not generate a proof-of-concept.

Implement:

- Proper database schema
- Migrations
- Seeders
- Models
- Relationships
- Controllers/services where appropriate
- Form Requests / validation
- Authentication
- Authorization
- CSRF protection
- XSS protection
- Secure file uploads
- Rate limiting where appropriate
- Error handling
- Logging
- Pagination
- Search/filtering
- SEO metadata
- Open Graph metadata
- Responsive design
- Empty states
- Loading states where useful
- 404 and 500 pages
- Deployment documentation

## 4.2 Code quality

Use:

- Clean architecture
- DRY principles
- Reusable Blade components
- Reusable UI components
- Meaningful names
- Environment variables for secrets
- No hard-coded API keys
- No hard-coded database credentials
- No unnecessary duplicated code

Do not put business logic directly into Blade templates.

## 4.3 Security

Never trust user input.

Implement:

- Request validation
- Authorization policies
- CSRF
- Escaping output
- Secure authentication
- Password hashing
- Login throttling
- Secure file upload validation
- MIME/type validation
- Maximum upload size
- Safe filenames
- Prevent executable file uploads
- Secure admin routes
- Session security
- Security headers where practical

Admin-only content must never be accessible through unauthorized CRUD endpoints.

---

# 5. PUBLIC WEBSITE STRUCTURE

Create these main public pages:

1. `/`
   - Home
2. `/tentang`
   - About
3. `/portofolio`
   - Portfolio listing
4. `/portofolio/{slug}`
   - Portfolio detail
5. `/aplikasi`
   - Free application listing
6. `/aplikasi/{slug}`
   - Application detail/download page
7. `/blog`
   - Blog listing
8. `/blog/{slug}`
   - Blog detail
9. `/kontak`
   - Contact page
10. `/donasi`
   - Donation/support page
11. `/privacy`
   - Privacy policy
12. `/terms`
   - Terms of use

Routes may use Indonesian slugs, but structure them consistently.

---

# 6. HOME PAGE

Build a strong landing page.

## Header

Include:

- Logo
- Ahalam Portfolio branding
- Navigation:
  - Beranda
  - Tentang
  - Portofolio
  - Aplikasi
  - Blog
  - Kontak
- Theme toggle
- Download CV button

Header should become sticky on scroll.

Mobile navigation must use a proper responsive menu.

---

## Hero

Content managed from CMS.

Default content:

Headline:

> Halo, Saya Ahalam

Main role:

> Developer | Web Developer | System Engineer

Description:

> Saya adalah seorang pengembang aplikasi dan sistem yang berfokus pada solusi praktis, efisien, dan mudah digunakan.

Buttons:

- Lihat Portofolio
- Hubungi Saya

Hero should support:

- Profile image
- Background image
- Decorative elements
- CTA buttons

Do not hard-code these values.

---

# 7. ABOUT SECTION

Show:

- Profile photo
- Short biography
- Skills
- Technologies
- Services
- Location
- Contact information
- Experience

Technology badges can include:

- PHP
- Laravel
- Go
- JavaScript
- MySQL
- Linux
- Networking
- System Administration

All content must be CMS-managed.

---

# 8. PORTFOLIO

Portfolio listing must support:

- Featured projects
- Categories
- Technologies
- Search
- Pagination
- Sorting

Each project should have:

- Title
- Slug
- Short description
- Full description
- Featured image
- Gallery
- Category
- Technologies
- Client/project type
- Project URL
- Repository URL
- Demo URL
- Start date
- End date
- Featured flag
- Published status
- SEO title
- SEO description

Portfolio card:

- Image
- Project title
- Short description
- Technology tags
- View Detail button

Portfolio detail:

- Hero image
- Project information
- Gallery
- Problem
- Solution
- Features
- Technologies
- Result
- Links
- Related projects

---

# 9. FREE APPLICATIONS

This is one of the most important sections.

The website owner can publish applications that visitors can download for free.

Application listing page should contain:

- Search
- Category filter
- Platform filter
- Featured applications
- Latest applications
- Pagination

Example applications:

- Cinema Tools
- Absensi Karyawan
- Runchise Helper
- Project Template
- Scan QRIS
- Project Manager

These are examples only and must be manageable from CMS.

---

# 10. APPLICATION DATA MODEL

Each application should support:

- Name
- Slug
- Icon
- Cover image
- Gallery
- Short description
- Full description
- Version
- Release date
- File size
- Developer
- Category
- Platform
- Requirements
- Features
- Changelog
- Download file
- External download URL
- Repository URL
- Documentation URL
- License
- Featured
- Published
- Download counter
- SEO title
- SEO description

Platforms:

- Windows
- Linux
- macOS
- Android
- iOS
- Web

Categories:

- Tools
- Productivity
- Education
- Developer Tools
- Cinema
- Business
- Utilities
- Other

---

# 11. APPLICATION DETAIL PAGE

Design the detail page professionally.

Structure:

1. Application hero
2. Icon
3. Name
4. Version
5. Description
6. Download button
7. Platform
8. File size
9. Release date
10. Features
11. Screenshots
12. Requirements
13. Changelog
14. License
15. Related applications
16. Support/donation CTA

Download button should be prominent.

When a download occurs:

- Increment download counter
- Record timestamp
- Record application ID
- Optionally record a privacy-safe anonymous download event

Do not store unnecessary personal data.

---

# 12. DOWNLOAD SECURITY

Do not expose private storage paths directly if avoidable.

Use a controlled download endpoint.

Example:

`GET /aplikasi/{slug}/download`

Requirements:

- Validate application is published
- Validate download file exists
- Increment counter
- Return secure file download
- Prevent directory traversal
- Prevent arbitrary file access

For large files, design the storage layer so it can later be moved to:

- Cloud storage
- Object storage
- CDN
- External download provider

without redesigning the entire application.

---

# 13. DONATION / SUPPORT

Create a donation system that allows the owner to configure:

## Saweria

Admin can configure:

- Saweria URL
- Display name
- Description
- Button label
- Enable/disable

Example CTA:

> Dukung Karya Saya

Description:

> Jika aplikasi atau karya saya bermanfaat untuk Anda, Anda bisa memberikan dukungan melalui Saweria atau QRIS.

Button:

> Dukung via Saweria

Do not hard-code the Saweria account.

---

## QRIS

Admin can upload:

- QRIS image
- Merchant/name
- Optional payment description

Public page should show:

- QRIS image
- Scan QRIS
- Download QRIS image button
- Payment instructions

QRIS information must be manageable through CMS.

Do not store payment credentials in source code.

---

# 14. ADVERTISEMENT SYSTEM

The website should contain advertising areas that can later be monetized.

Create an advertisement management system.

Admin can create:

- Advertisement title
- Advertiser
- Image/banner
- Destination URL
- Start date
- End date
- Position
- Priority
- Active/inactive
- Open in new tab
- Impression counter
- Click counter

Positions:

- Homepage hero/banner
- Homepage content
- Portfolio page
- Application page
- Application detail
- Blog
- Sidebar
- Footer

The system should automatically display only advertisements that:

- Are active
- Are within their schedule
- Match the requested position

---

# 15. ADVERTISEMENT UI

Use a non-intrusive advertisement component.

Example:

`Iklan & Sponsor`

Banner:

- Responsive
- Rounded
- Clearly marked as advertisement
- Optional carousel
- Optional CTA

Do not make advertisements look like navigation or system controls.

On mobile:

- Banner must remain readable
- Avoid layout overflow
- Do not cover content
- Do not use aggressive popups by default

---

# 16. BLOG

Create a CMS blog.

Blog fields:

- Title
- Slug
- Excerpt
- Content
- Featured image
- Author
- Category
- Tags
- Published date
- Status
- SEO title
- SEO description
- Reading time
- View counter

Support:

- Draft
- Published
- Scheduled if practical

Blog detail must have:

- Proper heading hierarchy
- Table of contents where useful
- Related posts
- Social sharing
- Reading time
- Author
- Date

---

# 17. CONTACT

Create a contact page.

Show:

- Email
- WhatsApp
- Social media
- GitHub
- LinkedIn
- TikTok
- YouTube

Contact form:

- Name
- Email
- Subject
- Message

Requirements:

- Validation
- Rate limiting
- Spam protection strategy
- Store messages in database
- Admin can mark messages:
  - Unread
  - Read
  - Replied
  - Archived

Never expose private contact submissions publicly.

---

# 18. ADMIN CMS

Create an admin dashboard:

`/admin`

Dashboard widgets:

- Total portfolio
- Published portfolio
- Total applications
- Total downloads
- Total blog posts
- Total views
- Active advertisements
- Contact messages
- Recent downloads
- Recent messages

Use a clean professional dashboard.

---

# 19. ADMIN NAVIGATION

Sidebar:

### Dashboard

### Content

- Portfolio
- Applications
- Blog Posts
- Categories
- Tags

### Monetization

- Advertisements
- Donation / Saweria
- QRIS

### Website

- Profile
- Social Links
- Navigation
- Homepage
- SEO
- Media Library

### Communication

- Contact Messages

### System

- Users
- Settings
- Activity Logs

---

# 20. ADMIN ROLES

At minimum:

## Super Admin

Full access.

## Editor

Can manage:

- Portfolio
- Applications
- Blog
- Media

Cannot manage:

- Users
- System settings
- Security settings

Use Laravel authorization policies/gates.

Design the permission system so more roles can be added later.

---

# 21. MEDIA LIBRARY

Create a media library.

Features:

- Upload
- Preview
- Search
- Delete
- Copy URL
- File information

Supported:

- JPG
- JPEG
- PNG
- WEBP
- SVG where safe
- PDF
- ZIP
- EXE only if intentionally supported as an application download

Important:

Do not treat uploaded executable files as normal public media.

Application downloads should use a separate controlled storage strategy.

---

# 22. WEBSITE SETTINGS

Admin settings should include:

## Identity

- Site name
- Logo
- Favicon
- Tagline
- Description

## Contact

- Email
- WhatsApp
- Location
- Business/contact hours if needed

## Social

- GitHub
- LinkedIn
- YouTube
- TikTok
- Instagram
- Other

## Donation

- Saweria URL
- QRIS image
- Donation text

## SEO

- Default title
- Default description
- Default OG image
- Keywords
- Google verification
- Analytics ID

## Appearance

- Primary color
- Dark/light default
- Hero image
- Footer text

---

# 23. SEO

Implement:

- Dynamic `<title>`
- Meta description
- Canonical URL
- Open Graph
- Twitter/X cards
- Structured data where appropriate
- Sitemap
- Robots.txt
- Semantic HTML
- Proper heading hierarchy
- SEO-friendly slugs

Generate sitemap dynamically or through a scheduled mechanism.

For applications and portfolio:

- Use `SoftwareApplication` / relevant schema where appropriate
- Use `CreativeWork` / relevant schema for portfolio
- Use `Article` for blog posts

Do not generate fake ratings/reviews.

---

# 24. PERFORMANCE

Target:

- Fast initial page load
- Optimized images
- WebP/AVIF where practical
- Lazy loading
- Pagination
- Query optimization
- Database indexes
- Avoid N+1 queries
- Cache settings where appropriate
- Cache navigation/content where useful

Do not load huge JavaScript frameworks unnecessarily.

---

# 25. RESPONSIVE DESIGN

Desktop:

- Full navigation
- Multi-column cards
- Sidebar where appropriate

Tablet:

- Reduced columns
- Responsive spacing

Mobile:

- Hamburger menu
- Single-column cards
- Large touch targets
- Responsive images
- Sticky CTA only when useful
- No horizontal overflow

Test at:

- 360px
- 390px
- 768px
- 1024px
- 1280px
- 1440px+

---

# 26. UI DESIGN SYSTEM

Use a consistent design system.

Colors:

- Background: very dark navy/black
- Surface: dark blue
- Primary: electric blue
- Secondary accent: cyan
- Success: green
- Warning: amber
- Danger: red
- Text: white/light gray
- Muted: slate gray

Avoid excessive glow effects.

Use:

- 8px spacing system where practical
- Consistent border radius
- Consistent card padding
- Consistent button styles
- Consistent badges
- Consistent form controls

---

# 27. COMPONENTS

Create reusable components:

- Navbar
- Mobile menu
- Footer
- Hero
- Section heading
- Portfolio card
- Application card
- Blog card
- Technology badge
- Download button
- Donation card
- Saweria card
- QRIS card
- Advertisement banner
- Search bar
- Filter tabs
- Pagination
- Modal
- Toast notification
- Empty state
- Loading state
- Breadcrumb
- Social links
- Contact form

Do not duplicate markup unnecessarily.

---

# 28. DATABASE

Design normalized tables.

Suggested tables:

- users
- profiles
- social_links
- portfolios
- portfolio_images
- technologies
- portfolio_technology
- application_categories
- applications
- application_images
- application_platforms
- application_downloads
- blog_posts
- blog_categories
- blog_tags
- blog_post_tag
- advertisements
- advertisement_impressions
- advertisement_clicks
- donations/settings
- media
- contact_messages
- site_settings
- activity_logs

Adjust the schema if a simpler normalized structure is technically better.

Add:

- indexes
- foreign keys
- cascading rules where appropriate
- timestamps
- soft deletes where useful

---

# 29. DATABASE SEEDER

Create realistic demo data.

Seed:

- Admin user
- Profile
- Social links
- 4+ portfolio projects
- 6+ applications
- Blog categories
- 3+ blog posts
- Advertisement examples
- Donation/Saweria example settings
- QRIS placeholder

Clearly mark demo values so they can easily be replaced.

Never use real payment credentials.

---

# 30. ADMIN UX

Admin forms should be pleasant to use.

Use:

- Labels
- Help text
- Validation messages
- Required indicators
- Image previews
- File previews
- Slug generation
- Confirmation before destructive actions
- Toast notifications
- Pagination
- Search
- Filters
- Bulk actions where useful

For long content, use a proper editor.

---

# 31. FILE STORAGE

Separate files conceptually into:

- Public media
- Portfolio images
- Application assets
- Application downloads
- QRIS
- Profile images
- Blog images

Use Laravel Storage abstraction.

Do not couple business logic to local filesystem paths.

---

# 32. ANALYTICS

Track privacy-conscious metrics:

- Portfolio views
- Application page views
- Application downloads
- Blog views
- Advertisement impressions
- Advertisement clicks

Avoid collecting sensitive information unnecessarily.

Do not store raw IP addresses indefinitely unless there is a clear operational/legal need.

---

# 33. DOWNLOAD COUNTER

Display:

> 1,245 downloads

Use an integer counter.

Prevent obvious repeated refresh abuse where practical.

For stronger implementation, use a separate download event table and aggregate counters.

---

# 34. ADVERTISEMENT COUNTER

Track:

- Impressions
- Clicks
- CTR

Admin dashboard should show:

- Total impressions
- Total clicks
- CTR
- Active ads
- Top-performing ads

---

# 35. ERROR HANDLING

Create:

- 404
- 403
- 419
- 429
- 500

All pages should maintain the site's visual identity.

Do not expose stack traces in production.

---

# 36. ACCESSIBILITY

Implement:

- Keyboard navigation
- Focus states
- Semantic HTML
- Accessible buttons
- Proper form labels
- Alt text
- Sufficient contrast
- Avoid color-only meaning
- ARIA only when necessary

---

# 37. SECURITY CHECKLIST

Before considering the project complete:

- [ ] Authentication secure
- [ ] Passwords hashed
- [ ] CSRF enabled
- [ ] Authorization tested
- [ ] Validation implemented
- [ ] File upload restrictions implemented
- [ ] Directory traversal prevented
- [ ] XSS mitigated
- [ ] SQL injection prevented through ORM/query binding
- [ ] Rate limiting added where appropriate
- [ ] Secrets stored in `.env`
- [ ] `.env` not publicly accessible
- [ ] Debug disabled in production
- [ ] Error pages implemented
- [ ] Admin routes protected
- [ ] Destructive actions confirmed
- [ ] Download endpoints validated

---

# 38. SEO / SOCIAL SHARING

Every public content detail page should support:

- SEO title
- SEO description
- OG title
- OG description
- OG image

If SEO values are empty, automatically fall back to sensible defaults.

---

# 39. DEPLOYMENT

The final project must include documentation:

`README.md`

Include:

1. Requirements
2. Installation
3. Environment configuration
4. Database setup
5. Migration
6. Seeder
7. Storage setup
8. Asset build
9. Local development
10. Production deployment
11. Shared hosting deployment
12. Apache configuration if necessary
13. Queue configuration if used
14. Scheduler configuration if used
15. Backup instructions
16. Updating application
17. Troubleshooting

---

# 40. SHARED HOSTING COMPATIBILITY

Assume the website may be deployed to shared hosting.

Therefore:

- Do not require Docker
- Do not require Redis unless optional
- Do not require Supervisor unless optional
- Avoid long-running workers for core functionality
- Avoid WebSockets unless truly necessary
- Use database-backed alternatives where appropriate
- Provide Apache/public directory deployment instructions
- Ensure storage permissions are documented
- Ensure `APP_URL` configuration is documented

If the host supports Laravel normally, use the recommended public directory structure.

---

# 41. FUTURE EXTENSIBILITY

Architect so the following can be added later:

- User accounts
- Newsletter
- Comments
- Application ratings
- Donation history
- Premium applications
- License keys
- API
- GitHub integration
- Automatic release information
- Cloud storage
- CDN
- Advertisement packages
- Sponsor management
- Analytics dashboard
- Multilingual website

Do not implement unnecessary future features now.

Prepare clean extension points instead.

---

# 42. CONTENT EXAMPLES

Use realistic Indonesian content.

Portfolio examples:

1. Cinema Management System
2. Employee Attendance System
3. CueBox Theater Management System
4. Portfolio Website

Application examples:

1. Cinema Tools
2. Absensi Karyawan
3. Runchise Helper
4. Project Template
5. Scan QRIS
6. Project Manager

These are placeholder examples and must be editable/deletable through the CMS.

---

# 43. HOMEPAGE ORDER

Recommended order:

1. Navbar
2. Hero
3. About
4. Services/Skills
5. Featured Portfolio
6. Free Applications
7. Donation / Support
8. Advertisement
9. Latest Blog
10. Contact CTA
11. Footer

The homepage should not feel overcrowded.

---

# 44. APPLICATION PAGE ORDER

Recommended order:

1. Navbar
2. Hero
3. Search + categories
4. Application grid
5. Sidebar/support area on desktop
6. Donation
7. Advertisement
8. CTA for requesting another application
9. Footer

---

# 45. APPLICATION CARD

Each card should show:

- Icon
- Application name
- Short description
- Platform badges
- Version
- File size
- Release date
- Download button

Example:

> Cinema Tools  
> Tools sederhana untuk kebutuhan operasional bioskop.

Badges:

> Windows · Web

Button:

> Download

---

# 46. APPLICATION DETAIL CTA

Make the download action visually dominant.

Example:

> Download Gratis

Secondary:

> Lihat Dokumentasi

Tertiary:

> Source Code

If no source code is available, do not display the button.

---

# 47. DONATION CTA

Use friendly wording.

Example:

> Dukung Karya Saya

> Jika aplikasi atau karya yang saya bagikan bermanfaat untuk Anda, dukungan Anda membantu saya terus mengembangkan aplikasi dan project lainnya.

Buttons:

- Dukung via Saweria
- Scan QRIS

Do not make donation messaging feel aggressive.

---

# 48. ADVERTISEMENT RULES

Ads should never:

- Break the layout
- Cover important content
- Automatically play audio
- Mislead users
- Look like system notifications
- Prevent navigation

Ads should clearly display:

> Iklan

or

> Sponsor

---

# 49. ADMIN DASHBOARD REPORTS

Provide basic reports:

### Downloads

- Downloads today
- Downloads this week
- Downloads this month
- Total downloads
- Top applications

### Advertisement

- Impressions
- Clicks
- CTR
- Top ads

### Content

- Portfolio count
- Applications count
- Blog count

Use lightweight charts only where useful.

---

# 50. TESTING

Create tests for important functionality.

Minimum:

- Authentication
- Admin authorization
- Portfolio CRUD
- Application CRUD
- Application download
- Download counter
- Blog CRUD
- Advertisement activation
- Advertisement click
- Contact submission
- Settings update

Test both authorized and unauthorized scenarios.

---

# 51. FINAL QUALITY GATE

Before declaring the application complete, verify:

### Frontend

- [ ] Desktop responsive
- [ ] Mobile responsive
- [ ] Navigation works
- [ ] Buttons work
- [ ] Forms work
- [ ] Images optimized
- [ ] Empty states exist
- [ ] Error states exist

### CMS

- [ ] Login works
- [ ] CRUD works
- [ ] Upload works
- [ ] Delete works
- [ ] Search works
- [ ] Filters work
- [ ] Permissions work

### Applications

- [ ] Application listing works
- [ ] Detail page works
- [ ] Download works
- [ ] Download counter works
- [ ] Platform filter works

### Donation

- [ ] Saweria URL configurable
- [ ] QRIS upload configurable
- [ ] Public donation display works

### Advertisement

- [ ] Ads can be created
- [ ] Ads can be scheduled
- [ ] Ads display by position
- [ ] Impressions tracked
- [ ] Clicks tracked

### SEO

- [ ] Meta titles
- [ ] Meta descriptions
- [ ] Sitemap
- [ ] Robots
- [ ] OG metadata
- [ ] Canonical URLs

### Security

- [ ] Admin protected
- [ ] Validation
- [ ] Authorization
- [ ] Secure uploads
- [ ] CSRF
- [ ] No secrets in source code

---

# 52. DEVELOPMENT WORKFLOW

Work in phases.

## Phase 1 — Architecture

- Inspect existing project
- Determine current framework
- Design database
- Design route structure
- Design component architecture

Do not overwrite existing functionality without understanding it.

## Phase 2 — Database

Implement:

- Migrations
- Models
- Relationships
- Seeders

## Phase 3 — Authentication & CMS

Implement:

- Admin authentication
- Roles
- Dashboard
- CRUD

## Phase 4 — Public Website

Implement:

- Homepage
- About
- Portfolio
- Applications
- Blog
- Contact
- Donation

## Phase 5 — Monetization

Implement:

- Advertisement system
- Impression tracking
- Click tracking
- Donation configuration

## Phase 6 — SEO & Performance

Implement:

- Metadata
- Sitemap
- Optimization
- Caching where useful

## Phase 7 — Security & Testing

Run:

- Tests
- Authorization checks
- Upload tests
- Download tests
- Responsive checks

## Phase 8 — Deployment

Provide:

- Production `.env` example
- Database setup
- Storage configuration
- Build commands
- Shared hosting instructions
- Backup instructions

---

# 53. IMPORTANT INSTRUCTION TO THE AI DEVELOPER

Do not stop after creating the frontend.

The expected result is a complete working CMS portfolio platform.

When making implementation decisions:

1. Prefer simple solutions.
2. Prefer maintainability over unnecessary complexity.
3. Prefer Laravel-native functionality.
4. Avoid unnecessary third-party dependencies.
5. Never hard-code content that should be managed from CMS.
6. Never hard-code donation URLs.
7. Never hard-code advertisements.
8. Never expose private files.
9. Never expose secrets.
10. Do not invent credentials.
11. Do not use fake production payment information.
12. Do not claim a feature is complete until it has been implemented and tested.

If something cannot be implemented because required information is missing, create a clear configuration placeholder and document exactly what the owner needs to configure.

---

# 54. EXPECTED FINAL RESULT

The final application should provide two experiences:

## Visitor

A beautiful technology portfolio where visitors can:

- Learn about the developer
- Browse portfolio projects
- Download free applications
- Read documentation
- Read blog posts
- Contact the developer
- Support the developer through Saweria/QRIS
- See relevant advertisements

## Owner

A secure CMS where the owner can:

- Manage profile
- Manage portfolio
- Manage applications
- Upload application files
- Manage downloads
- Manage blog
- Manage advertisements
- Manage Saweria
- Manage QRIS
- Manage social links
- Manage SEO
- Manage media
- Read contact messages
- View basic analytics
- Manage admin users/roles

Build the system as a real production-ready application, not merely a visual demo.