01
Public Information Homepage
The homepage introduces Disarpus services, public information, quick access, and recent content.
All Projects
02Frontend Development
Disarpus Kabupaten Bekasi
Responsive frontend implementation for a regional government archives and library website.
- Role
- Web Developer Intern
- Context
- Internship Project
- Year
- 2025 — 2026
disarpus-bekasi / Primary screen
Overview
A responsive public-facing website for Disarpus Kabupaten Bekasi, presenting institutional information, news and articles, quick-access services, and public contact information. During my internship, I contributed to the frontend implementation from Figma designs using Next.js.
Project Focus
- Translate Figma designs into responsive public-facing web pages.
- Present institutional information and service entry points through a clear interface.
- Keep the frontend visually consistent across different screen sizes.
Responsibilities
- Translated Figma designs into responsive Next.js pages.
- Implemented the homepage, navigation, and news-related interfaces.
- Reviewed and fixed layout issues across different screen sizes.
- Collaborated with the team during implementation and refinement.
Technology
Next.jsTypeScriptFigma
Key Features
Disarpus Kabupaten Bekasi / Key Features
02
Institutional Information
Profile-related pages present organizational information, duties, functions, vision, and related public content.
03
News & Articles
Article listing and detail interfaces support publication of news and informational content.
04
Quick Access & Contact
Service shortcuts, location information, contact details, and public communication flows support visitor access.
Technical Implementation
01
Figma-to-Code
Figma designs were used as the visual reference for frontend implementation.
02
Next.js Frontend
Responsive public-facing pages and reusable interface components were implemented with Next.js and TypeScript.
03
Responsive Refinement
Layouts were reviewed and adjusted across different viewport sizes.
Selected Screens
Selected Screens.
03 selected screens
disarpus-bekasi / desktop
Homepage
Public homepage with the main institutional banner and navigation.
disarpus-bekasi / desktop
News & Announcement Listing
Desktop listing interface presenting news and public announcements through a responsive card grid.
Responsive News Experience
Mobile news interface with responsive navigation, search, and single-column article presentation.