Skip to content
Rapid GUI development using familiar technologies (javascript, flexbox, css)
Branch: master
Clone or download
cztomsik Feature/scroll (#95)
Feature/scroll
Latest commit 1eaa289 Apr 22, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
docs fix docs Apr 21, 2019
example examples housekeeping Apr 1, 2019
examples
native-new
native
src
.editorconfig
.gitignore ffi + tscodegen Feb 14, 2019
.gitmodules webrender submodule -> cargo git dependency Nov 27, 2018
.prettierrc
CONTRIBUTING.md add more docs Jan 12, 2019
Gemfile
Gemfile.lock
LICENSE add LICENSE Dec 9, 2018
README.md
_config.yml
package-lock.json
package.json update deps Apr 21, 2019
tsconfig.json refactor js part; create only one pango context Mar 9, 2019

README.md

title permalink
Home
/

stain

Rapid GUI development using familiar technologies (javascript, flexbox, css)


const App = () => {
  const [count, setCount] = useState(0)
  const dec = () => setCount(count - 1)
  const inc = () => setCount(count + 1)

  return (
    <View style={styles.counter}>
      <Text>{count}</Text>

      <View style={[styles.bar, { width: count * 5 }]} />

      <View style={styles.buttons}>
        <Button title="--" onPress={dec} />
        <Button title="++" onPress={inc} />
      </View>
    </View>
  )
}

const styles = StyleSheet.create({
  counter: {
    flex: 1,
    padding: 20,
    justifyContent: 'space-between'
  },

  bar: {
    backgroundColor: '#ff0000',
    height: 20
  },

  buttons: {
    flexDirection: 'row',
    justifyContent: 'space-between'
  }
})

Status

Please note that we are still finishing major rewrite which started almost 2 months ago (yeah, I know but it was really needed) so some features which has been there originally are now missing, and docs are off (a lot). That said, we've also gained some other cool features along the way (text-align, images, shadow). As with other hobby projects, there are no ETAs, but it's very close now. Follow me on my twitter to get notified :-)

Why it's interesting

  • quick to setup, apart from rust & few libs, it should be just one npm install away
  • can be combined with most of the libraries you already know (react, mobx, lodash, ...)
  • works with existing tooling (debug in vscode, profile in chrome devtools, react-devtools, ...)
  • hot-reload works even without webpack (and it's faster)
  • bundle can be made using already established and mature tools (ncc + electron-builder)
  • low memory footprint (when compared to electron)
  • the language & platform you already know (when compared to flutter)

We use webrender for the actual drawing, yet there is no DOM, so we can be faster and use (much) less memory. Read more here


Documentation

Please refer to respective sub-page on the project website

You can’t perform that action at this time.