GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects β†’ we-mobius β†’ mobius-gui

we-mobius / mobius-gui

Licence: GPL-3.0 license
🎨 Reactive & Stream & Driver based UI framework build on Mobius Utils, equipped with neumorphism-derived & utility-first styles.

Programming Languages

typescript
32286 projects
CSS
56736 projects
javascript
184084 projects - #8 most used programming language

Labels

cssframeworkreactiveuiwebstreamfrontendinterfacedriverdeclarativemobiusutility-firstneumorphism

Projects that are alternatives of or similar to mobius-gui

futura
Asynchronous Swift made easy. The project was made by Miquido. https://www.miquido.com/
Stars: ✭ 34 (-20.93%)
Mutual labels:  reactive, stream
Rxviz
Rx Visualizer - Animated playground for Rx Observables
Stars: ✭ 1,471 (+3320.93%)
Mutual labels:  reactive, stream
callbag-rs
Rust implementation of the callbag spec for reactive/iterable programming
Stars: ✭ 25 (-41.86%)
Mutual labels:  reactive, stream
Node Elgato Stream Deck
A Node.js library for interfacing with the Elgato Stream Deck.
Stars: ✭ 359 (+734.88%)
Mutual labels:  stream, interface
Rsocket Java
Java implementation of RSocket
Stars: ✭ 2,099 (+4781.4%)
Mutual labels:  reactive, stream
reactive-rs
Streams and broadcasts: functional reactive programming in Rust.
Stars: ✭ 28 (-34.88%)
Mutual labels:  reactive, stream
Reactivemongo
πŸƒ Non-blocking, Reactive MongoDB Driver for Scala
Stars: ✭ 825 (+1818.6%)
Mutual labels:  reactive, driver
rxjava2-http
Transmit RxJava2 Flowable over http with non-blocking backpressure
Stars: ✭ 19 (-55.81%)
Mutual labels:  reactive, stream
Kefir
A Reactive Programming library for JavaScript
Stars: ✭ 1,769 (+4013.95%)
Mutual labels:  reactive, stream
Marble
Marble.js - functional reactive Node.js framework for building server-side applications, based on TypeScript and RxJS.
Stars: ✭ 1,947 (+4427.91%)
Mutual labels:  reactive, stream
Solid
A declarative, efficient, and flexible JavaScript library for building user interfaces.
Stars: ✭ 13,115 (+30400%)
Mutual labels:  reactive, declarative
Rxjava2 Extras
Utilities for use with RxJava 2
Stars: ✭ 167 (+288.37%)
Mutual labels:  reactive, stream
Easyreact
Are you confused by the functors, applicatives, and monads in RxSwift and ReactiveCocoa? It doesn't matter, the concepts are so complicated that not many developers actually use them in normal projects. Is there an easy-to-use way to use reactive programming? EasyReact is born for this reason.
Stars: ✭ 1,616 (+3658.14%)
Mutual labels:  reactive, stream
Fpgo
Monad, Functional Programming features for Golang
Stars: ✭ 165 (+283.72%)
Mutual labels:  reactive, stream
ency
Enhanced concurrency primitives for Javascript.
Stars: ✭ 32 (-25.58%)
Mutual labels:  reactive, declarative
agera
Reactive Programming for Android
Stars: ✭ 7,267 (+16800%)
Mutual labels:  reactive
stimulus reflex todomvc
An implementation of TodoMVC using Ruby on Rails, StimulusJS, and StimulusReflex
Stars: ✭ 50 (+16.28%)
Mutual labels:  reactive
node-drivers
Industrial protocol drivers in node.js
Stars: ✭ 20 (-53.49%)
Mutual labels:  driver
react-sync
A declarative approach to fetching data via a React higher order component
Stars: ✭ 18 (-58.14%)
Mutual labels:  declarative
escpos-coffee-samples
anastaciocintra.github.io/escpos-coffee
Stars: ✭ 29 (-32.56%)
Mutual labels:  stream
View All Similar Projects βž”

Thoughts Daily Logo

Standard - JavaScript Style Guide Commitizen friendly Commitizen friendly

πŸ“œ English Doc  |  πŸ“œ δΈ­ζ–‡ζ–‡ζ‘£

Mobius GUI - alpha

🎨 Reactive & Stream & Driver based UI framework build on Mobius Utils, equiped with neumorphism-derived & utility-first styles.

This repo will shows latest stage of Mobius GUI before I surely complete the first stable version. We are now on the alpha stage.

The alpha stage means that most (over 70%) of the major features have been developed, and while there are still some uncertainties, there are already far fewer than the preview stage.

The main tasks in alpha stage are refining the base examples, developing complex components and writing documentation.

πŸ’¬ Check todos & roadmaps for more information.

For a quickest preview: visit Mobius GUI preview.

Details

Mobius GUI Preview Release 20200406

Instance

Avatar Center

Preview Site

Empty Seat...

Documentation

Simple Use Example:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Mobius CSS</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@we-mobius/[email protected]/release/styles/mobius.css">
</head>

<body>
  <div class="mobius-width--100vw mobius-height--100vh mobius-layout__vertical">
    <div class="mobius-padding--xl mobius-margin--auto mobius-shadow--normal mobius-rounded--base">
      <div class="mobius-layout__vertical mobius-flex-items--center mobius-select--none">
        <img width="200px" src="./assets/mobius-gui-preview-site-qr.jpg" alt="Scan to preview full feature of Mobius GUI">
        <p class="mobius-text--center mobius-text--xl mobius-font--fantasy">
          <span class="mobius-text--3xl">Hi</span>, developers !
        </p>
        <p>
          Scan to meet full features of Mobius GUI.
        </p>
      </div>
    </div>
  </div>
</body>

</html>

Visit πŸ”—Simple Use Example to see what it looks like.

Since it's just a pure CSS library, you can use it in your own projects with confidence.

However, for insurance purposes, before making sure that you and your team are fully familiar with the 'utility-first' way of CSS organization, it is still recommended that first use it in toy projects.

Here are some tips for you:

  • πŸ’» Read Design Spec. and check source code of Preview Site to know how to use. In the short term, there won't be a User Guide to show you how to use it exactly. Instructions & Documentation are on the way...
  • πŸ’‘ For developers who prefer local build to <link> tag import, it is recommended to enable server compression in production. Due to the large number of verbose variables, use gzip will reduce it from ~110 KB to less than 15 KB (84% compressed, brotli done better). Later I will build a public CDN with Gzip opened, you can use it with a simple <link> tag in your pages instead of local build. jsDelivr is awesome, just use it.
  • ⭐ Star & Watch to follow the latest work I've done. If you have any questions or suggestions, feel free to open an ISSUE (Or you can add my wechat for join our initial community) πŸ€—

All the relative documentations of detail, pls check ./docs，which contains:

Built With

Mobius GUI is inspired by such great works:

Author

License

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

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].