Akryl - React wrapper library

Hello! I’m working on a React wrapper. It is focused on functional components and hooks. You can find it here: GitHub - akryl-kt/akryl-core: Kotlin wrapper for React.JS.

Main points of the library.

  • Idiomatic Kotlin code. less boilerplate.
  • Building UI from functions instead of classes.
  • Compatibility with the React ecosystem: DevTools, Redux, etc.
  • Completely statically typed even in CSS.

Examples are available on GitHub: GitHub - akryl-kt/akryl-examples: Akryl examples.

Also, if you want more real-world code, I’m writing a pet-project using Akryl: GitHub - ashlanderr/shader-sandbox: Visual WebGL shader editor

I’d love to hear any feedback or comments. Thanks!

Could you please explain what is the difference from official Kotlin-react and how it is better?

The main difference is that you can just write a function and it will become a React component. I mean that React DevTools will see the function as a component. With kotlin-react you need to write a props class, a component class, and a builder function to use the component somewhere else. Also, you can use hooks with Akryl.

Nice. I think it would be useful to add that to the documentation. Maybe also an example with comparison to kotlin-react. Also I personally would like to understand what is the difference between those two approaches. Why your component can take any types as a state, but Kotlin react uses only RState.

My components can accept any number of arguments because I’m using a babel plugin, that converts them to the React props. I’d prefer to use a plugin for Kotlin compiler for that, but as I understand there are no public API at the time.

Thank you for reply. I will add this to the documentation.

That looks pretty amazing!