Codify | Convert anything to code! (+Fusion, Roact)

Cover

:sparkles: Convert Instances to code; just like magic!

Get on Itch Get on Github

Codify (formerly Roactify) is a collaborative project between @boatbomber and @csqrl, which converts your pre-existing Roblox Instances into code (v2.1.0 supports all Instances!).

Whether you work with vanilla Instances, or use a framework like Roact or Fusion, Codify has you covered!

Installation

Codify is 100% free to download, but if you like this plugin, please consider sponsoring via the “Sponsor this project” panel!

This project wouldn’t have been possible without the help of @boatbomber and our other contributors. If you’d like to show your support for @boatbomber too, follow the link below to find out how!

Learn more →

itch.io

Help support plugin developers and download the latest version of Codify from itch.io!

Get on Itch

Plugin Marketplace

The simplest way to install Codify is to install it from the plugin marketplace. This gives you access to the latest version of the plugin, and easy updates via the Plugin Management window.

Get on Roblox

Manual Installation

Codify is an open-source plugin. New releases are automatically published to both the Roblox plugin marketplace and GitHub releases. If you’d rather install the plugin manually, download the latest binary (.rbxm or .rbxmx) from the releases page, and drop it into your Studio plugins directory.

Get on GitHub

Overview of Permissions

HTTP Requests

Codify uses HTTP requests to fetch the latest information about Roblox Instances. This is required to enable core plugin functionality, as this is not possible without access to API dumps.

Below is a list of URLs used by Codify (all requests are unauthenticated):

  • https://s3.amazonaws.com/setup.roblox.com/DeployHistory.txt
  • https://s3.amazonaws.com/setup.roblox.com/versionQTStudio
  • https://s3.amazonaws.com/setup.roblox.com/version-{{hash}}-API-Dump.json
  • https://api.github.com/repos/csqrl/codify-plugin/contributors?anon=1

Script Injection

This is a completely optional permission and will not degrade functionality if disabled. You will only be prompted for this permission when selecting the Save to Device button.

This is necessary to the Save to Device feature only. The plugin will temporarily create a ModuleScript inside of ServerStorage that will be used to prompt to save a file to your device. The ModuleScript will be destroyed immediately after closing the save dialogue.

  • Temporary scripts are also unarchivable (.Archivable property set to false). This means that they will not be saved when (auto-)saving your project, or saving/publishing to Roblox.

Screenshots

Screenshot of the Plugin

Open Source Projects

The following open-source projects helped to make Codify possible!

Disclaimer

The code Codify produces is not 100% perfect. You should consider that the snippets produced are not optimal, but that shouldn’t put you off using it!

137 Likes

I’m not someone who’s really ever used Roact before for the one reason that it’s extremely time consuming in order to create one UI components that I could create normally in so much less than that. I’ll be sure to try this out.

6 Likes

I should update this to have a UI at some point, but just keep an eye on the output for now. Really shouldn’t take long if I make the UI using the plugin itself :grin:

2 Likes

I’m starting to design all my UIs with Roact. This is simply a must have, great work! Saved me hours of work!

5 Likes

Very useful, thank you so much.
Is there a reason why ScreenGui and BillboardGui are “invalid selections”?
I tried to convert a BillboardGui to a Roact element, but it got cancelled. However, I found a workaround by parenting the BillboardGui to a Frame then Roactify the Frame.

3 Likes

I think the logic behind it was that you’d render into a ScreenGui (or other LayerCollector), and so it seemed unnecessary to allow “Roactifying” those.

I do plan on updating this plugin though to include a proper UI (probably using the plugin itself to build it), so I will take that feedback on board and ensure you can do that in the updated version.

2 Likes

I was curious on weather or not it is normal to get an error titled “string too long”.

18:25:46.385 - String too long

18:25:46.386 - Stack Begin

18:25:46.386 - Script ‘cloud_4749111907.Roactify.Plugin’, Line 196

18:25:46.387 - Script ‘cloud_4749111907.Roactify.Plugin.Loader’, Line 17

18:25:46.387 - Stack End

I just tried converting a huge UI and I presume it is not meant for this.

1 Like

It’s intended for smaller individual components. There is a limit to the length of a script’s source, so converting an entire UI would generate a string far bigger than the script can store.

I will make sure to add this to my to do list when I get round to updating, and see if I can automate splitting UIs into smaller components somehow.

This plugin is honestly not well made or currently being maintained though. I may update it in future to be more user friendly, but for now it works.

2 Likes

This is awesome! I’ve tried to learn Roact recently and this sure saves a lot during the process. Looking further to the development of this project. Thank you for making this.

3 Likes

How do I select a module as I don’t see a way of doing that

click the roact module in your explorer, and then the destination folder/container for your generated roact component to live in (one at a time, not multi select). finalise your selections by clicking on workspace.

it processes your current selection and is honestly a terrible design for users, but it’s something that should really be improved at some point. since this was just a small utility I made for myself, I never made it user friendly. sorry!

2 Likes

This module is awesome. It saves me a ton of time to convert UI elements to Roact. Thanks for your time making this.

3 Likes

I’m currently delving into the wonderful world of Roact and all of the benefits it has to offer. My biggest and most detrimental concern was the fact that I’d have to spend hours manually creating my UI instead of easily piecing it together in Studio, and this amazing plugin has remedied my concerns entirely!

Thank you very much for making such a useful and applicable plugin!

:clap:

2 Likes

Super helpful plugin; only issue I’ve run into is it doesn’t seem to like UIGradients’ ColorSequence type color property.

image

4 Likes

You’re a lifesaver. This plugin lets me use Roact → lets me dev more effectively. I’m sorry for bumping this, but also not – more people need to see this.

2 Likes

Roactify has been updated with a new UI (well, it didn’t have one before)! This should make it easier and more intuitive to use. I hope you enjoy using the new Roactify!

2 Likes

Small patch published:

image

  • Numbers were previously fixed to three decimal places; they will now truncate to their most significant decimal place (up to three places); e.g. 0.5 will now be output as 0.5 and not 0.500, but 0.529 will still output as 0.529
4 Likes

Is there a github repo for this?

Old Reply

currently not, but I’m more than happy to publish the source once I have my GitHub actions configured to automate the publishing process for this plugin!

for the time being, consider using a browser extension or inserting the plugin to a blank Studio project via the command bar:

game:GetObjects("rbxassetid://4749111907")[1].Parent = workspace

for reference, the following URLs are accessed by this plugin (all requests are unauthenticated):

1 Like

Patch:

  • Snippets are auto-selected when clicking on the snippet
  • Copy hint is displayed when snippet is selected
  • Added PluginAction to allow “Generate Snippet” to be assigned to a keyboard shortcut

@JoelBrd GitHub repo is now live here:

4 Likes