https://github.com/ndiing/material
Material adalah framework berbasis Material Design yang memudahkan pembuatan antarmuka pengguna yang modern dan responsif.
https://github.com/ndiing/material
design framework javascript lit material scss
Last synced: about 1 year ago
JSON representation
Material adalah framework berbasis Material Design yang memudahkan pembuatan antarmuka pengguna yang modern dan responsif.
- Host: GitHub
- URL: https://github.com/ndiing/material
- Owner: ndiing
- License: mit
- Created: 2024-11-04T18:42:45.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-21T22:24:32.000Z (about 1 year ago)
- Last Synced: 2025-02-21T22:29:49.610Z (about 1 year ago)
- Topics: design, framework, javascript, lit, material, scss
- Language: JavaScript
- Homepage: https://ndiing.github.io/material/dist/#/demo
- Size: 5.57 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Material
Material adalah **front-end framework** yang menggunakan **Webpack**, **Lit**, dan **Material Design 3** ([M3](https://m3.material.io/)). Framework ini dirancang untuk membangun antarmuka web yang modern, ringan, dan efisien.
## Inisialisasi Proyek
Gunakan perintah berikut untuk membuat proyek Webpack baru:
```sh
npx create-new-webpack-app [generation-path] [options]
```
Gantilah `[generation-path]` dengan lokasi proyek yang diinginkan dan `[options]` dengan opsi tambahan jika diperlukan.
## Instalasi
Setelah proyek dibuat, instal dependensi berikut:
```sh
npm install lit
```
Kemudian, instal paket `@ndiing/material` dengan versi yang sesuai:
```sh
npm install @ndiing/material@0.71.11
```
## Struktur Proyek
### File HTML Utama (`./src/index.html`)
```html
Material
```
### Import Komponen dan SCSS (`./src/index.js`)
```js
import "@ndiing/material/src/material/material.scss";
import "@ndiing/material/src/material/material.js";
```
### Konfigurasi Routing (`./src/index.js`)
```js
import { Router } from "@materia/ndiing/src/material/router/router";
Router.use([
{
path: "",
load: () => import("./main/main.js").then((module) => module.default),
},
{
path: "*",
load: () => import("./error/error.js").then((module) => module.default),
},
]);
```
## Tautan Penting
- **Material Design 3**: [M3](https://m3.material.io/)
- **Repository GitHub**: [Material Repo](https://github.com/ndiing/material)
- **Paket GitHub**: [Material Package](https://github.com/ndiing?tab=packages&repo_name=material)
- **Demo Aplikasi**: [Lihat Demo](https://ndiing.github.io/material/dist/#/demo)
- **Dokumentasi API**: [Baca Dokumentasi](https://ndiing.github.io/material/dist/#/docs)
## Lisensi
Proyek ini dirilis di bawah lisensi **MIT**. Silakan baca [LICENSE](LICENSE) untuk informasi lebih lanjut.