I can see why there’s a Developer Inspector Plugin now.
Unfortunately, there’s not a working one for non-Staff 
6 Likes
@potatoprank @minimapletinytools
Does React encourage to use Rodux Store type of styled Components? Or is that even still a thing?
When I found a old copy of the AnimationClipEditor that matches the looks of the current one. One of the things I saw was Rodux Store. And it mapped things to the props, which is really hard to keep track of.
But I’ve effectively understood the unique and special thing about React and the older Roact.
If an update onto the Components is called. All props will update, and update the UI. Something that you can only implement in Class-metatable styled code, if you listen to custom Signals. E.g. setState, no clue if React has that still. Probably, it does, otherwise you’d have to call update manually.
React just does that already through the implementation of its own Components, and I think, only to the tree from where the update was started. It does sound good. Yet I worry about the autocomplete. Even if I found a way to autocomplete the props there’s a bit more.
But these Rodux things, came with Thunks and Actions and in every Thunk there’s a binding to an Action. And then I am left with an Action table that I’ve no clue what it is for.
3 Likes
What’s the difference between useBinding and useState? The documentation gives examples that make them seem interchangeable.
1 Like
Changing states causes the entire component to rerender. Changing the value of a binding only causes whatever element is subscribing to the binding to update.
3 Likes
The react community in general is moving away from redux (rodux = roblox/lua implementation of redux). We’re also moving away from it internally as you saw with AnimationClipEditor. I really don’t like redux for the reasons you mentioned. I don’t know of anyone internally who likes redux either.
I believe for functional components with correctly typed properties, the type checker should in theory be able to autocomplete on the props. I’m not so sure about built-in components (e.g. "frame). I never seem to have my editor setup correctly so I don’t really know what works in practice. Maybe this will work better when we release the new luau typechecker.
I also would not expect autocomplete to work better with roact/class components.
4 Likes
this post is L rizz 
react is good and almost everyone in web dev uses it
3 Likes
Are there any plans to make a jsx for lua?
2 Likes
If React moves away from Redux. Assuming the same would be for react-lua. What will or is going to be the new solution that acts as the alternative?
This is what I’m wondering about. As, I don’t have the newest source of all the available Plugins in Studio, and some yet need to be put into the new Developer Framework, which is still in progress.
Is it just createContext ?
1 Like
As someone with no experience with actual React, it took a ton of tinkering to learn properly, so I’m very happy to see resources being created on the topic and I hope to see more.
I absolutely love React-Lua and the fact that I can use contexts now instead of having to rely on Rodux. It just feels a lot more convenient now.
My usage of React-Lua and its predecessor, Roact, has gotten me excited to work on UI, whereas before it was a bit of a dread. I understand for some people it’d be the exact opposite and that’s okay, but this workflow just… really works for me. 
This is coming from someone that absolutely hated on Roact when I first started learning it, by the way.
That exact blog posted by @Kampfkarren was the single most useful resource for me in learning how to use React-Lua so I highly recommend for people to check it out.
4 Likes
Probably is React.createContext.
Now, what I’ve observed while editing a older AnimationClipEditor version that used Roact and Rodux.
It contained a MainProvider that created rhings that contained the word “Context” which put stuff inside _context with Symbols. Rodux’s guide doesn’t even contain this, it just says to use Rodux.StoreProvider.
But regardless there’s a new thing that I am not sure about now.
For the older version of the AnimationClipEditor, I split up the Rodux Stores and forced them to sync their data together through middlewares with :dispatch. While, this doesn’t sound good… it worked…
But the thing is, I only had to middleware, a few Action types only. But I don’t believe there’s a good way to communicate with multiple stores, especially for inheriting or syncing values. Syncing values does sound bad though.
But there wasn’t a clean way, and now I am wondering about what React has.
I haven’t explored React’s way yet. MainProvider in AnimationClipEditor was too dank for me, because it wanted to use ContextItem stuff. So, I had to use Rodux.StoreProvider anyways to proceed, and store all the stores in a table.
1 Like
ok i’ll bite, sell me on react please.
3 Likes
@HealthyKarl redux (or rodux) is react library for managing state of your react application in a centralized way. If that’s what you want then I guess you should use it? I guess it can be useful for very complex applications. In practice, I see it used for really simple stuff that could have been done with far fewer files and lines of code without it.
If you really want to use the redux pattern in react-lua, there is a useReducer function that is also available in the react js library.
3 Likes
I think useContext might work? Not sure, I’d have to explore it.
When I explored the AnimationClipEditor, I wasn’t really a big fan of Rodux. Especially because I wanted Store inheritance to have multiple instances of Stores while inherting values from other Stores. And I think it didn’t let me mix _context.
Imagine it like a “+ Add Element” button. That has its own data, but also inherits data controlled by a different Component.
In my attempt to modify the AnimationClipEditor: I tried to sync the Playhead Playback Time. Except that there was no global store for it, I made both stores just dispatch the values to each other. (Which I wouldn’t recommend, but it worked for demonstration)
I still don’t know the appropriate way for that yet, for react-lua.
3 Likes
You should know that most internal plugins are very heavy with tech-debt. For example, _context is a long deprecated React feature and new code should be using the useContext hook.
You also probably don’t want to use Rodux for your UI. I’m yet to use it in a project and actually be satisfied with how it is to use. Rodux is very heavy on boilerplate and overall feels terrible to use. Roblox’s internal scripts are not a good example of how to use Rodux.
You should be using useContext and functional components over Rodux and legacy class components with _context.
5 Likes
That’s my aim. To use React.
I am looking at one internal Plugin though.
I just need to figure out the “new ways” for Roact to React.
For instance, RoactRodux had RoactRodux.connect
And I need to either, change something on the Component, to not use props
Or figure out if React has something that maps things onto props (but I don’t like that concept).
I need to figure out what React.createContext exactly does and how it will transfer over Child Components, so I can get rid of old Roact methods.
From the Error given by RoactRodux.connect, RoactRodux.connect Components need a Store Provider in their Ancestry to work. That’s enough information to understand what needs to be replaced.
Maybe this will help me createContext – React
But, the migration docs say that, some things work mixed with React and Roact.
I am unsure about Actions and Thunks. While I think it’s nice to have these single functions at one place, which gives a good overview, I need to think about how that would purely work on React.
Now I need to figure out why it has no Style
Here’s a thing though, my Studio crashed through switching the Studio Theme from Dark to Light with some Stylizer thing.
Edit: omg… it’s because I needed a EnableStyleSheets Value
There we go
Edit:
Now, you also require FFlagEnableStylingEverywhere
2 Likes
what are you talking about rodux and roactrodux work the same with react as they would with roact
1 Like
It’s RoactRodux compared to React. Not Rodux with RoactRodux. 
So far I looked at ReactJS and it seems like useContext and forwardRef looks like what’s needed to get things going, same in react-lua.
Need to experiment with Contexts first, to see if I can use them the same ways Stores were ment to be used.
What is the protocol for tweening?
im making a notifications section and it seems hacky to use refs, i want the notification to fade in and out of transparency.
Maybe theres a library for this?
1 Like
You could create a useState and expose or pass it through props. In react-lua this seems like a fine approach.
If you wouldn’t be using React and just metatables, you’d be doing the same things. Access methods and properties of a different object.
1 Like
Could you give me a code example of how you would make a button expand and de-expand upon hovering?