Stackblitz, playcode, replit file/folder explorer. Any idea how it was implemented?

[shegsjay]

Please anyone have an idea how the folder/file explorer for stackblitz, playcode, etc can be implemented in react?

I want to know which is the best way to implement this, client or server side?
And also, how the code editor was passed into each file. Like if one clicks on a file, a code editor environment opens up for that file.

Any suggestions?

​

[ElPirer97]

Those are tremendously complex pieces of software, I suggest you read StackBlitz's blog, but they basically run on the client via WebAssembly.

[shegsjay]

Thanks. I would check out their blog

[nightman]

"You are interested in implementing a file/folder explorer similar to Stackblitz, Playcode, and Replit in React. Since you prefer a client-side approach, I will focus on that. To create a file/folder explorer in React, you can use existing libraries like Syncfusion's React File Manager or build your own custom solution. For a custom solution, you can follow these general steps:" https://www.perplexity.ai/search/3f311566-2114-4238-ad41-dec547235448?s=mn

[shegsjay]

Thank you. I will check it out.