mabim-himarpl

Mabim-himarpl preview taken November 2024

mabim.himarpl.com is the first one and only website by HIMARPL for providing information about Masa Bimbinagan RPL (Student Orientation Program) at UPI. The website is built using NextJS.

Key Features

Interactive Hero Section with Animated Elements
Dynamic Group/Mentor Information System
Event Timeline & Countdown
FAQ Section
Sponsor & Media Partner Showcase
Responsive Navigation
Smooth Scrolling & Animations
Analytics Integration

Core Dependencies

Framework & Runtime

NextJS
Next Themes
PostHog
React
React DOM

UI Components & Styling

Radix UI Components (Various @radix-ui/* packages)
Tailwind CSS with Custom Configuration
Framer Motion for Animations
Shadcn UI Components
Custom Medieval-themed Components

Design & Animation

Embla Carousel Autoplay
Embla Carousel React
Framer Motion
Lenis

Asset Optimization

Sharp

State Management & Utilities

PostHog for Analytics
Class Variance Authority & clsx for Dynamic Styling
Zod for Type Validation

Project Structure

/src/components/common - Core components
/src/components/ui - Reusable UI components
/src/components/ornament - Decorative elements
/src/assets - Static assets and images
/src/styles - Global styles and Tailwind configuration

Setup Local Development

This guide will walk you through setting up a local development environment for the Mabim HIMARPL website.

Prerequisites

Before installing the application, ensure you have:

Node.js and npm installed
Git installed

Setup Steps

Fork and clone the repository:

git clone https://github.com/himarplupi/mabim-himarpl.git

git clone git@github.com:himarplupi/mabim-himarpl.git

gh repo clone himarplupi/mabim-himarpl

Navigate to project directory:
Terminal window
```
cd mabim-himarpl
```

Set up remote upstream:

git remote add upstream https://github.com/himarplupi/mabim-himarpl.git

git remote add upstream git@github.com:himarplupi/mabim-himarpl.git

gh repo sync himarplu pi/mabim-himarpl

Install dependencies and start development server:
Terminal window
```
npm ci              # Install dependencies
npm run dev         # Start development server
```
The application should now be running at http://localhost:3000.
Create a new branch for your changes:
Terminal window
```
git checkout -b my-feature-branch
```
After you are satisfied with your changes, add and commit them to your branch, then push your branch to your fork.
Terminal window
```
git add .
git commit # Please follow the commit guidelines below
git push -u origin my-feature-branch
```
Before committing and opening a Pull Request, please read Commit Guidelines and Pull Request Policy below.
Create Pull Request.

We request PR authors to avoid rebasing/updating their PRs with the main branch unnecessarily.

Available Scripts

npm run dev - Starts development server with hot reload
npm run build - Creates production build
npm run start - Starts production server
npm run lint - Runs linting checks

Future Migration

Read the future planning on domain management for more information about this mabim-himarpl website. After the migration, this website will be archived and the mabim.himarpl.com domain will be used for the new Mabim website.

Support

For questions or issues:

GitHub Issues
Contact Departemen Kominfo HIMARPL
Visit himarpl.com

License

This project is licensed under the MIT License - see the LICENSE file for details.