SI Magang (Sistem Informasi Magang) is a web-based internship management system designed to streamline recruitment, assessment, and evaluation of interns for companies or organizations. Built with Vue.js (frontend) and Laravel (backend), it supports intern registration, document uploads, role-based access control, token-based authentication, and a comprehensive admin panel.
Interns can take randomized online tests with strict anti-cheating mechanisms, including Safe Exam Browser (SEB) enforcement, view their status, and receive tailored performance evaluations. Administrators control applicant screening, test management, scoring, and master data (faculties, programs, evaluation criteria).
Fullstack Developer (Vue.js Frontend & Laravel Backend)
Frontend: Vue.js, Vuex, Vue Router, Vuesax UI
Backend: Laravel (REST API)
Database: MySQL
Storage: Local / Cloud for file uploads (PDF)
Authentication: Username/Password with token-based API auth
Other Tools: Rich Text Editor, Custom Form Validator, File Upload Validator, Responsive Notifications
π Authentication & Authorization
Traditional login with secure Bearer Token issuance.
Role-based access (Interns vs Admins).
Token validation + protected routes with middleware.
π Intern Registration Module
Dynamic forms for College Students, High School Students, Public.
File uploads (Application Letter, Resume, Certificates, etc.) with PDF validation.
Strong frontend validations (required fields, min/max length, file type/size).
π§βπ» Intern Test Module
Safe Exam Browser (SEB) Enforcement:
Candidates must download SEB along with my encrypted configuration.
Config is locked and cannot be edited.
If the intern does not use SEB, or tries to modify the config, the exam will fail to start (always error).
This ensures exams are secure, tamper-proof, and environment-controlled.
Test workflow: Not Started β In Progress (with timer, randomized questions) β Completed with results.
Rules & violation handling: auto-disqualification for tab switching, minimizing, or suspicious activity.
Real-time quiz interface with countdown, navigation, and answer tracking.
π€ User Profile
Interns: manage personal info.
Admins: view/manage intern records.
π Intern Dashboard
View application status, scores, and evaluation remarks.
Final result displayed as Passed/Not Passed.
π€ Admin Test Management
CRUD for questions and test sets.
Assign tests to divisions (Programming, Product, etc.).
Configure duration, passing criteria (KKM), and metadata.
Multiple choice questions with Rich Text support.
π Applicant Management (Admin Panel)
Applicant listing with search, pagination, actions (Accept, Reject).
Change intern status: Applicant β Intern β Passed/Failed
π Intern Evaluation Module
Admin scoring with institution-defined custom evaluation criteria (dynamic).
Supports Attitude, Skills, Communication, etc.
βοΈ Master Data Management
Manage Divisions, Faculties, Programs, Institutions.
Dynamic evaluation criteria per institution for flexible assessments.
Secure SEB-based test environment with encrypted, tamper-proof config.
Advanced quiz violation detection + real-time status updates.
Fully role-based, modular, and scalable platform.
Personally designed relational database schema to support all business logic.
π This shows off your security mindset, exam/test logic implementation, and ability to integrate external tools (like SEB) into a Laravel + Vue.js system.
Client Side Preview
Choose Division
Register as Intern Form
Login Page
Update Profile Page
Update Profile Page
Front Page Intern Test Quiz
Quiz Page - Forbidden Actions
Quiz Page - Navigation Number with Done Marks
Quiz Page - Disqualifications Detected
Result Quiz Test - Disqualified Alert
Result Quiz Test - Qualified
Admin Panel Preview
Login (Admin)
Registered Interns
Detail User - Approval Actions
Registered Interns - Accept Actions
List Interns (Accepted)
List Inters (Ready for Assessment)
Assessment Form - Insitution Based Dynamic
Manage Quiz Test
Manage Quiz Test
Manage Quiz Test
Manage Institutions - Dynamic Assessment
Study Program Master Data
Contributed to this project as part of my role at Β Study x Kreasi Putra Hotama.
Aug 2022 - Sep 2022