TL;DR; This is a fanboy post for CodeSandbox!

Introduction

One of the primary aims of CodeSandbox was to provide a completely native offline development experience in the browser and I just wrote a small component and made a Github repository out of it, all in CodeSandBox.

I just gave it a go and it looks pretty solid to me. This is an embed of the component (again using, yes, you guessed it! CodeSandbox):-

https://medium.com/media/ec59550d7c5be9ce0bd95e1922ef6f55/href

I also changed the underlying repository name and CodeSandbox was able to take care of that.

Notable things:-

1. All commits were made through CodeSandbox.
2. The Github integration (albeit, in beta) looks solid.
3. It has an integration for deploying to Now!
4. Monaco editor (based on VSCode) is sleek and provides a solid — offline like experience with auto-complete and click-to-jump functionality.
5. Integration with Medium (the above link is a CodeSandbox link pasted into Medium).
6. Ability to add npm modules through a web interface.

Component — ReactScrapingProtection

The component itself is pretty basic. The aim is to be able to render strings lazily for it to be protected from bot scraping.

Of course, this applies less to client side only apps, albeit, it is widely belived that Google can understand Javascript.

This component is made for situation when React components are being rendered on the server side with frameworks like next.js.

I have not tested the component yet in SSR environment (both locally and in production)! I was just playing around with CodeSanbox and the API might change.

That’s all for now! Happy coding!