1.0.2 • Published 2 years ago
vpn-ui-core v1.0.2
VPN UI Core - Design System
The UI Core is a design system dedicated to crafting reusable UI components. Our focus is on aligning with established design principles agreed upon by the design team. This serves as a comprehensive guide for both designers and engineers, ensuring the creation of consistently styled interfaces.
Key Features
- Reusability: The design system prioritizes the development of UI components that are easily reusable across various parts of the application.
- Alignment with Design Standards: Our work is anchored in adherence to predefined design standards, fostering consistency and coherence in the visual elements.
- Guide for Designers and Engineers: The UI Core acts as a guiding resource for designers and engineers alike, streamlining the process of creating visually cohesive and user-friendly interfaces.
- Collaborative Approach: By providing a shared framework, the design system encourages collaboration between design and engineering teams, resulting in a unified and polished user experience.
Run Locally
Clone the project
git clone git@github.com:Dian-Alfabet/vpn-ui-core.gitGo to the project directory
cd vpn-ui-coreInstall dependencies
npm installStart the server
npm run storybookDemo
Insert gif or link to demo
Color Reference
| Color | Hex |
|---|---|
| Example Color | |
| Example Color | |
| Example Color | |
| Example Color |
Running Tests
To run tests, run the following command
npm run testDeployment
To deploy this project run
npm run deployUsage/Examples
import Component from 'my-project'
function App() {
return <Component />
}Optimizations
What optimizations did you make in your code? E.g. refactors, performance improvements, accessibility
Used By
This project is used by the following companies:
- Portal Sekolah Features
- Portal Kerja Features